feat: Update rq logic and notis (#498)

epam · Nov 22, 2024 · 316ffeb · 316ffeb
1 parent 3113089
commit 316ffeb
Show file tree

Hide file tree

Showing 20 changed files with 231 additions and 107 deletions.
diff --git a/Dockerfile b/Dockerfile
@@ -1,4 +1,4 @@
-FROM epamedp/headlamp:0.22.36
+FROM epamedp/headlamp:0.22.37
 
 COPY --chown=100:101 assets/ /headlamp/frontend
 COPY --chown=100:101 dist/main.js /headlamp/plugins/edp/main.js

diff --git a/src/components/ErrorBoundary/index.tsx b/src/components/ErrorBoundary/index.tsx
@@ -24,6 +24,7 @@ class ErrorBoundary extends React.Component<Props, State> {
       autoHideDuration: 5000,
       content: (key, message) => (
         <Snackbar
+          snackbarKey={key}
           text={String(message)}
           handleClose={() => this.props.closeSnackbar(key)}
           variant="error"

diff --git a/src/components/Snackbar/index.tsx b/src/components/Snackbar/index.tsx
@@ -1,6 +1,7 @@
 import { Icon } from '@iconify/react';
+import { Link } from '@kinvolk/headlamp-plugin/lib/CommonComponents';
 import { Box, Button, IconButton, Stack, Typography } from '@mui/material';
-import { SnackbarContent, useSnackbar } from 'notistack';
+import { SnackbarContent, SnackbarKey, useSnackbar } from 'notistack';
 import React from 'react';
 import { ICONS } from '../../icons/iconify-icons-mapping';
 
@@ -14,13 +15,20 @@ const SNACKBAR_VARIANT = {
 export const Snackbar = React.forwardRef<
   HTMLDivElement,
   {
+    snackbarKey: SnackbarKey;
     text: string;
     variant: string;
-    pushLocation?: () => void;
+    pushLocation?: {
+      href: {
+        routeName: string;
+        params: Record<string, string>;
+      };
+      text?: string;
+    };
     handleClose?: () => void;
   }
 >((props, ref) => {
-  const { text, variant, handleClose, pushLocation } = props;
+  const { text, variant, snackbarKey, pushLocation } = props;
   const { closeSnackbar } = useSnackbar();
 
   const theme = React.useMemo(() => {
@@ -56,6 +64,10 @@ export const Snackbar = React.forwardRef<
     };
   }, [variant]);
 
+  const handleClose = () => {
+    closeSnackbar(snackbarKey);
+  };
+
   return (
     <SnackbarContent ref={ref} role={variant}>
       <Box
@@ -77,15 +89,15 @@ export const Snackbar = React.forwardRef<
           </Stack>
           {pushLocation && (
             <Button
+              component={Link}
               size="small"
               variant="outlined"
               color="inherit"
-              onClick={() => {
-                pushLocation();
-                closeSnackbar();
-              }}
+              routeName={pushLocation.href.routeName}
+              params={pushLocation.href.params}
+              onClick={handleClose}
             >
-              go to page
+              {pushLocation.text || 'Go to page'}
             </Button>
           )}
           <IconButton size="small" onClick={handleClose}>

diff --git a/src/hooks/useResourceCRUDMutation/index.tsx b/src/hooks/useResourceCRUDMutation/index.tsx
@@ -49,7 +49,6 @@ export const useResourceCRUDMutation = <
     showRequestErrorMessage,
     showRequestSuccessMessage,
     showRequestErrorDetailedMessage,
-    closeSnackbar,
   } = useRequestStatusMessages();
 
   const namespace = getDefaultNamespace();
@@ -103,11 +102,7 @@ export const useResourceCRUDMutation = <
           },
           variant: 'info',
           content: (key, message) => (
-            <Snackbar
-              text={String(message)}
-              handleClose={() => closeSnackbar(key)}
-              variant="info"
-            />
+            <Snackbar snackbarKey={key} text={String(message)} variant="info" />
           ),
         } as const;
 
@@ -145,11 +140,7 @@ export const useResourceCRUDMutation = <
           },
           variant: 'success',
           content: (key, message) => (
-            <Snackbar
-              text={String(message)}
-              handleClose={() => closeSnackbar(key)}
-              variant="success"
-            />
+            <Snackbar snackbarKey={key} text={String(message)} variant="success" />
           ),
         } as const;
 
@@ -187,11 +178,7 @@ export const useResourceCRUDMutation = <
           },
           variant: 'error',
           content: (key, message) => (
-            <Snackbar
-              text={String(message)}
-              handleClose={() => closeSnackbar(key)}
-              variant="error"
-            />
+            <Snackbar snackbarKey={key} text={String(message)} variant="error" />
           ),
         } as const;
 

