feat(PBI-76): migrate story-panel sort to user-settings store

Single pref (sortMode) — replaces sync localStorage useState
initializer with a selector. Default 'priority' applied at
the read site.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
Janpeter Visser 2026-05-10 12:55:10 +02:00
parent f7602d2582
commit a119d6b12f

View file

@ -1,6 +1,6 @@
'use client'
import { useState, useTransition, useEffect } from 'react'
import { useState, useTransition } from 'react'
import {
DndContext,
DragEndEvent,
@ -26,6 +26,7 @@ import { Badge } from '@/components/ui/badge'
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select'
import { PanelNavBar } from '@/components/shared/panel-nav-bar'
import { useShallow } from 'zustand/react/shallow'
import { useUserSettingsStore } from '@/stores/user-settings/store'
import { useProductWorkspaceStore } from '@/stores/product-workspace/store'
import { selectStoriesForActivePbi } from '@/stores/product-workspace/selectors'
import type { BacklogStory as WorkspaceStory } from '@/stores/product-workspace/types'
@ -132,16 +133,15 @@ export function StoryPanel({ productId, isDemo }: StoryPanelProps) {
const rawStories = useProductWorkspaceStore(useShallow(selectStoriesForActivePbi)) as WorkspaceStory[]
const [filterStatus, setFilterStatus] = useState<string | null>(null)
const [filterPriority, setFilterPriority] = useState<number | null>(null)
const [sortMode, setSortMode] = useState<SortMode>(() => {
const saved = typeof window !== 'undefined' ? localStorage.getItem('scrum4me:story_sort') : null
return (saved === 'priority' || saved === 'code' || saved === 'date') ? saved : 'priority'
})
const sortMode: SortMode = useUserSettingsStore(
(s) => s.entities.settings.views?.storyPanel?.sort ?? 'priority',
)
const setPref = useUserSettingsStore((s) => s.setPref)
const setSortMode = (v: SortMode) => void setPref(['views', 'storyPanel', 'sort'], v)
const [storyDialogState, setStoryDialogState] = useState<StoryDialogState | null>(null)
const [activeDragId, setActiveDragId] = useState<string | null>(null)
const [, startTransition] = useTransition()
useEffect(() => { localStorage.setItem('scrum4me:story_sort', sortMode) }, [sortMode])
// rawStories komt al gesorteerd binnen via selectStoriesForActivePbi.
const storyMap = Object.fromEntries(rawStories.map(s => [s.id, s]))
const orderedStories = rawStories