SONAR-21210 Fix flaky can_modify_according_to_permissions BBT

diff --git a/server/sonar-web/src/main/js/apps/quality-gates/components/Conditions.tsx b/server/sonar-web/src/main/js/apps/quality-gates/components/Conditions.tsx
index b814be6f7c260fb17593037b30e249ad5bb5a4f0..b3c2233f26832583eceb07a14d1e6493f100b7a3 100644 (file)
--- a/server/sonar-web/src/main/js/apps/quality-gates/components/Conditions.tsx
+++ b/server/sonar-web/src/main/js/apps/quality-gates/components/Conditions.tsx
@@ -27,6 +27,7 @@ import {
   LightPrimary,
   Link,
   Note,
+  Spinner,
   SubHeading,
 } from 'design-system';
 import { differenceWith, map, uniqBy } from 'lodash';
@@ -52,6 +53,7 @@ import ConditionsTable from './ConditionsTable';
 
 interface Props {
   qualityGate: QualityGate;
+  isFetching?: boolean;
 }
 
 const FORBIDDEN_METRIC_TYPES = ['DATA', 'DISTRIB', 'STRING', 'BOOL'];
@@ -62,7 +64,7 @@ const FORBIDDEN_METRICS: string[] = [
   MetricKey.new_security_hotspots,
 ];
 
-export default function Conditions({ qualityGate }: Readonly<Props>) {
+export default function Conditions({ qualityGate, isFetching }: Readonly<Props>) {
   const [editing, setEditing] = React.useState<boolean>(
     qualityGate.caycStatus === CaycStatus.NonCompliant,
   );
@@ -176,6 +178,7 @@ export default function Conditions({ qualityGate }: Readonly<Props>) {
               <HelperHintIcon />
             </DocumentationTooltip>
           )}
+          <Spinner loading={isFetching} className="it__spinner sw-ml-4 sw-mt-1" />
         </div>
         <div>
           {(qualityGate.caycStatus === CaycStatus.NonCompliant || editing) && canEdit && (

diff --git a/server/sonar-web/src/main/js/apps/quality-gates/components/Details.tsx b/server/sonar-web/src/main/js/apps/quality-gates/components/Details.tsx
index e34dc06d2fcb62a33cdfa2762e17d2a732ded7ef..df738b17f61ed88d8e1fc7554b50a297eae8c102 100644 (file)
--- a/server/sonar-web/src/main/js/apps/quality-gates/components/Details.tsx
+++ b/server/sonar-web/src/main/js/apps/quality-gates/components/Details.tsx
@@ -30,7 +30,7 @@ interface Props {
 }
 
 export default function Details({ qualityGateName }: Readonly<Props>) {
-  const { data: qualityGate, isLoading } = useQualityGateQuery(qualityGateName);
+  const { data: qualityGate, isLoading, isFetching } = useQualityGateQuery(qualityGateName);
 
   return (
     <main className="layout-page-main">
@@ -39,7 +39,7 @@ export default function Details({ qualityGateName }: Readonly<Props>) {
           <>
             <Helmet defer={false} title={qualityGate.name} />
             <DetailsHeader qualityGate={qualityGate} />
-            <DetailsContent qualityGate={qualityGate} />
+            <DetailsContent qualityGate={qualityGate} isFetching={isFetching} />
           </>
         )}
       </Spinner>

diff --git a/server/sonar-web/src/main/js/apps/quality-gates/components/DetailsContent.tsx b/server/sonar-web/src/main/js/apps/quality-gates/components/DetailsContent.tsx
index ec87de8cf81b7878d6e0410c95c3766de2e61f94..6d63dbfef7bbeeb62e65271ca9cf6677b9a9a906 100644 (file)
--- a/server/sonar-web/src/main/js/apps/quality-gates/components/DetailsContent.tsx
+++ b/server/sonar-web/src/main/js/apps/quality-gates/components/DetailsContent.tsx
@@ -28,11 +28,12 @@ import QualityGatePermissions from './QualityGatePermissions';
 
 export interface DetailsContentProps {
   qualityGate: QualityGate;
+  isFetching?: boolean;
 }
 
 export function DetailsContent(props: DetailsContentProps) {
-  const { qualityGate } = props;
-  const actions = qualityGate.actions || {};
+  const { qualityGate, isFetching } = props;
+  const actions = qualityGate.actions ?? {};
 
   return (
     <div>
@@ -43,7 +44,7 @@ export function DetailsContent(props: DetailsContentProps) {
           </FlagMessage>
         )}
 
-      <Conditions qualityGate={qualityGate} />
+      <Conditions qualityGate={qualityGate} isFetching={isFetching} />
 
       <div className="sw-mt-10">
         <div className="sw-flex sw-flex-col">

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 79fc0968b02c2f1d078b78de743c821c72a38703..79e6fe47557bd20bbc5390422561c6e9ec916558 100644 (file)
--- a/server/sonar-web/src/main/js/queries/quality-gates.ts
+++ b/server/sonar-web/src/main/js/queries/quality-gates.ts
@@ -168,8 +168,16 @@ export function useCreateConditionMutation(gateName: string) {
     mutationFn: (condition: Omit<Condition, 'id'>) => {
       return createCondition({ ...condition, gateName });
     },
-    onSuccess: () => {
+    onSuccess: (_, condition) => {
       queryClient.invalidateQueries([QUALITY_GATES_KEY]);
+      queryClient.setQueryData([QUALITY_GATE_KEY, gateName], (oldData?: QualityGate) => {
+        return oldData?.conditions
+          ? {
+              ...oldData,
+              conditions: [...oldData.conditions, condition],
+            }
+          : undefined;
+      });
       queryClient.invalidateQueries([QUALITY_GATE_KEY, gateName]);
       addGlobalSuccessMessage(translate('quality_gates.condition_added'));
     },