SONAR-22092 Fix the errror message when deleting a quality gate

2 files changed, 59 insertions, 45 deletions

diff --git a/server/sonar-web/src/main/js/apps/quality-gates/components/DetailsHeader.tsx b/server/sonar-web/src/main/js/apps/quality-gates/components/DetailsHeader.tsx
index f86309dbc66..da700a2d02c 100644
--- a/server/sonar-web/src/main/js/apps/quality-gates/components/DetailsHeader.tsx
+++ b/server/sonar-web/src/main/js/apps/quality-gates/components/DetailsHeader.tsx
@@ -61,9 +61,7 @@ export default function DetailsHeader({ qualityGate }: Readonly<Props>) {
     actions.setAsDefault,
   ])['true'];
   const canEdit = Boolean(actions?.manageConditions);
-  const { mutateAsync: setQualityGateAsDefault } = useSetQualityGateAsDefaultMutation(
-    qualityGate.name,
-  );
+  const { mutateAsync: setQualityGateAsDefault } = useSetQualityGateAsDefaultMutation();
 
   const handleSetAsDefaultClick = () => {
     if (!qualityGate.isDefault) {
diff --git a/server/sonar-web/src/main/js/queries/quality-gates.ts b/server/sonar-web/src/main/js/queries/quality-gates.ts
index af8399cd007..4f007a94a99 100644
--- a/server/sonar-web/src/main/js/queries/quality-gates.ts
+++ b/server/sonar-web/src/main/js/queries/quality-gates.ts
@@ -37,39 +37,55 @@ import { getCorrectCaycCondition } from '../apps/quality-gates/utils';
 import { translate } from '../helpers/l10n';
 import { Condition, QualityGate } from '../types/types';
 
-function getQualityGateQueryKey(type: 'name', data: string): string[];
-function getQualityGateQueryKey(type: 'project', data: string): string[];
-function getQualityGateQueryKey(): string[];
-function getQualityGateQueryKey(type?: string, data?: string) {
-  return ['quality-gate', type ?? '', data ?? ''].filter(Boolean);
-}
-
-export function useQualityGateQuery(name: string) {
+const QUERY_STALE_TIME = 5 * 60 * 1000;
+
+const qualityQuery = {
+  all: () => ['quality-gate'] as const,
+  list: () => ['quality-gate', 'list'] as const,
+  details: () => ['quality-gate', 'details'] as const,
+  detail: (name?: string) => [...qualityQuery.details(), name ?? ''] as const,
+  projectsAssoc: () => ['quality-gate', 'project-assoc'] as const,
+  projectAssoc: (project: string) => [...qualityQuery.projectsAssoc(), project] as const,
+};
+
+// This is internal to "enable" query when searching from the project page
+function useQualityGateQueryInner(name?: string) {
   return useQuery({
-    queryKey: getQualityGateQueryKey('name', name),
+    queryKey: qualityQuery.detail(name),
     queryFn: ({ queryKey: [, , name] }) => {
       return fetchQualityGate({ name });
     },
+    enabled: name !== undefined,
+    staleTime: QUERY_STALE_TIME,
   });
 }
 
-export function useComponentQualityGateQuery(project: string) {
+export function useQualityGateQuery(name: string) {
+  return useQualityGateQueryInner(name);
+}
+
+function useQualityGateForProjectQuery(project: string) {
   return useQuery({
-    queryKey: getQualityGateQueryKey('project', project),
+    queryKey: qualityQuery.projectAssoc(project),
     queryFn: async ({ queryKey: [, , project] }) => {
       const qualityGatePreview = await getGateForProject({ project });
-      return fetchQualityGate({ name: qualityGatePreview.name });
+      return qualityGatePreview.name;
     },
   });
 }
 
+export function useComponentQualityGateQuery(project: string) {
+  const { data: name } = useQualityGateForProjectQuery(project);
+  return useQualityGateQueryInner(name);
+}
+
 export function useQualityGatesQuery() {
   return useQuery({
-    queryKey: getQualityGateQueryKey(),
+    queryKey: qualityQuery.list(),
     queryFn: () => {
       return fetchQualityGates();
     },
-    staleTime: 2 * 60 * 1000,
+    staleTime: QUERY_STALE_TIME,
   });
 }
 
@@ -81,12 +97,12 @@ export function useCreateQualityGateMutation() {
       return createQualityGate({ name });
     },
     onSuccess: () => {
-      queryClient.invalidateQueries({ queryKey: getQualityGateQueryKey() });
+      queryClient.invalidateQueries({ queryKey: qualityQuery.list() });
     },
   });
 }
 
-export function useSetQualityGateAsDefaultMutation(gateName: string) {
+export function useSetQualityGateAsDefaultMutation() {
   const queryClient = useQueryClient();
 
   return useMutation({
@@ -94,8 +110,8 @@ export function useSetQualityGateAsDefaultMutation(gateName: string) {
       return setQualityGateAsDefault({ name: qualityGate.name });
     },
     onSuccess: () => {
-      queryClient.invalidateQueries({ queryKey: getQualityGateQueryKey() });
-      queryClient.invalidateQueries({ queryKey: getQualityGateQueryKey('name', gateName) });
+      queryClient.invalidateQueries({ queryKey: qualityQuery.list() });
+      queryClient.invalidateQueries({ queryKey: qualityQuery.details() });
     },
   });
 }
@@ -107,9 +123,10 @@ export function useRenameQualityGateMutation(currentName: string) {
     mutationFn: (newName: string) => {
       return renameQualityGate({ currentName, name: newName });
     },
-    onSuccess: (_, newName: string) => {
-      queryClient.invalidateQueries({ queryKey: getQualityGateQueryKey() });
-      queryClient.invalidateQueries({ queryKey: getQualityGateQueryKey('name', newName) });
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: qualityQuery.list() });
+      queryClient.invalidateQueries({ queryKey: qualityQuery.projectsAssoc() });
+      queryClient.removeQueries({ queryKey: qualityQuery.detail(currentName) });
     },
   });
 }
