on instance delete success, invalidate instance list before navigating

oxidecomputer · Aug 20, 2024 · a02992b · a02992b
1 parent 6d2fdf7
commit a02992b
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 10 deletions.
diff --git a/app/pages/project/instances/InstancesPage.tsx b/app/pages/project/instances/InstancesPage.tsx
@@ -10,12 +10,7 @@ import { filesize } from 'filesize'
 import { useMemo } from 'react'
 import { useNavigate, type LoaderFunctionArgs } from 'react-router-dom'
 
-import {
-  apiQueryClient,
-  useApiQueryClient,
-  usePrefetchedApiQuery,
-  type Instance,
-} from '@oxide/api'
+import { apiQueryClient, usePrefetchedApiQuery, type Instance } from '@oxide/api'
 import { Instances16Icon, Instances24Icon } from '@oxide/design-system/icons/react'
 
 import { DocsPopover } from '~/components/DocsPopover'
@@ -55,12 +50,11 @@ InstancesPage.loader = async ({ params }: LoaderFunctionArgs) => {
   return null
 }
 
+const refetchInstances = () => apiQueryClient.invalidateQueries('instanceList')
+
 export function InstancesPage() {
   const { project } = useProjectSelector()
 
-  const queryClient = useApiQueryClient()
-  const refetchInstances = () => queryClient.invalidateQueries('instanceList')
-
   const makeActions = useMakeInstanceActions(
     { project },
     { onSuccess: refetchInstances, onDelete: refetchInstances }

diff --git a/app/pages/project/instances/instance/InstancePage.tsx b/app/pages/project/instances/instance/InstancePage.tsx
@@ -94,7 +94,10 @@ export function InstancePage() {
   const makeActions = useMakeInstanceActions(instanceSelector, {
     onSuccess: refreshData,
     // go to project instances list since there's no more instance
-    onDelete: () => navigate(pb.instances(instanceSelector)),
+    onDelete: () => {
+      apiQueryClient.invalidateQueries('instanceList')
+      navigate(pb.instances(instanceSelector))
+    },
   })
 
   const { data: instance } = usePrefetchedApiQuery(