fix(stacks): invalidate only stack cache on update BE-12476 (#1566)

app/react/common/stacks/queries/useStackFile.ts

@@ -12,23 +12,36 @@ export function useStackFile(
   { version, commitHash }: { version?: number; commitHash?: string } = {},
   { enabled = true }: { enabled?: boolean } = {}
 ) {
-  return useQuery(
-    queryKeys.stackFile(stackId, { version, commitHash }),
-    () => getStackFile(stackId!, { version, commitHash }),
-    {
-      ...withGlobalError('Unable to retrieve stack'),
-      enabled: !!stackId && enabled,
-    }
-  );
+  return useQuery({
+    queryKey: queryKeys.stackFile(stackId, { version, commitHash }),
+    queryFn: ({ signal }) =>
+      getStackFile({
+        stackId: stackId!,
+        version,
+        commitHash,
+        options: { signal },
+      }),
+
+    ...withGlobalError('Unable to retrieve stack'),
+    enabled: !!stackId && enabled,
+  });
 }
 
-export async function getStackFile(
-  stackId: StackId,
-  { version, commitHash }: { version?: number; commitHash?: string } = {}
-) {
+export async function getStackFile({
+  stackId,
+  version,
+  commitHash,
+  options = {},
+}: {
+  stackId: StackId;
+  version?: number;
+  commitHash?: string;
+  options?: { signal?: AbortSignal };
+}) {
   try {
     const { data } = await axios.get<StackFile>(`/stacks/${stackId}/file`, {
       params: { version, commitHash },
+      signal: options.signal,
     });
     return data;
   } catch (e) {

app/react/common/stacks/types.ts

@@ -62,8 +62,8 @@ export interface Stack {
   CreatedBy: string;
   UpdateDate: number;
   UpdatedBy: string;
-  AdditionalFiles?: string[];
-  AutoUpdate?: AutoUpdateResponse;
+  AdditionalFiles?: string[] | null;
+  AutoUpdate?: AutoUpdateResponse | null;
   Option?: {
     Prune: boolean;
     Force: boolean;

app/react/docker/containers/queries/useContainers.ts

@@ -58,6 +58,10 @@ export async function getContainers(
   { all = true, filters, nodeName }: UseContainers = {}
 ) {
   try {
+    if (!environmentId) {
+      return [];
+    }
+
     const { data } = await axios.get<DockerContainerResponse[]>(
       buildDockerProxyUrl(environmentId, 'containers', 'json'),
       {

app/react/docker/stacks/ItemView/StackInfoTab/StackRedeployGitForm/InnerForm.tsx

@@ -48,7 +48,7 @@ export function InnerForm({
           url={gitConfig.URL}
           type="stack"
           configFilePath={gitConfig.ConfigFilePath}
-          additionalFiles={stack.AdditionalFiles}
+          additionalFiles={stack.AdditionalFiles || []}
         />
 
         <AutoUpdateFieldset

app/react/docker/stacks/view-models/stack.ts

@@ -91,8 +91,8 @@ export class StackViewModel implements IResource {
 
     this.GitConfig = stack.GitConfig;
     this.FromAppTemplate = stack.FromAppTemplate;
-    this.AdditionalFiles = stack.AdditionalFiles;
-    this.AutoUpdate = stack.AutoUpdate;
+    this.AdditionalFiles = stack.AdditionalFiles || undefined;
+    this.AutoUpdate = stack.AutoUpdate || undefined;
     this.Webhook = stack.Webhook;
     this.StackFileVersion = stack.StackFileVersion;
     this.PreviousDeploymentInfo = stack.PreviousDeploymentInfo;

app/react/kubernetes/applications/queries/useAppStackFile.ts

@@ -10,7 +10,7 @@ import { queryKeys } from './query-keys';
 export function useAppStackFile(id?: number, kind?: string) {
   return useQuery(
     queryKeys.appStackFile(id, kind),
-    async () => {
+    async ({ signal }) => {
       if (!id) {
         return undefined;
       }
@@ -21,7 +21,10 @@ export function useAppStackFile(id?: number, kind?: string) {
       }
 
       // Fetch regular stack file
-      const stackFile = await getStackFile(id);
+      const stackFile = await getStackFile({
+        stackId: id,
+        options: { signal },
+      });
       return stackFile?.StackFileContent;
     },
     {

app/react/portainer/gitops/AutoUpdateFieldset/utils.ts

@@ -1,7 +1,7 @@
 import { AutoUpdateResponse, AutoUpdateModel } from '../types';
 
 export function parseAutoUpdateResponse(
-  response?: AutoUpdateResponse
+  response?: AutoUpdateResponse | null
 ): AutoUpdateModel {
   if (!response || (!response?.Interval && !response?.Webhook)) {
     return {

app/react/portainer/gitops/queries/useUpdateGitStack.ts

@@ -30,7 +30,10 @@ export function useUpdateGitStack(stackId: number, endpointId: number) {
     mutationFn: (payload: GitStackPayload) =>
       updateGitStack(stackId, endpointId, payload),
     onSuccess: () => {
-      queryClient.invalidateQueries({ queryKey: queryKeys.base() });
+      queryClient.invalidateQueries({
+        queryKey: queryKeys.stack(stackId),
+        exact: true,
+      });
     },
   });
 }

app/react/portainer/gitops/queries/useUpdateGitStackSettings.ts

@@ -33,8 +33,11 @@ export function useUpdateGitStackSettings() {
       endpointId: number;
       payload: GitStackPayload;
     }) => updateGitStackSettings(stackId, endpointId, payload),
-    onSuccess: () => {
-      queryClient.invalidateQueries({ queryKey: queryKeys.base() });
+    onSuccess: (_, { stackId }) => {
+      queryClient.invalidateQueries({
+        queryKey: queryKeys.stack(stackId),
+        exact: true,
+      });
     },
   });
 }