diff --git a/components/backlog/story-panel.tsx b/components/backlog/story-panel.tsx
index 87db38d..e16d23a 100644
--- a/components/backlog/story-panel.tsx
+++ b/components/backlog/story-panel.tsx
@@ -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