testing retrigger functionality

homedepot · Jun 28, 2023 · 2c96459 · 2c96459
1 parent 13eb9d7
commit 2c96459
Show file tree

Hide file tree

Showing 5 changed files with 76 additions and 59 deletions.
diff --git a/spin-observatory-plugin-deck/src/components/actions/PauseResumeButton.tsx b/spin-observatory-plugin-deck/src/components/actions/PauseResumeButton.tsx
@@ -12,6 +12,7 @@ import React, { Fragment, useRef, useState } from 'react';
 import { pauseExecutions, resumeExecutions } from '../../services/gateService';
 
 interface IPauseResumeButtonProps {
+  disabled: boolean;
   executionIds: string[];
   refreshExecutions: () => void;
 }
@@ -21,7 +22,7 @@ const options = [
   { text: 'Resume', action: resumeExecutions },
 ];
 
-export const PauseResumeButton = ({ executionIds, refreshExecutions }: IPauseResumeButtonProps) => {
+export const PauseResumeButton = ({ disabled, executionIds, refreshExecutions }: IPauseResumeButtonProps) => {
   const [open, setOpen] = useState(false);
   const anchorRef = useRef<HTMLDivElement>(null);
   const [selectedIndex, setSelectedIndex] = useState(0);
@@ -50,7 +51,7 @@ export const PauseResumeButton = ({ executionIds, refreshExecutions }: IPauseRes
 
   const handleHover = () => setHover((prevHover) => !prevHover);
 
-  const isHovered = hover && executionIds.length > 0;
+  const isHovered = hover && !disabled;
 
   return (
     <Fragment>
@@ -59,7 +60,7 @@ export const PauseResumeButton = ({ executionIds, refreshExecutions }: IPauseRes
         onMouseLeave={handleHover}
         variant="contained"
         ref={anchorRef}
-        disabled={executionIds.length === 0}
+        disabled={disabled}
       >
         <Button
           style={{

diff --git a/spin-observatory-plugin-deck/src/components/actions/RetriggerButton.scss b/spin-observatory-plugin-deck/src/components/actions/RetriggerButton.scss
diff --git a/spin-observatory-plugin-deck/src/components/actions/RetriggerButton.tsx b/spin-observatory-plugin-deck/src/components/actions/RetriggerButton.tsx
@@ -1,18 +1,54 @@
-import { Button, makeStyles } from '@material-ui/core';
-import React from 'react';
-
-const useStyles = makeStyles({
-  'retrigger-button': {
-    width: '7rem',
-    color: '#fff',
-    backgroundColor: 'var(--color-accent)',
-  },
-  'retrigger-button:hover': {
-    backgroundColor: 'var(--button-primary-hover-bg)',
-  },
-});
-
-export const RetriggerButton = ({ disabled, onClick }: { disabled: boolean; onClick: () => void }) => {
-  const styles = useStyles();
-  return <Button className={styles['retrigger-button']}>Retrigger</Button>;
+import { Button } from '@material-ui/core';
+import React, { useState } from 'react';
+
+import type { IExecution } from '@spinnaker/core';
+
+import { retriggerExecutions } from '../../services/BroadsideService';
+
+interface IRetriggerButtonProps {
+  disabled: boolean;
+  executions: IExecution[];
+  refreshExecutions: () => void;
+}
+
+export const RetriggerButton = ({ disabled, executions, refreshExecutions }: IRetriggerButtonProps) => {
+  const [retriggerInProgress, setRetriggerInProgress] = useState(false);
+  const [hover, setHover] = useState(false);
+
+  const handleHover = () => setHover((prevHover) => !prevHover);
+
+  const isHovered = hover && !disabled && !retriggerInProgress;
+
+  const handleRetrigger = () => {
+    setRetriggerInProgress(true);
+    retriggerExecutions({ executions })
+      .then((res) => {
+        // eslint-disable-next-line no-console
+        console.log('retriggered: ', res);
+        setRetriggerInProgress(false);
+      })
+      .catch((e) => {
+        //TODO: surface this error
+        console.error('error retriggering: ', e);
+      })
+      .finally(() => {
+        setRetriggerInProgress(false);
+        refreshExecutions();
+      });
+  };
+
+  return (
+    <Button
+      onMouseEnter={handleHover}
+      onMouseLeave={handleHover}
+      onClick={handleRetrigger}
+      style={{
+        width: '7rem',
+        color: 'white',
+        backgroundColor: isHovered ? 'var(--button-primary-hover-bg)' : 'var(--color-accent)',
+      }}
+    >
+      Retrigger
+    </Button>
+  );
 };
diff --git a/spin-observatory-plugin-deck/src/components/pipelines/ExecutionsTable.tsx b/spin-observatory-plugin-deck/src/components/pipelines/ExecutionsTable.tsx
@@ -36,7 +36,6 @@ interface IExecutionsTableProps {
 
 export const ExecutionsTable = ({ executions, parameters, refreshExecutions }: IExecutionsTableProps) => {
   const [selectedExecutionIds, setSelectedExecutionIds] = useState<string[]>([]);
-  const [retriggerInProgress, setRetriggerInProgress] = useState(false);
   const [currentPage, setPage] = useState(0);
   const [rowsPerPage, setRowsPerPage] = useState(DEFAULT_ROWS_PER_PAGE);
   const styles = useStyles();
@@ -73,23 +72,6 @@ export const ExecutionsTable = ({ executions, parameters, refreshExecutions }: I
     setSelectedExecutionIds(newSelected);
   };
 
-  const handleRetrigger = () => {
-    setRetriggerInProgress(true);
-    // retriggerExecutions({ executions: selectedExecutions })
-    //   .then((res) => {
-    //     // eslint-disable-next-line no-console
-    //     console.log('retriggered: ', res);
-    //     setRetriggerInProgress(false);
-    //   })
-    //   .catch((e) => {
-    //     //TODO: surface this error
-    //     console.error('error retriggering: ', e);
-    //   })
-    //   .finally(() => {
-    //     setRetriggerInProgress(false);
-    //   });
-  };
-
   const isSelected = (name: string) => selectedExecutionIds.indexOf(name) !== -1;
 
   return (
@@ -116,8 +98,16 @@ export const ExecutionsTable = ({ executions, parameters, refreshExecutions }: I
           <TableRow>
             <TableCell colSpan={2}>
               <ActionButtonsContainer>
-                <PauseResumeButton executionIds={selectedExecutionIds} refreshExecutions={refreshExecutions} />
-                <RetriggerButton disabled={selectedExecutionIds.length === 0} onClick={handleRetrigger} />
+                <PauseResumeButton
+                  disabled={selectedExecutionIds.length === 0}
+                  executionIds={selectedExecutionIds}
+                  refreshExecutions={refreshExecutions}
+                />
+                <RetriggerButton
+                  disabled={selectedExecutionIds.length === 0}
+                  executions={executions.filter((e) => selectedExecutionIds.includes(e.id))}
+                  refreshExecutions={refreshExecutions}
+                />
               </ActionButtonsContainer>
             </TableCell>
             <TablePagination

diff --git a/spin-observatory-plugin-deck/src/services/BroadsideService.ts b/spin-observatory-plugin-deck/src/services/BroadsideService.ts
@@ -4,9 +4,9 @@ import { REST } from '@spinnaker/core';
 const BROADSIDE_URI = 'http://broadside.cd:80/v1/broadsides';
 
 // See https://github.com/one-thd/broadside/blob/main/api/swagger.yml#L206
-export const retriggerExecutions = ({ executions }: { executions: IExecution[] }): Promise<any[]> => {
+export const retriggerExecutions = ({ executions }: { executions: IExecution[] }) => {
   /***
-   *  application: "clipper"
+   *       application: "clipper"
    *       pipelineNameOrId: "Generate Clipper X.509 Key Pair"
    *       amount: 50
    *       delay: 100
@@ -15,13 +15,11 @@ export const retriggerExecutions = ({ executions }: { executions: IExecution[] }
    */
   // eslint-disable-next-line no-console
   console.log({ executions });
-  return Promise.all(
-    executions.map(async (execution) => {
-      return await REST(BROADSIDE_URI).post({
-        application: execution.application,
-        pipelineNameOrId: execution.pipelineConfigId,
-        pipelineBaseParameters: execution.trigger.parameters,
-      });
-    }),
-  );
+
+  const application = executions[0].application;
+  const pipelineNameOrId = executions[0].name;
+  const amount = executions.length;
+  const pipelineMultiParameters = executions.map((e) => e.trigger.parameters);
+
+  return REST(BROADSIDE_URI).post({ application, pipelineNameOrId, amount, pipelineMultiParameters });
 };