diff --git a/src/hooks/useResourceRequestStatusMessages/index.tsx b/src/hooks/useResourceRequestStatusMessages/index.tsx
@@ -12,7 +12,7 @@ interface Options {
 }
 
 export const useRequestStatusMessages = () => {
-  const { enqueueSnackbar, closeSnackbar } = useSnackbar();
+  const { enqueueSnackbar } = useSnackbar();
 
   const showBeforeRequestMessage = (mode: CRUD_TYPES, { entityName, customMessage }: Options) => {
     const beforeRequestMessage = (() => {
@@ -34,7 +34,7 @@ export const useRequestStatusMessages = () => {
       },
       variant: 'info',
       content: (key, message) => (
-        <Snackbar text={String(message)} handleClose={() => closeSnackbar(key)} variant="info" />
+        <Snackbar snackbarKey={key} text={String(message)} variant="info" />
       ),
     } as const;
 
@@ -70,7 +70,7 @@ export const useRequestStatusMessages = () => {
       },
       variant: 'success',
       content: (key, message) => (
-        <Snackbar text={String(message)} handleClose={() => closeSnackbar(key)} variant="success" />
+        <Snackbar snackbarKey={key} text={String(message)} variant="success" />
       ),
     } as const;
 
@@ -106,7 +106,7 @@ export const useRequestStatusMessages = () => {
       },
       variant: 'error',
       content: (key, message) => (
-        <Snackbar text={String(message)} handleClose={() => closeSnackbar(key)} variant="error" />
+        <Snackbar snackbarKey={key} text={String(message)} variant="error" />
       ),
     } as const;
 
@@ -130,7 +130,7 @@ export const useRequestStatusMessages = () => {
         horizontal: 'left',
       },
       content: (key, message) => (
-        <Snackbar text={String(message)} handleClose={() => closeSnackbar(key)} variant="error" />
+        <Snackbar snackbarKey={key} text={String(message)} variant="error" />
       ),
     });
   };
@@ -140,6 +140,5 @@ export const useRequestStatusMessages = () => {
     showRequestSuccessMessage,
     showRequestErrorMessage,
     showRequestErrorDetailedMessage,
-    closeSnackbar,
   };
 };
diff --git a/...ineRun/hooks/useCreateBuildPipelineRun.ts → ...neRun/hooks/useCreateBuildPipelineRun.tsx b/...ineRun/hooks/useCreateBuildPipelineRun.ts → ...neRun/hooks/useCreateBuildPipelineRun.tsx
@@ -1,6 +1,9 @@
 import React, { useCallback } from 'react';
+import { Snackbar } from '../../../../../components/Snackbar';
 import { CRUD_TYPES } from '../../../../../constants/crudTypes';
 import { useResourceCRUDMutation } from '../../../../../hooks/useResourceCRUDMutation';
+import { routePipelineRunDetails } from '../../../../../pages/pipeline-details/route';
+import { getDefaultNamespace } from '../../../../../utils/getDefaultNamespace';
 import { PipelineRunKubeObject } from '../index';
 import { PipelineRunKubeObjectInterface } from '../types';
 
