diff --git a/src/components/Project/test/ProjectWorkflows.test.tsx b/src/components/Project/test/ProjectWorkflows.test.tsx index 31cb87a83..f47090c81 100644 --- a/src/components/Project/test/ProjectWorkflows.test.tsx +++ b/src/components/Project/test/ProjectWorkflows.test.tsx @@ -91,6 +91,6 @@ describe('ProjectWorkflows', () => { await waitFor(() => expect(getByText('MyWorkflow'))); fireEvent.click(checkboxes[0]); // when user selects checkbox, table should have no workflows to display - await waitFor(() => expect(queryByText('MyWorkflow')).toBeNull()); + await waitFor(() => expect(queryByText('MyWorkflow')).not.toBeInTheDocument()); }); }); diff --git a/src/components/Workflow/SearchableWorkflowNameList.tsx b/src/components/Workflow/SearchableWorkflowNameList.tsx index 391a7cafc..14cd92f9d 100644 --- a/src/components/Workflow/SearchableWorkflowNameList.tsx +++ b/src/components/Workflow/SearchableWorkflowNameList.tsx @@ -68,12 +68,6 @@ const useStyles = makeStyles((theme: Theme) => ({ alignItems: 'center', marginRight: 24, }, - confirmationBox: { - height: '100%', - [`& > button`]: { - height: '100%', - }, - }, confirmationButton: { borderRadius: 0, minWidth: '100px', @@ -170,97 +164,99 @@ const padExecutionPaths = (items: WorkflowExecutionIdentifier[]) => { const getArchiveIcon = (isArchived: boolean) => isArchived ? : ; -const SearchableWorkflowNameItemActions: React.FC = - React.memo(({ item, setHideItem }) => { - const styles = useStyles(); - const { enqueueSnackbar } = useSnackbar(); - const { id } = item; - const isArchived = isWorkflowArchived(item); - const [isUpdating, setIsUpdating] = useState(false); - const [showConfirmation, setShowConfirmation] = useState(false); +const SearchableWorkflowNameItemActions: React.FC = ({ + item, + setHideItem, +}) => { + const styles = useStyles(); + const { enqueueSnackbar } = useSnackbar(); + const { id } = item; + const isArchived = isWorkflowArchived(item); + const [isUpdating, setIsUpdating] = useState(false); + const [showConfirmation, setShowConfirmation] = useState(false); - const mutation = useMutation( - (newState: WorkflowExecutionState) => updateWorkflowState(id, newState), - { - onMutate: () => setIsUpdating(true), - onSuccess: () => { - enqueueSnackbar(t('archiveSuccess', !isArchived), { - variant: 'success', - }); - setHideItem(true); - }, - onError: () => { - enqueueSnackbar(`${mutation.error ?? t('archiveError', !isArchived)}`, { - variant: 'error', - }); - }, - onSettled: () => { - setShowConfirmation(false); - setIsUpdating(false); - }, + const mutation = useMutation( + (newState: WorkflowExecutionState) => updateWorkflowState(id, newState), + { + onMutate: () => setIsUpdating(true), + onSuccess: () => { + enqueueSnackbar(t('archiveSuccess', !isArchived), { + variant: 'success', + }); + setHideItem(true); }, - ); + onError: () => { + enqueueSnackbar(`${mutation.error ?? t('archiveError', !isArchived)}`, { + variant: 'error', + }); + }, + onSettled: () => { + setShowConfirmation(false); + setIsUpdating(false); + }, + }, + ); - const onArchiveClick = (event: React.MouseEvent) => { - event.stopPropagation(); - event.preventDefault(); - setShowConfirmation(true); - }; + const onArchiveClick = (event: React.MouseEvent) => { + event.stopPropagation(); + event.preventDefault(); + setShowConfirmation(true); + }; - const onConfirmArchiveClick = (event: React.MouseEvent) => { - event.stopPropagation(); - event.preventDefault(); - mutation.mutate( - isWorkflowArchived(item) - ? WorkflowExecutionState.NAMED_ENTITY_ACTIVE - : WorkflowExecutionState.NAMED_ENTITY_ARCHIVED, - ); - }; + const onConfirmArchiveClick = (event: React.MouseEvent) => { + event.stopPropagation(); + event.preventDefault(); + mutation.mutate( + isWorkflowArchived(item) + ? WorkflowExecutionState.NAMED_ENTITY_ACTIVE + : WorkflowExecutionState.NAMED_ENTITY_ARCHIVED, + ); + }; - const onCancelClick = (event: React.MouseEvent) => { - event.stopPropagation(); - event.preventDefault(); - setShowConfirmation(false); - }; + const onCancelClick = (event: React.MouseEvent) => { + event.stopPropagation(); + event.preventDefault(); + setShowConfirmation(false); + }; - const singleItemStyle = isUpdating || !showConfirmation ? styles.centeredChild : ''; - return ( -
- {isUpdating ? ( - - - - ) : showConfirmation ? ( -
- - -
- ) : ( - - {getArchiveIcon(isArchived)} - - )} -
- ); - }); + const singleItemStyle = isUpdating || !showConfirmation ? styles.centeredChild : ''; + return ( +
+ {isUpdating ? ( + + + + ) : showConfirmation ? ( + <> + + + + ) : ( + + {getArchiveIcon(isArchived)} + + )} +
+ ); +}; /** * Renders individual searchable workflow item diff --git a/src/components/Workflow/filters/useWorkflowShowArchivedState.ts b/src/components/Workflow/filters/useWorkflowShowArchivedState.ts index f119fc683..9f9f4a017 100644 --- a/src/components/Workflow/filters/useWorkflowShowArchivedState.ts +++ b/src/components/Workflow/filters/useWorkflowShowArchivedState.ts @@ -14,8 +14,7 @@ interface ArchiveFilterState { export function useWorkflowShowArchivedState(): ArchiveFilterState { const [showArchived, setShowArchived] = useState(false); - // By default all values are returned with NAMED_ENTITY_ACTIVE state, - // so filter need to be applied only for ARCHIVED executions + // By default all values are returned with NAMED_ENTITY_ACTIVE state const getFilter = (): FilterOperation => { return { key: 'state', diff --git a/src/components/Workflow/utils.ts b/src/components/Workflow/utils.ts index 535c660cb..5486b08bc 100644 --- a/src/components/Workflow/utils.ts +++ b/src/components/Workflow/utils.ts @@ -5,6 +5,7 @@ function isWorkflowStateArchive(workflow: WorkflowListStructureItem): boolean { const state = workflow?.state ?? null; return !!state && state === WorkflowExecutionState.NAMED_ENTITY_ARCHIVED; } + export function isWorkflowArchived(workflow: WorkflowListStructureItem): boolean { return isWorkflowStateArchive(workflow); }