Better handling of slugs and library item lists in the cache

packages/web/lib/hooks/useLibraryItemActions.tsx

@@ -4,23 +4,27 @@ import {
   showSuccessToast,
   showSuccessToastWithUndo,
 } from '../toastHelpers'
-import { updatePageMutation } from '../networking/mutations/updatePageMutation'
-import { State } from '../networking/fragments/articleFragment'
 import {
   useArchiveItem,
   useDeleteItem,
   useMoveItemToFolder,
+  useRestoreItem,
 } from '../networking/library_items/useLibraryItems'
 
 export default function useLibraryItemActions() {
   const archiveItem = useArchiveItem()
   const deleteItem = useDeleteItem()
   const moveItem = useMoveItemToFolder()
+  const restoreItem = useRestoreItem()
 
-  const doArchiveItem = useCallback(async (itemId: string) => {
+  const doArchiveItem = useCallback(async (itemId: string, slug: string) => {
     const result = await archiveItem.mutateAsync({
-      linkId: itemId,
-      archived: true,
+      itemId: itemId,
+      slug: slug,
+      input: {
+        linkId: itemId,
+        archived: true,
+      },
     })
 
     console.log('result: ', result)
@@ -33,33 +37,37 @@ export default function useLibraryItemActions() {
     return !!result
   }, [])
 
-  const doDeleteItem = useCallback(async (itemId: string, undo: () => void) => {
-    const result = await deleteItem.mutateAsync(itemId)
+  const doDeleteItem = useCallback(
+    async (itemId: string, slug: string, undo: () => void) => {
+      const result = await deleteItem.mutateAsync({ itemId, slug })
 
-    if (result) {
-      showSuccessToastWithUndo('Item removed', async () => {
-        const result = await updatePageMutation({
-          pageId: itemId,
-          state: State.SUCCEEDED,
+      if (result) {
+        showSuccessToastWithUndo('Item removed', async () => {
+          const result = await restoreItem.mutateAsync({ itemId, slug })
+
+          undo()
+
+          if (result) {
+            showSuccessToast('Item recovered')
+          } else {
+            showErrorToast('Error recovering, check your deleted items')
+          }
         })
+      } else {
+        showErrorToast('Error removing item', { position: 'bottom-right' })
+      }
 
-        undo()
+      return !!result
+    },
+    []
+  )
 
-        if (result) {
-          showSuccessToast('Item recovered')
-        } else {
-          showErrorToast('Error recovering, check your deleted items')
-        }
-      })
-    } else {
-      showErrorToast('Error removing item', { position: 'bottom-right' })
-    }
-
-    return !!result
-  }, [])
-
-  const doMoveItem = useCallback(async (itemId: string) => {
-    const result = await moveItem.mutateAsync({ itemId, folder: 'inbox' })
+  const doMoveItem = useCallback(async (itemId: string, slug: string) => {
+    const result = await moveItem.mutateAsync({
+      itemId,
+      slug,
+      folder: 'inbox',
+    })
     if (result) {
       showSuccessToast('Moved to library', { position: 'bottom-right' })
     } else {

packages/web/lib/hooks/useSetPageLabels.tsx

@@ -11,7 +11,8 @@ export type LabelsDispatcher = (action: {
 }) => void
 
 export const useSetPageLabels = (
-  articleId?: string
+  libraryItemId?: string,
+  libraryItemSlug?: string
 ): [{ labels: Label[] }, LabelsDispatcher] => {
   const setItemLabels = useSetItemLabels()
   const saveLabels = (labels: Label[], articleId: string) => {
@@ -19,6 +20,7 @@ export const useSetPageLabels = (
       if (articleId) {
         const result = await setItemLabels.mutateAsync({
           itemId: articleId,
+          slug: libraryItemSlug,
           labels,
         })
         if (!result) {
@@ -91,13 +93,13 @@ export const useSetPageLabels = (
     dispatchLabels({
       type: 'UPDATE_ARTICLE_ID',
       labels: [],
-      articleId: articleId,
+      articleId: libraryItemId,
     })
-  }, [articleId])
+  }, [libraryItemId])
 
   const [labels, dispatchLabels] = useReducer(labelsReducer, {
     labels: [],
-    articleId: articleId,
+    articleId: libraryItemId,
     throttledSave: debouncedSave,
   })