tweaks

web/features/deployments/data.ts

@@ -12,8 +12,7 @@ import type {
   ListReleaseHistoryReply,
 } from '@/contract/console/deployments'
 import { queryOptions } from '@tanstack/react-query'
-import { getQueryClient } from '@/context/get-query-client'
-import { consoleClient, consoleQuery } from '@/service/client'
+import { consoleClient } from '@/service/client'
 
 const DEPLOYMENT_PAGE_SIZE = 100
 const DEPLOYMENT_APP_DATA_STALE_TIME = 30 * 1000
@@ -136,10 +135,7 @@ export const deploymentAppDataQueryOptions = (appId: string) =>
   })
 
 export const refreshDeploymentAppData = async (appId: string): Promise<DeploymentAppData> => {
-  return getQueryClient().fetchQuery({
-    ...deploymentAppDataQueryOptions(appId),
-    staleTime: 0,
-  })
+  return fetchDeploymentAppData(appId)
 }
 
 const wait = (delay: number) => new Promise(resolve => setTimeout(resolve, delay))
@@ -162,12 +158,6 @@ export const refreshDeploymentAppDataWhenReady = async (appId: string): Promise<
   throw lastError
 }
 
-export const refreshDeploymentLists = async () => {
-  await getQueryClient().invalidateQueries({
-    queryKey: consoleQuery.deployments.list.key(),
-  })
-}
-
 export const waitForAppInstanceInDeploymentList = async (appInstanceId: string): Promise<ListAppDeploymentsReply | undefined> => {
   let lastError: unknown
 
@@ -188,8 +178,6 @@ export const waitForAppInstanceInDeploymentList = async (appInstanceId: string):
     }
   }
 
-  await refreshDeploymentLists()
-
   if (lastError)
     throw lastError
 

web/features/deployments/hooks/use-source-apps.ts

@@ -18,6 +18,7 @@ type UseSourceAppsOptions = {
 export function useSourceApps(options: UseSourceAppsOptions = {}) {
   const { enabled = true, environmentId, keyword, notDeployed } = options
   const instancesById = useDeploymentsStore(state => state.instancesById)
+  const listRefreshToken = useDeploymentsStore(state => state.listRefreshToken)
 
   const query = useMemo(() => ({
     pageNumber: 1,
@@ -27,12 +28,20 @@ export function useSourceApps(options: UseSourceAppsOptions = {}) {
     ...(keyword?.trim() ? { query: keyword.trim() } : {}),
   }), [environmentId, keyword, notDeployed])
 
-  const listQuery = useQuery(consoleQuery.deployments.list.queryOptions({
+  const listQueryOptions = consoleQuery.deployments.list.queryOptions({
     input: { query },
-    queryFn: () => useDeploymentsStore.getState().fetchSourceApps(query),
     enabled,
     staleTime: 30 * 1000,
-  }))
+  })
+
+  const listQuery = useQuery({
+    ...listQueryOptions,
+    queryKey: [
+      ...consoleQuery.deployments.list.queryKey({ input: { query } }),
+      listRefreshToken,
+    ],
+    queryFn: () => useDeploymentsStore.getState().fetchSourceApps(query),
+  })
 
   const appIds = useMemo(() => {
     return (listQuery.data?.data ?? [])

web/features/deployments/store.ts

@@ -15,7 +15,6 @@ import {
   patchDeveloperAPI,
   refreshDeploymentAppData,
   refreshDeploymentAppDataWhenReady,
-  refreshDeploymentLists,
   toAppInfoFromOverview,
   toAppInfoFromSummary,
   undeployEnvironment,
@@ -63,6 +62,7 @@ export type CreateInstanceResult = {
 type DeploymentsState = {
   instancesById: Record<string, AppInfo>
   appData: Record<string, DeploymentAppData>
+  listRefreshToken: number
   createdApiToken?: CreatedApiToken
 
   deployDrawer: {
@@ -91,6 +91,7 @@ type DeploymentsState = {
 
   upsertInstances: (apps: AppInfo[]) => void
   applyAppData: (data: DeploymentAppData) => void
+  bumpDeploymentListRefresh: () => void
   fetchSourceApps: (query: ListAppDeploymentsQuery) => Promise<ListAppDeploymentsReply>
   fetchAppData: (appId: string) => Promise<DeploymentAppData>
   refreshAppData: (appId: string) => Promise<void>
@@ -123,6 +124,7 @@ type DeploymentsState = {
 export const useDeploymentsStore = create<DeploymentsState>((set, get) => ({
   instancesById: {},
   appData: {},
+  listRefreshToken: 0,
   createdApiToken: undefined,
 
   deployDrawer: { open: false },
@@ -164,6 +166,10 @@ export const useDeploymentsStore = create<DeploymentsState>((set, get) => ({
     },
   })),
 
+  bumpDeploymentListRefresh: () => set(state => ({
+    listRefreshToken: state.listRefreshToken + 1,
+  })),
+
   fetchSourceApps: async (query) => {
     const response = await listAppDeployments(query)
     const apps = response.data
@@ -210,7 +216,7 @@ export const useDeploymentsStore = create<DeploymentsState>((set, get) => ({
         get().upsertInstances(apps)
       }),
     ])
-    await refreshDeploymentLists()
+    get().bumpDeploymentListRefresh()
     return {
       appInstanceId: response.appInstanceId,
       initialRelease: response.initialRelease,
@@ -223,7 +229,7 @@ export const useDeploymentsStore = create<DeploymentsState>((set, get) => ({
       description: patch.description,
     })
     await get().refreshAppData(appId)
-    await refreshDeploymentLists()
+    get().bumpDeploymentListRefresh()
     set(state => ({
       instancesById: {
         ...state.instancesById,
@@ -250,27 +256,27 @@ export const useDeploymentsStore = create<DeploymentsState>((set, get) => ({
         appData,
       }
     })
-    await refreshDeploymentLists()
+    get().bumpDeploymentListRefresh()
   },
 
   startDeploy: async ({ appId, environmentId, releaseId, releaseNote }) => {
     set({ deployDrawer: { open: false } })
     await createDeployment({ appId, environmentId, releaseId, releaseNote })
     await get().refreshAppData(appId)
-    await refreshDeploymentLists()
+    get().bumpDeploymentListRefresh()
   },
 
   retryDeploy: async (appId, environmentId, targetReleaseId) => {
     await createDeployment({ appId, environmentId, releaseId: targetReleaseId })
     await get().refreshAppData(appId)
-    await refreshDeploymentLists()
+    get().bumpDeploymentListRefresh()
   },
 
   rollbackDeployment: async (appId, environmentId, targetReleaseId) => {
     set({ rollbackModal: { open: false } })
     await createDeployment({ appId, environmentId, releaseId: targetReleaseId })
     await get().refreshAppData(appId)
-    await refreshDeploymentLists()
+    get().bumpDeploymentListRefresh()
   },
 
   undeployDeployment: async (appId, _environmentId, runtimeInstanceId, isDeploying) => {
@@ -281,7 +287,7 @@ export const useDeploymentsStore = create<DeploymentsState>((set, get) => ({
     else
       await undeployEnvironment(appId, runtimeInstanceId)
     await get().refreshAppData(appId)
-    await refreshDeploymentLists()
+    get().bumpDeploymentListRefresh()
   },
 
   generateApiKey: async (appId, environmentId) => {