Generated by Spark: I moved a card, which works fine, but Redux doesnt react, which is weird as Redux is really good at this.

src/components/SnippetManagerRedux.tsx

@@ -29,6 +29,7 @@ import {
   createSnippet,
   updateSnippet,
   deleteSnippet,
+  moveSnippet,
   toggleSelectionMode,
   toggleSnippetSelection,
   selectAllSnippets as selectAllSnippetsAction,
@@ -142,6 +143,12 @@ export function SnippetManagerRedux() {
     dispatch(openViewer(snippet))
   }, [dispatch])
 
+  const handleMoveSnippet = useCallback(async () => {
+    if (selectedNamespaceId) {
+      dispatch(fetchSnippetsByNamespace(selectedNamespaceId))
+    }
+  }, [dispatch, selectedNamespaceId])
+
   const handleCreateNew = useCallback(() => {
     dispatch(openDialog(null))
   }, [dispatch])
@@ -401,6 +408,7 @@ export function SnippetManagerRedux() {
             onEdit={handleEditSnippet}
             onDelete={handleDeleteSnippet}
             onCopy={handleCopyCode}
+            onMove={handleMoveSnippet}
             selectionMode={selectionMode}
             isSelected={selectedIds.includes(snippet.id)}
             onToggleSelect={handleToggleSnippetSelection}

src/store/slices/snippetsSlice.ts

@@ -7,6 +7,7 @@ import {
   deleteSnippet as deleteSnippetDB,
   getSnippetsByNamespace,
   bulkMoveSnippets as bulkMoveSnippetsDB,
+  moveSnippetToNamespace,
 } from '@/lib/db'
 
 interface SnippetsState {
@@ -73,6 +74,14 @@ export const deleteSnippet = createAsyncThunk(
   }
 )
 
+export const moveSnippet = createAsyncThunk(
+  'snippets/move',
+  async ({ snippetId, targetNamespaceId }: { snippetId: string, targetNamespaceId: string }) => {
+    await moveSnippetToNamespace(snippetId, targetNamespaceId)
+    return { snippetId, targetNamespaceId }
+  }
+)
+
 export const bulkMoveSnippets = createAsyncThunk(
   'snippets/bulkMove',
   async ({ snippetIds, targetNamespaceId }: { snippetIds: string[], targetNamespaceId: string }) => {
@@ -144,13 +153,13 @@ const snippetsSlice = createSlice({
       .addCase(deleteSnippet.fulfilled, (state, action) => {
         state.items = state.items.filter(s => s.id !== action.payload)
       })
+      .addCase(moveSnippet.fulfilled, (state, action) => {
+        const { snippetId, targetNamespaceId } = action.payload
+        state.items = state.items.filter(s => s.id !== snippetId)
+      })
       .addCase(bulkMoveSnippets.fulfilled, (state, action) => {
         const { snippetIds, targetNamespaceId } = action.payload
-        state.items.forEach(snippet => {
-          if (snippetIds.includes(snippet.id)) {
-            snippet.namespaceId = targetNamespaceId
-          }
-        })
+        state.items = state.items.filter(s => !snippetIds.includes(s.id))
         state.selectedIds = []
         state.selectionMode = false
       })