fix(recently-deleted): dim the list and disable Restore while a new view loads

Author: waleedlatif1

apps/sim/app/workspace/[workspaceId]/settings/components/recently-deleted/recently-deleted.tsx

@@ -1,7 +1,7 @@
 'use client'
 
 import { useMemo, useState } from 'react'
-import { Chip, ChipInput, ChipModalTabs } from '@sim/emcn'
+import { Chip, ChipInput, ChipModalTabs, cn } from '@sim/emcn'
 import { Search } from '@sim/emcn/icons'
 import { formatDate } from '@sim/utils/formatting'
 import { useParams, useRouter } from 'next/navigation'
@@ -234,8 +234,15 @@ export function RecentlyDeleted() {
   const restoreWorkspaceFileFolder = useRestoreWorkspaceFileFolder()
   const restoreChat = useRestoreMothershipChat(workspaceId)
 
-  const { hasNextPage, isFetchingNextPage, isFetchNextPageError, fetchNextPage, isLoading, error } =
-    deletedQuery
+  const {
+    hasNextPage,
+    isFetchingNextPage,
+    isFetchNextPageError,
+    fetchNextPage,
+    isLoading,
+    isPlaceholderData,
+    error,
+  } = deletedQuery
 
   const loadMoreRef = useLoadMoreSentinel({
     onLoadMore: fetchNextPage,
@@ -396,7 +403,9 @@ export function RecentlyDeleted() {
           <SettingsEmptyState>No deleted items</SettingsEmptyState>
         )
       ) : (
-        <div className={RESOURCE_LIST_STACK}>
+        <div
+          className={cn(RESOURCE_LIST_STACK, isPlaceholderData && 'opacity-50 transition-opacity')}
+        >
           {filtered.map((resource) => {
             const isRestoring = restoringIds.has(resource.id)
             const isRestored = restoredItems.has(resource.id)
@@ -436,7 +445,11 @@ export function RecentlyDeleted() {
                       View
                     </Chip>
                   ) : (
-                    <Chip variant='primary' onClick={() => void handleRestore(resource)}>
+                    <Chip
+                      variant='primary'
+                      disabled={isPlaceholderData}
+                      onClick={() => void handleRestore(resource)}
+                    >
                       Restore
                     </Chip>
                   )