@@ -18,7 +21,7 @@ export const useCreateBuildPipelineRun = ({
     PipelineRunKubeObjectInterface,
     CRUD_TYPES.CREATE
   >('buildPipelineRunCreateMutation', PipelineRunKubeObject, CRUD_TYPES.CREATE, {
-    createCustomMessages: () => ({
+    createCustomMessages: (item) => ({
       onMutate: {
         message: 'Creating build PipelineRun',
       },
@@ -27,6 +30,26 @@ export const useCreateBuildPipelineRun = ({
       },
       onSuccess: {
         message: 'Start building application(s)',
+        options: {
+          persist: true,
+          content: (key, message) => (
+            <Snackbar
+              text={String(message)}
+              snackbarKey={key}
+              pushLocation={{
+                href: {
+                  routeName: routePipelineRunDetails.path,
+                  params: {
+                    namespace: item.metadata.namespace || getDefaultNamespace(),
+                    name: item.metadata.name,
+                  },
+                },
+                text: 'Check status',
+              }}
+              variant={'success'}
+            />
+          ),
+        },
       },
     }),
   });

diff --git a/...ineRun/hooks/useCreateCleanPipelineRun.ts → ...neRun/hooks/useCreateCleanPipelineRun.tsx b/...ineRun/hooks/useCreateCleanPipelineRun.ts → ...neRun/hooks/useCreateCleanPipelineRun.tsx
@@ -1,6 +1,9 @@
 import React from 'react';
+import { Snackbar } from '../../../../../components/Snackbar';
 import { CRUD_TYPES } from '../../../../../constants/crudTypes';
 import { useResourceCRUDMutation } from '../../../../../hooks/useResourceCRUDMutation';
+import { routePipelineRunDetails } from '../../../../../pages/pipeline-details/route';
+import { getDefaultNamespace } from '../../../../../utils/getDefaultNamespace';
 import { PipelineRunKubeObject } from '../index';
 import { PipelineRunKubeObjectInterface } from '../types';
 
@@ -22,7 +25,7 @@ export const useCreateCleanPipelineRun = ({
     PipelineRunKubeObjectInterface,
     CRUD_TYPES.CREATE
   >('cleanPipelineRunCreateMutation', PipelineRunKubeObject, CRUD_TYPES.CREATE, {
-    createCustomMessages: () => ({
+    createCustomMessages: (item) => ({
       onMutate: {
         message: 'Creating clean PipelineRun',
       },
@@ -31,6 +34,26 @@ export const useCreateCleanPipelineRun = ({
       },
       onSuccess: {
         message: 'Start cleaning application(s)',
+        options: {
+          persist: true,
+          content: (key, message) => (
+            <Snackbar
+              text={String(message)}
+              snackbarKey={key}
+              pushLocation={{
+                href: {
+                  routeName: routePipelineRunDetails.path,
+                  params: {
+                    namespace: item.metadata.namespace || getDefaultNamespace(),
+                    name: item.metadata.name,
+                  },
+                },
+                text: 'Check status',
+              }}
+              variant={'success'}
+            />
+          ),
+        },
       },
     }),
   });

diff --git a/...neRun/hooks/useCreateDeployPipelineRun.ts → ...eRun/hooks/useCreateDeployPipelineRun.tsx b/...neRun/hooks/useCreateDeployPipelineRun.ts → ...eRun/hooks/useCreateDeployPipelineRun.tsx
@@ -1,6 +1,9 @@
 import React from 'react';
+import { Snackbar } from '../../../../../components/Snackbar';
 import { CRUD_TYPES } from '../../../../../constants/crudTypes';
 import { useResourceCRUDMutation } from '../../../../../hooks/useResourceCRUDMutation';
+import { routePipelineRunDetails } from '../../../../../pages/pipeline-details/route';
+import { getDefaultNamespace } from '../../../../../utils/getDefaultNamespace';
 import { PipelineRunKubeObject } from '../index';
 import { PipelineRunKubeObjectInterface } from '../types';
 
@@ -22,7 +25,7 @@ export const useCreateDeployPipelineRun = ({
     PipelineRunKubeObjectInterface,
     CRUD_TYPES.CREATE
   >('deployPipelineRunCreateMutation', PipelineRunKubeObject, CRUD_TYPES.CREATE, {
-    createCustomMessages: () => ({
+    createCustomMessages: (item) => ({
       onMutate: {
         message: 'Creating deploy PipelineRun',
       },
@@ -31,6 +34,26 @@ export const useCreateDeployPipelineRun = ({
       },
       onSuccess: {
         message: 'Start deploying application(s)',
+        options: {
+          persist: true,
+          content: (key, message) => (
+            <Snackbar
+              text={String(message)}
+              snackbarKey={key}
+              pushLocation={{
+                href: {
+                  routeName: routePipelineRunDetails.path,
+                  params: {
+                    namespace: item.metadata.namespace || getDefaultNamespace(),
+                    name: item.metadata.name,
+                  },
+                },
+                text: 'Check status',
+              }}
+              variant={'success'}
+            />
+          ),
+        },
       },
     }),
   });

diff --git a/src/k8s/groups/Tekton/PipelineRun/utils/createBuildPipelineRunInstance/index.test.ts b/src/k8s/groups/Tekton/PipelineRun/utils/createBuildPipelineRunInstance/index.test.ts
@@ -1,8 +1,16 @@
+import { v4 as uuidv4 } from 'uuid';
 import { CodebaseKubeObjectInterface } from '../../../../EDP/Codebase/types';
 import { CodebaseBranchKubeObjectInterface } from '../../../../EDP/CodebaseBranch/types';
 import { GitServerKubeObjectInterface } from '../../../../EDP/GitServer/types';
 import { createBuildPipelineRunInstance } from './index';
 
+jest.mock('uuid', () => ({
+  v4: jest.fn(),
+}));
+
+const MOCKED_UUID = '1234';
+(uuidv4 as jest.Mock).mockReturnValue(MOCKED_UUID);
+
 describe('testing createBuildPipelineRunInstance', () => {
   it('should return valid kube object', () => {
     const object = createBuildPipelineRunInstance({
@@ -138,7 +146,7 @@ describe('testing createBuildPipelineRunInstance', () => {
       kind: 'PipelineRun',
       metadata: {
         annotations: { 'argocd.argoproj.io/compare-options': 'IgnoreExtraneous' },
-        generateName: 'test-codebase-name-test-codebase-branch-name-build-',
+        name: `test-codebase-name-test-codebase-branch-name-build-${MOCKED_UUID}`,
         labels: {
           'app.edp.epam.com/codebase': 'test-codebase-name',
           'app.edp.epam.com/codebasebranch': 'test-codebase-name-test-codebase-branch-name',

diff --git a/src/k8s/groups/Tekton/PipelineRun/utils/createBuildPipelineRunInstance/index.ts b/src/k8s/groups/Tekton/PipelineRun/utils/createBuildPipelineRunInstance/index.ts
@@ -1,4 +1,5 @@
 import { PIPELINE_TYPES } from '../../../../../../constants/pipelineTypes';
+import { createRandomString } from '../../../../../../utils/createRandomString';
 import { CodebaseKubeObjectInterface } from '../../../../EDP/Codebase/types';
 import { CodebaseBranchKubeObjectInterface } from '../../../../EDP/CodebaseBranch/types';
 import { GitServerKubeObjectInterface } from '../../../../EDP/GitServer/types';
@@ -36,11 +37,15 @@ export const createBuildPipelineRunInstance = ({
 
   const base = { ...pipelineRunTemplate };
 
-  base.metadata.generateName = base.metadata.generateName.replace(
+  const generateName = base.metadata.generateName.replace(
     '$(tt.params.codebasebranch)',
     codebaseBranchMetadataName
   );
 
+  delete base.metadata.generateName;
+
+  base.metadata.name = `${generateName}${createRandomString(4)}`;
+
   base.metadata.labels[PIPELINE_RUN_LABEL_SELECTOR_CODEBASE] = codebaseName;
   base.metadata.labels[PIPELINE_RUN_LABEL_SELECTOR_CODEBASE_BRANCH] = codebaseBranchMetadataName;
   base.metadata.labels[PIPELINE_RUN_LABEL_SELECTOR_PIPELINE_TYPE] = PIPELINE_TYPES.BUILD;

diff --git a/src/k8s/groups/Tekton/PipelineRun/utils/createCleanPipelineRunInstance/index.test.ts b/src/k8s/groups/Tekton/PipelineRun/utils/createCleanPipelineRunInstance/index.test.ts
@@ -1,5 +1,13 @@
+import { v4 as uuidv4 } from 'uuid';
 import { createCleanPipelineRunInstance } from './index';
 
+jest.mock('uuid', () => ({
+  v4: jest.fn(),
+}));
+
+const MOCKED_UUID = '1234';
+(uuidv4 as jest.Mock).mockReturnValue(MOCKED_UUID);
+
 describe('testing createCleanPipelineRunInstance', () => {
   it('should return valid kube object', () => {
     const object = createCleanPipelineRunInstance({
@@ -98,7 +106,7 @@ describe('testing createCleanPipelineRunInstance', () => {
       kind: 'PipelineRun',
       metadata: {
         annotations: { 'argocd.argoproj.io/compare-options': 'IgnoreExtraneous' },
-        generateName: 'clean-test-pipe-sit-',
+        name: `clean-test-pipe-sit-${MOCKED_UUID}`,
         labels: {
           'app.edp.epam.com/cdpipeline': 'test-pipe',
           'app.edp.epam.com/cdstage': 'test-pipe-sit',