From 4052aee12aeab0d2d233cd76c4f1ebcb67a3e3c3 Mon Sep 17 00:00:00 2001
From: Charlie Park <charlie@oxidecomputer.com>
Date: Fri, 6 Sep 2024 20:24:21 -0700
Subject: [PATCH] better invalidation

---
 app/forms/ip-pool-edit.tsx                 |  9 ---------
 app/pages/project/vpcs/VpcPage/VpcPage.tsx | 10 ++++++++--
 2 files changed, 8 insertions(+), 11 deletions(-)

diff --git a/app/forms/ip-pool-edit.tsx b/app/forms/ip-pool-edit.tsx
index b79432746..615eae981 100644
--- a/app/forms/ip-pool-edit.tsx
+++ b/app/forms/ip-pool-edit.tsx
@@ -41,15 +41,6 @@ export function EditIpPoolSideModalForm() {
       queryClient.invalidateQueries('ipPoolList')
       navigate(pb.ipPool({ pool: updatedPool.name }))
       addToast({ content: 'Your IP pool has been updated' })
-
-      // Only invalidate if we're staying on the same page. If the name
-      // _has_ changed, invalidating ipPoolView causes an error page to flash
-      // while the loader for the target page is running because the current
-      // page's pool gets cleared out while we're still on the page. If we're
-      // navigating to a different page, its query will fetch anew regardless.
-      if (pool.name === updatedPool.name) {
-        queryClient.invalidateQueries('ipPoolView')
-      }
     },
   })
 
diff --git a/app/pages/project/vpcs/VpcPage/VpcPage.tsx b/app/pages/project/vpcs/VpcPage/VpcPage.tsx
index 0cc924c0e..78f841580 100644
--- a/app/pages/project/vpcs/VpcPage/VpcPage.tsx
+++ b/app/pages/project/vpcs/VpcPage/VpcPage.tsx
@@ -8,7 +8,12 @@
 import { useMemo } from 'react'
 import { useNavigate, type LoaderFunctionArgs } from 'react-router-dom'
 
-import { apiQueryClient, useApiMutation, usePrefetchedApiQuery } from '@oxide/api'
+import {
+  apiQueryClient,
+  useApiMutation,
+  useApiQueryClient,
+  usePrefetchedApiQuery,
+} from '@oxide/api'
 import { Networking24Icon } from '@oxide/design-system/icons/react'
 
 import { MoreActionsMenu } from '~/components/MoreActionsMenu'
@@ -31,6 +36,7 @@ VpcPage.loader = async ({ params }: LoaderFunctionArgs) => {
 }
 
 export function VpcPage() {
+  const queryClient = useApiQueryClient()
   const navigate = useNavigate()
   const vpcSelector = useVpcSelector()
   const { project, vpc: vpcName } = vpcSelector
@@ -41,8 +47,8 @@ export function VpcPage() {
 
   const { mutateAsync: deleteVpc } = useApiMutation('vpcDelete', {
     onSuccess() {
+      queryClient.invalidateQueries('vpcList')
       navigate(pb.vpcs({ project }))
-      apiQueryClient.invalidateQueries('vpcList')
       addToast({ content: 'VPC deleted' })
     },
   })