Merge pull request #825 from carlosthe19916/WINDUP-3322 (#870)

[WINDUP-3322] - Neither "Save" nor "Save and Run" is enabled when some change is made in Custom rule or custom labels Co-authored-by: Juan Manuel Leflet Estrada <jleflete@redhat.com>
windup · Dec 16, 2022 · 23cd0d9 · 23cd0d9
1 parent 69c3e21
commit 23cd0d9
Show file tree

Hide file tree

Showing 3 changed files with 169 additions and 11 deletions.
diff --git a/ui-pf4/src/main/webapp/src/containers/add-rule-label-button/add-rule-label-button.tsx b/ui-pf4/src/main/webapp/src/containers/add-rule-label-button/add-rule-label-button.tsx
@@ -16,13 +16,15 @@ export interface AddRuleLabelButtonProps {
   type: RuleLabel;
   projectId?: number | string;
   uploadToGlobal: boolean;
+  isDisabled?: boolean;
   onModalClose: () => void;
 }
 
 export const AddRuleLabelButton: React.FC<AddRuleLabelButtonProps> = ({
   type,
   projectId,
   uploadToGlobal,
+  isDisabled,
   onModalClose,
 }) => {
   const dispatch = useDispatch();
@@ -48,7 +50,11 @@ export const AddRuleLabelButton: React.FC<AddRuleLabelButtonProps> = ({
 
   return (
     <>
-      <Button type="button" onClick={handleOnModalToggle}>
+      <Button
+        type="button"
+        onClick={handleOnModalToggle}
+        isDisabled={isDisabled}
+      >
         Add {`${type.toLocaleLowerCase()}`}
       </Button>
       <Modal

diff --git a/ui-pf4/src/main/webapp/src/containers/custom-labels/custom-labels.tsx b/ui-pf4/src/main/webapp/src/containers/custom-labels/custom-labels.tsx
@@ -1,4 +1,5 @@
-import React, { useCallback, useEffect } from "react";
+import React, { useCallback, useEffect, useState } from "react";
+import { useHistory } from "react-router-dom";
 import { AxiosError } from "axios";
 
 import {
@@ -12,6 +13,7 @@ import {
   ToolbarItem,
   Switch,
   Bullseye,
+  Button,
 } from "@patternfly/react-core";
 import {
   ICell,
@@ -37,8 +39,13 @@ import { useShowRuleLabelDetails } from "hooks/useShowRuleLabelDetails";
 import { useDispatch } from "react-redux";
 import { alertActions } from "store/alert";
 
+import { formatPath, Paths } from "Paths";
 import { getAlertModel } from "Constants";
-import { getAnalysisContext, saveAnalysisContext } from "api/api";
+import {
+  createProjectExecution,
+  getAnalysisContext,
+  saveAnalysisContext,
+} from "api/api";
 import { LabelsPath, LabelProviderEntity } from "models/api";
 import {
   getAxiosErrorMessage,
@@ -86,6 +93,8 @@ export const CustomLabels: React.FC<CustomLabelsProps> = ({
   projectId,
   skipChangeToProvisional,
 }) => {
+  const history = useHistory();
+
   const dispatch = useDispatch();
   const deleteLabel = useDeleteLabel();
   const showRuleLabelDetails = useShowRuleLabelDetails();
@@ -111,12 +120,71 @@ export const CustomLabels: React.FC<CustomLabelsProps> = ({
     loadLabels(projectId);
   }, [projectId, loadProject, loadLabels]);
 
+  // Switch checked state
+  const [
+    isAnalysisContextBeingSaved,
+    setIsAnalysisContextBeingSaved,
+  ] = useState(false);
+
+  const [isLabelPathChecked, setIsLabelPathChecked] = useState(
+    new Map<number, boolean>()
+  );
+
+  useEffect(() => {
+    if (analysisContext && labelsPath) {
+      const newCheckedValue = new Map<number, boolean>();
+      labelsPath.forEach((item) => {
+        newCheckedValue.set(
+          item.id,
+          !!analysisContext.labelsPaths.find((f) => f.id === item.id)
+        );
+      });
+      setIsLabelPathChecked(newCheckedValue);
+    }
+  }, [analysisContext, labelsPath]);
+
+  // Analysis
+
+  const onRunAnalysis = () => {
+    if (!project || project.provisional) {
+      return;
+    }
+
+    setIsAnalysisContextBeingSaved(true);
+    getAnalysisContext(project.defaultAnalysisContextId)
+      .then(({ data }) => {
+        return createProjectExecution(projectId, data);
+      })
+      .then(() => {
+        history.push(
+          formatPath(Paths.executions, {
+            project: projectId,
+          })
+        );
+      })
+      .catch((error: AxiosError) => {
+        setIsAnalysisContextBeingSaved(false);
+        dispatch(
+          alertActions.alert(
+            getAlertModel("danger", "Error", getAxiosErrorMessage(error))
+          )
+        );
+      });
+  };
+
+  //
+
   const handleLabelPathToggled = useCallback(
     (isChecked: boolean, labelPathToggled: LabelsPath) => {
       if (!project) {
         return;
       }
 
+      setIsLabelPathChecked(
+        new Map(isLabelPathChecked).set(labelPathToggled.id, isChecked)
+      );
+      setIsAnalysisContextBeingSaved(true);
+
       getAnalysisContext(project.defaultAnalysisContextId)
         .then(({ data }) => {
           const newAnalysisContext = { ...data };
@@ -147,9 +215,18 @@ export const CustomLabels: React.FC<CustomLabelsProps> = ({
               getAlertModel("danger", "Error", getAxiosErrorMessage(error))
             )
           );
+        })
+        .finally(() => {
+          setIsAnalysisContextBeingSaved(false);
         });
     },
-    [project, skipChangeToProvisional, loadProject, dispatch]
+    [
+      project,
+      isLabelPathChecked,
+      skipChangeToProvisional,
+      loadProject,
+      dispatch,
+    ]
   );
 
   const actionResolver = (rowData: IRowData): (IAction | ISeparator)[] => {
@@ -182,7 +259,7 @@ export const CustomLabels: React.FC<CustomLabelsProps> = ({
   };
 
   const areActionsDisabled = (): boolean => {
-    return false;
+    return isFetchingProject || isFetchingLabels || isAnalysisContextBeingSaved;
   };
 
   const getRowLabelPathField = (rowData: IRowData): LabelsPath => {
@@ -220,22 +297,35 @@ export const CustomLabels: React.FC<CustomLabelsProps> = ({
             {
               title: (
                 <Switch
-                  aria-label="Enabled"
-                  isChecked={
-                    !!analysisContext?.labelsPaths.find((f) => f.id === item.id)
+                  aria-label={
+                    isLabelPathChecked.get(item.id) ? "Enabled" : "Disabled"
                   }
+                  isChecked={isLabelPathChecked.get(item.id)}
                   onChange={(isChecked) =>
                     handleLabelPathToggled(isChecked, item)
                   }
-                  isDisabled={errors.length > 0 || numberOfLabels === 0}
+                  isDisabled={
+                    isFetchingProject ||
+                    isFetchingLabels ||
+                    isAnalysisContextBeingSaved ||
+                    errors.length > 0 ||
+                    numberOfLabels === 0
+                  }
                 />
               ),
             },
           ],
         };
       });
     },
-    [analysisContext, labelProviders, handleLabelPathToggled]
+    [
+      labelProviders,
+      isAnalysisContextBeingSaved,
+      isFetchingProject,
+      isFetchingLabels,
+      isLabelPathChecked,
+      handleLabelPathToggled,
+    ]
   );
 
   const handleOnLabelLabelClose = () => {
@@ -275,9 +365,21 @@ export const CustomLabels: React.FC<CustomLabelsProps> = ({
                     type="Label"
                     projectId={projectId}
                     uploadToGlobal={false}
+                    isDisabled={areActionsDisabled()}
                     onModalClose={handleOnLabelLabelClose}
                   />
                 </ToolbarItem>
+                {project && !project.provisional && (
+                  <ToolbarItem>
+                    <Button
+                      variant="secondary"
+                      onClick={onRunAnalysis}
+                      isDisabled={areActionsDisabled()}
+                    >
+                      Run analysis
+                    </Button>
+                  </ToolbarItem>
+                )}
               </ToolbarGroup>
             }
             emptyState={

diff --git a/ui-pf4/src/main/webapp/src/containers/custom-rules/custom-rules.tsx b/ui-pf4/src/main/webapp/src/containers/custom-rules/custom-rules.tsx
@@ -1,4 +1,5 @@
 import React, { useCallback, useEffect, useState } from "react";
+import { useHistory } from "react-router-dom";
 import { AxiosError } from "axios";
 
 import {
@@ -12,6 +13,7 @@ import {
   ToolbarItem,
   Switch,
   Bullseye,
+  Button,
 } from "@patternfly/react-core";
 import {
   ICell,
@@ -37,8 +39,13 @@ import { useShowRuleLabelDetails } from "hooks/useShowRuleLabelDetails";
 import { useDispatch } from "react-redux";
 import { alertActions } from "store/alert";
 
+import { formatPath, Paths } from "Paths";
 import { getAlertModel } from "Constants";
-import { getAnalysisContext, saveAnalysisContext } from "api/api";
+import {
+  createProjectExecution,
+  getAnalysisContext,
+  saveAnalysisContext,
+} from "api/api";
 import { RulesPath, RuleProviderEntity } from "models/api";
 import {
   getAxiosErrorMessage,
@@ -85,6 +92,8 @@ export const CustomRules: React.FC<CustomRulesProps> = ({
   projectId,
   skipChangeToProvisional,
 }) => {
+  const history = useHistory();
+
   const dispatch = useDispatch();
   const deleteRule = useDeleteRule();
   const showRuleLabelDetails = useShowRuleLabelDetails();
@@ -134,6 +143,35 @@ export const CustomRules: React.FC<CustomRulesProps> = ({
     }
   }, [analysisContext, rulesPath]);
 
+  // Analysis
+
+  const onRunAnalysis = () => {
+    if (!project || project.provisional) {
+      return;
+    }
+
+    setIsAnalysisContextBeingSaved(true);
+    getAnalysisContext(project.defaultAnalysisContextId)
+      .then(({ data }) => {
+        return createProjectExecution(projectId, data);
+      })
+      .then(() => {
+        history.push(
+          formatPath(Paths.executions, {
+            project: projectId,
+          })
+        );
+      })
+      .catch((error: AxiosError) => {
+        setIsAnalysisContextBeingSaved(false);
+        dispatch(
+          alertActions.alert(
+            getAlertModel("danger", "Error", getAxiosErrorMessage(error))
+          )
+        );
+      });
+  };
+
   //
 
   const handleRulePathToggled = useCallback(
@@ -333,9 +371,21 @@ export const CustomRules: React.FC<CustomRulesProps> = ({
                     type="Rule"
                     projectId={projectId}
                     uploadToGlobal={false}
+                    isDisabled={areActionsDisabled()}
                     onModalClose={handleOnRuleLabelClose}
                   />
                 </ToolbarItem>
+                {project && !project.provisional && (
+                  <ToolbarItem>
+                    <Button
+                      variant="secondary"
+                      onClick={onRunAnalysis}
+                      isDisabled={areActionsDisabled()}
+                    >
+                      Run analysis
+                    </Button>
+                  </ToolbarItem>
+                )}
               </ToolbarGroup>
             }
             emptyState={