@@ -122,7 +139,7 @@ export function useCopyQualityGateMutation(sourceName: string) {
       return copyQualityGate({ sourceName, name: newName });
     },
     onSuccess: () => {
-      queryClient.invalidateQueries({ queryKey: getQualityGateQueryKey() });
+      queryClient.invalidateQueries({ queryKey: qualityQuery.list() });
     },
   });
 }
@@ -135,7 +152,9 @@ export function useDeleteQualityGateMutation(name: string) {
       return deleteQualityGate({ name });
     },
     onSuccess: () => {
-      queryClient.invalidateQueries({ queryKey: getQualityGateQueryKey() });
+      queryClient.invalidateQueries({ queryKey: qualityQuery.list() });
+      queryClient.invalidateQueries({ queryKey: qualityQuery.projectsAssoc() });
+      queryClient.removeQueries({ queryKey: qualityQuery.detail(name) });
     },
   });
 }
@@ -170,8 +189,8 @@ export function useFixQualityGateMutation(gateName: string) {
       return Promise.all(promiseArr);
     },
     onSuccess: () => {
-      queryClient.invalidateQueries({ queryKey: getQualityGateQueryKey() });
-      queryClient.invalidateQueries({ queryKey: getQualityGateQueryKey('name', gateName) });
+      queryClient.invalidateQueries({ queryKey: qualityQuery.detail(gateName) });
+      queryClient.invalidateQueries({ queryKey: qualityQuery.list() });
       addGlobalSuccessMessage(translate('quality_gates.conditions_updated'));
     },
   });
@@ -185,19 +204,16 @@ export function useCreateConditionMutation(gateName: string) {
       return createCondition({ ...condition, gateName });
     },
     onSuccess: (_, condition) => {
-      queryClient.invalidateQueries({ queryKey: getQualityGateQueryKey() });
-      queryClient.setQueryData(
-        getQualityGateQueryKey('name', gateName),
-        (oldData?: QualityGate) => {
-          return oldData?.conditions
-            ? {
-                ...oldData,
-                conditions: [...oldData.conditions, condition],
-              }
-            : undefined;
-        },
-      );
-      queryClient.invalidateQueries({ queryKey: getQualityGateQueryKey('name', gateName) });
+      queryClient.setQueryData(qualityQuery.detail(gateName), (oldData?: QualityGate) => {
+        return oldData?.conditions
+          ? {
+              ...oldData,
+              conditions: [...oldData.conditions, condition],
+            }
+          : undefined;
+      });
+      queryClient.invalidateQueries({ queryKey: qualityQuery.detail(gateName) });
+      queryClient.invalidateQueries({ queryKey: qualityQuery.list() });
       addGlobalSuccessMessage(translate('quality_gates.condition_added'));
     },
   });
@@ -211,8 +227,8 @@ export function useUpdateConditionMutation(gateName: string) {
       return updateCondition(condition);
     },
     onSuccess: () => {
-      queryClient.invalidateQueries({ queryKey: getQualityGateQueryKey() });
-      queryClient.invalidateQueries({ queryKey: getQualityGateQueryKey('name', gateName) });
+      queryClient.invalidateQueries({ queryKey: qualityQuery.list() });
+      queryClient.invalidateQueries({ queryKey: qualityQuery.detail(gateName) });
       addGlobalSuccessMessage(translate('quality_gates.condition_updated'));
     },
   });
@@ -228,8 +244,8 @@ export function useDeleteConditionMutation(gateName: string) {
       });
     },
     onSuccess: () => {
-      queryClient.invalidateQueries({ queryKey: getQualityGateQueryKey() });
-      queryClient.invalidateQueries({ queryKey: getQualityGateQueryKey('name', gateName) });
+      queryClient.invalidateQueries({ queryKey: qualityQuery.list() });
+      queryClient.invalidateQueries({ queryKey: qualityQuery.detail(gateName) });
       addGlobalSuccessMessage(translate('quality_gates.condition_deleted'));
     },
   });