From be192862cfb33cbe231ebd17cef1488f77b33460 Mon Sep 17 00:00:00 2001 From: Adhitya Mamallan Date: Fri, 20 Jun 2025 16:47:43 +0200 Subject: [PATCH 1/3] Fix issue with basic visibility filters --- .../domain-workflows-basic-filters.test.tsx | 23 ++++++++++++++++--- .../domain-workflows-basic-filters.tsx | 15 ++++++------ .../domain-workflows-basic-filters.types.ts | 3 +++ .../domain-workflows-basic-table.test.tsx | 6 ++++- .../domain-workflows-basic-table.tsx | 15 +++++------- .../domain-workflows-basic-table.types.ts | 1 + ...-workflows-basic-error-panel-props.test.ts | 10 ++++---- .../get-workflows-basic-error-panel-props.ts | 6 ++--- .../domain-workflows-basic.tsx | 23 ++++++++++++++++++- .../domain-workflows-advanced.tsx | 6 ++--- 10 files changed, 75 insertions(+), 33 deletions(-) diff --git a/src/views/domain-workflows-basic/domain-workflows-basic-filters/__tests__/domain-workflows-basic-filters.test.tsx b/src/views/domain-workflows-basic/domain-workflows-basic-filters/__tests__/domain-workflows-basic-filters.test.tsx index 89251674d..c496af7ca 100644 --- a/src/views/domain-workflows-basic/domain-workflows-basic-filters/__tests__/domain-workflows-basic-filters.test.tsx +++ b/src/views/domain-workflows-basic/domain-workflows-basic-filters/__tests__/domain-workflows-basic-filters.test.tsx @@ -40,7 +40,7 @@ jest.mock('@/components/page-filters/hooks/use-page-filters', () => describe(DomainWorkflowsBasicFilters.name, () => { it('renders page search and filters', async () => { - render(); + setup(); expect( await screen.findByText('Filter search: Workflow ID') @@ -53,8 +53,7 @@ describe(DomainWorkflowsBasicFilters.name, () => { }); it('hides page filters when filter toggle is clicked', async () => { - const user = userEvent.setup(); - render(); + const { user } = setup(); expect(await screen.findByText('Filter fields')).toBeInTheDocument(); @@ -64,3 +63,21 @@ describe(DomainWorkflowsBasicFilters.name, () => { expect(screen.queryByText('Filter fields')).toBeNull(); }); }); + +function setup() { + const mockSetQueryParams = jest.fn(); + const mockResetAllFilters = jest.fn(); + const mockActiveFiltersCount = 2; + const user = userEvent.setup(); + + render( + + ); + + return { user }; +} diff --git a/src/views/domain-workflows-basic/domain-workflows-basic-filters/domain-workflows-basic-filters.tsx b/src/views/domain-workflows-basic/domain-workflows-basic-filters/domain-workflows-basic-filters.tsx index 7ff764321..8c3029704 100644 --- a/src/views/domain-workflows-basic/domain-workflows-basic-filters/domain-workflows-basic-filters.tsx +++ b/src/views/domain-workflows-basic/domain-workflows-basic-filters/domain-workflows-basic-filters.tsx @@ -1,7 +1,6 @@ 'use client'; import { useState } from 'react'; -import usePageFilters from '@/components/page-filters/hooks/use-page-filters'; import PageFiltersFields from '@/components/page-filters/page-filters-fields/page-filters-fields'; import PageFiltersSearch from '@/components/page-filters/page-filters-search/page-filters-search'; import PageFiltersToggle from '@/components/page-filters/page-filters-toggle/page-filters-toggle'; @@ -11,16 +10,16 @@ import domainWorkflowsBasicFiltersConfig from '../config/domain-workflows-basic- import DOMAIN_WORKFLOWS_BASIC_SEARCH_DEBOUNCE_MS from '../config/domain-workflows-basic-search-debounce-ms.config'; import { styled } from './domain-workflows-basic-filters.styles'; +import { type Props } from './domain-workflows-basic-filters.types'; -export default function DomainWorkflowsBasicFilters() { +export default function DomainWorkflowsBasicFilters({ + resetAllFilters, + activeFiltersCount, + queryParams, + setQueryParams, +}: Props) { const [areFiltersShown, setAreFiltersShown] = useState(true); - const { resetAllFilters, activeFiltersCount, queryParams, setQueryParams } = - usePageFilters({ - pageFiltersConfig: domainWorkflowsBasicFiltersConfig, - pageQueryParamsConfig: domainPageQueryParamsConfig, - }); - return ( diff --git a/src/views/domain-workflows-basic/domain-workflows-basic-filters/domain-workflows-basic-filters.types.ts b/src/views/domain-workflows-basic/domain-workflows-basic-filters/domain-workflows-basic-filters.types.ts index 0f9e05e06..0998bbe2c 100644 --- a/src/views/domain-workflows-basic/domain-workflows-basic-filters/domain-workflows-basic-filters.types.ts +++ b/src/views/domain-workflows-basic/domain-workflows-basic-filters/domain-workflows-basic-filters.types.ts @@ -1,3 +1,6 @@ +import type usePageFilters from '@/components/page-filters/hooks/use-page-filters'; import { type WorkflowStatus } from '@/views/shared/workflow-status-tag/workflow-status-tag.types'; export type WorkflowStatusBasicVisibility = WorkflowStatus | 'ALL_CLOSED'; + +export type Props = ReturnType; diff --git a/src/views/domain-workflows-basic/domain-workflows-basic-table/__tests__/domain-workflows-basic-table.test.tsx b/src/views/domain-workflows-basic/domain-workflows-basic-table/__tests__/domain-workflows-basic-table.test.tsx index 555701be3..7f863ba52 100644 --- a/src/views/domain-workflows-basic/domain-workflows-basic-table/__tests__/domain-workflows-basic-table.test.tsx +++ b/src/views/domain-workflows-basic/domain-workflows-basic-table/__tests__/domain-workflows-basic-table.test.tsx @@ -185,7 +185,11 @@ function setup({ const user = userEvent.setup(); const renderResult = render( - , + , { endpointsMocks: [ { diff --git a/src/views/domain-workflows-basic/domain-workflows-basic-table/domain-workflows-basic-table.tsx b/src/views/domain-workflows-basic/domain-workflows-basic-table/domain-workflows-basic-table.tsx index 5e1f377b7..c70047ddf 100644 --- a/src/views/domain-workflows-basic/domain-workflows-basic-table/domain-workflows-basic-table.tsx +++ b/src/views/domain-workflows-basic/domain-workflows-basic-table/domain-workflows-basic-table.tsx @@ -4,8 +4,6 @@ import React from 'react'; import ErrorPanel from '@/components/error-panel/error-panel'; import PanelSection from '@/components/panel-section/panel-section'; import SectionLoadingIndicator from '@/components/section-loading-indicator/section-loading-indicator'; -import usePageQueryParams from '@/hooks/use-page-query-params/use-page-query-params'; -import domainPageQueryParamsConfig from '@/views/domain-page/config/domain-page-query-params.config'; import WorkflowsTable from '@/views/shared/workflows-table/workflows-table'; import useListWorkflowsBasic from '../hooks/use-list-workflows-basic'; @@ -13,9 +11,11 @@ import useListWorkflowsBasic from '../hooks/use-list-workflows-basic'; import { type Props } from './domain-workflows-basic-table.types'; import getWorkflowsBasicErrorPanelProps from './helpers/get-workflows-basic-error-panel-props'; -export default function DomainWorkflowsBasicTable({ domain, cluster }: Props) { - const [queryParams] = usePageQueryParams(domainPageQueryParamsConfig); - +export default function DomainWorkflowsBasicTable({ + domain, + cluster, + areAnyFiltersActive, +}: Props) { const [ { data, @@ -36,10 +36,7 @@ export default function DomainWorkflowsBasicTable({ domain, cluster }: Props) { if (data.length === 0) { const errorPanelProps = getWorkflowsBasicErrorPanelProps({ error, - areSearchParamsAbsent: - !queryParams.workflowId && - !queryParams.workflowType && - !queryParams.statusBasic, + areAnyFiltersActive, }); if (errorPanelProps) { diff --git a/src/views/domain-workflows-basic/domain-workflows-basic-table/domain-workflows-basic-table.types.ts b/src/views/domain-workflows-basic/domain-workflows-basic-table/domain-workflows-basic-table.types.ts index fd9087d98..e60c74253 100644 --- a/src/views/domain-workflows-basic/domain-workflows-basic-table/domain-workflows-basic-table.types.ts +++ b/src/views/domain-workflows-basic/domain-workflows-basic-table/domain-workflows-basic-table.types.ts @@ -4,6 +4,7 @@ import { type DomainWorkflow } from '@/views/domain-page/domain-page.types'; export type Props = { domain: string; cluster: string; + areAnyFiltersActive: boolean; }; export type DomainWorkflowsBasicTableConfig = Array< diff --git a/src/views/domain-workflows-basic/domain-workflows-basic-table/helpers/__tests__/get-workflows-basic-error-panel-props.test.ts b/src/views/domain-workflows-basic/domain-workflows-basic-table/helpers/__tests__/get-workflows-basic-error-panel-props.test.ts index 84e11530e..81a9eabee 100644 --- a/src/views/domain-workflows-basic/domain-workflows-basic-table/helpers/__tests__/get-workflows-basic-error-panel-props.test.ts +++ b/src/views/domain-workflows-basic/domain-workflows-basic-table/helpers/__tests__/get-workflows-basic-error-panel-props.test.ts @@ -12,7 +12,7 @@ describe(getWorkflowsBasicErrorPanelProps.name, () => { error: new UseMergedInfiniteQueriesError('Test error', [ new RequestError('Something went wrong', '/query1', 500), ]), - areSearchParamsAbsent: false, + areAnyFiltersActive: true, }) ).toEqual({ message: 'Failed to fetch workflows', @@ -32,18 +32,18 @@ describe(getWorkflowsBasicErrorPanelProps.name, () => { }, ]), ]), - areSearchParamsAbsent: false, + areAnyFiltersActive: true, }) ).toEqual({ message: 'Validation error: Incorrect field value', }); }); - it('returns "not found" error panel props when search params are absent', () => { + it('returns "not found" error panel props when no filters are active', () => { expect( getWorkflowsBasicErrorPanelProps({ error: null, - areSearchParamsAbsent: true, + areAnyFiltersActive: false, }) ).toEqual({ message: 'No workflows found for this domain', @@ -62,7 +62,7 @@ describe(getWorkflowsBasicErrorPanelProps.name, () => { expect( getWorkflowsBasicErrorPanelProps({ error: null, - areSearchParamsAbsent: false, + areAnyFiltersActive: true, }) ).toBeUndefined(); }); diff --git a/src/views/domain-workflows-basic/domain-workflows-basic-table/helpers/get-workflows-basic-error-panel-props.ts b/src/views/domain-workflows-basic/domain-workflows-basic-table/helpers/get-workflows-basic-error-panel-props.ts index 61336aaff..e52ecfe64 100644 --- a/src/views/domain-workflows-basic/domain-workflows-basic-table/helpers/get-workflows-basic-error-panel-props.ts +++ b/src/views/domain-workflows-basic/domain-workflows-basic-table/helpers/get-workflows-basic-error-panel-props.ts @@ -6,10 +6,10 @@ import { RequestError } from '@/utils/request/request-error'; export default function getWorkflowsBasicErrorPanelProps({ error, - areSearchParamsAbsent, + areAnyFiltersActive, }: { error: UseMergedInfiniteQueriesError | null; - areSearchParamsAbsent: boolean; + areAnyFiltersActive: boolean; }): ErrorPanelProps | undefined { if (error) { if ( @@ -44,7 +44,7 @@ export default function getWorkflowsBasicErrorPanelProps({ }; } - if (areSearchParamsAbsent) { + if (!areAnyFiltersActive) { return { message: 'No workflows found for this domain', actions: [ diff --git a/src/views/domain-workflows-basic/domain-workflows-basic.tsx b/src/views/domain-workflows-basic/domain-workflows-basic.tsx index 8cff58b6d..a8213f474 100644 --- a/src/views/domain-workflows-basic/domain-workflows-basic.tsx +++ b/src/views/domain-workflows-basic/domain-workflows-basic.tsx @@ -1,17 +1,38 @@ +'use client'; import React from 'react'; +import usePageFilters from '@/components/page-filters/hooks/use-page-filters'; import { type DomainPageTabContentProps } from '@/views/domain-page/domain-page-content/domain-page-content.types'; +import domainPageQueryParamsConfig from '../domain-page/config/domain-page-query-params.config'; + +import domainWorkflowsBasicFiltersConfig from './config/domain-workflows-basic-filters.config'; import DomainWorkflowsBasicFilters from './domain-workflows-basic-filters/domain-workflows-basic-filters'; import DomainWorkflowsBasicTable from './domain-workflows-basic-table/domain-workflows-basic-table'; export default function DomainWorkflowsBasic(props: DomainPageTabContentProps) { + const { resetAllFilters, activeFiltersCount, queryParams, setQueryParams } = + usePageFilters({ + pageFiltersConfig: domainWorkflowsBasicFiltersConfig, + pageQueryParamsConfig: domainPageQueryParamsConfig, + }); + return ( <> - + 0 || + queryParams.workflowId || + queryParams.workflowType + )} /> ); diff --git a/src/views/domain-workflows/domain-workflows-advanced/domain-workflows-advanced.tsx b/src/views/domain-workflows/domain-workflows-advanced/domain-workflows-advanced.tsx index 9743945a4..4942d3697 100644 --- a/src/views/domain-workflows/domain-workflows-advanced/domain-workflows-advanced.tsx +++ b/src/views/domain-workflows/domain-workflows-advanced/domain-workflows-advanced.tsx @@ -18,15 +18,15 @@ export default function DomainWorkflowsAdvanced({ domain, cluster }: Props) { return { timeRangeStart: getDayjsFromDateFilterValue( - queryParams.timeRangeStartBasic, + queryParams.timeRangeStart, now ).toISOString(), timeRangeEnd: getDayjsFromDateFilterValue( - queryParams.timeRangeEndBasic, + queryParams.timeRangeEnd, now ).toISOString(), }; - }, [queryParams.timeRangeStartBasic, queryParams.timeRangeEndBasic]); + }, [queryParams.timeRangeStart, queryParams.timeRangeEnd]); return ( <> From 142f4e2b5333d9882252a8932ddf34af8194322e Mon Sep 17 00:00:00 2001 From: Adhitya Mamallan Date: Fri, 20 Jun 2025 16:52:28 +0200 Subject: [PATCH 2/3] clean up setup --- .../domain-workflows-basic-filters.test.tsx | 21 +++---------------- 1 file changed, 3 insertions(+), 18 deletions(-) diff --git a/src/views/domain-workflows-basic/domain-workflows-basic-filters/__tests__/domain-workflows-basic-filters.test.tsx b/src/views/domain-workflows-basic/domain-workflows-basic-filters/__tests__/domain-workflows-basic-filters.test.tsx index c496af7ca..baa5d7701 100644 --- a/src/views/domain-workflows-basic/domain-workflows-basic-filters/__tests__/domain-workflows-basic-filters.test.tsx +++ b/src/views/domain-workflows-basic/domain-workflows-basic-filters/__tests__/domain-workflows-basic-filters.test.tsx @@ -26,18 +26,6 @@ jest.mock( )) ); -const mockSetQueryParams = jest.fn(); -const mockResetAllFilters = jest.fn(); -const mockActiveFiltersCount = 2; -jest.mock('@/components/page-filters/hooks/use-page-filters', () => - jest.fn(() => ({ - resetAllFilters: mockResetAllFilters, - activeFiltersCount: mockActiveFiltersCount, - queryParams: mockDomainPageQueryParamsValues, - setQueryParams: mockSetQueryParams, - })) -); - describe(DomainWorkflowsBasicFilters.name, () => { it('renders page search and filters', async () => { setup(); @@ -65,17 +53,14 @@ describe(DomainWorkflowsBasicFilters.name, () => { }); function setup() { - const mockSetQueryParams = jest.fn(); - const mockResetAllFilters = jest.fn(); - const mockActiveFiltersCount = 2; const user = userEvent.setup(); render( ); From db6b9ccf385ea5332674156785749497b44f0745 Mon Sep 17 00:00:00 2001 From: Adhitya Mamallan Date: Fri, 20 Jun 2025 16:58:24 +0200 Subject: [PATCH 3/3] Rename prop --- .../__tests__/domain-workflows-basic-table.test.tsx | 2 +- .../domain-workflows-basic-table.tsx | 4 ++-- .../domain-workflows-basic-table.types.ts | 2 +- .../get-workflows-basic-error-panel-props.test.ts | 8 ++++---- .../helpers/get-workflows-basic-error-panel-props.ts | 6 +++--- .../domain-workflows-basic/domain-workflows-basic.tsx | 2 +- 6 files changed, 12 insertions(+), 12 deletions(-) diff --git a/src/views/domain-workflows-basic/domain-workflows-basic-table/__tests__/domain-workflows-basic-table.test.tsx b/src/views/domain-workflows-basic/domain-workflows-basic-table/__tests__/domain-workflows-basic-table.test.tsx index 7f863ba52..772bfaab3 100644 --- a/src/views/domain-workflows-basic/domain-workflows-basic-table/__tests__/domain-workflows-basic-table.test.tsx +++ b/src/views/domain-workflows-basic/domain-workflows-basic-table/__tests__/domain-workflows-basic-table.test.tsx @@ -188,7 +188,7 @@ function setup({ , { endpointsMocks: [ diff --git a/src/views/domain-workflows-basic/domain-workflows-basic-table/domain-workflows-basic-table.tsx b/src/views/domain-workflows-basic/domain-workflows-basic-table/domain-workflows-basic-table.tsx index c70047ddf..ac7e957ff 100644 --- a/src/views/domain-workflows-basic/domain-workflows-basic-table/domain-workflows-basic-table.tsx +++ b/src/views/domain-workflows-basic/domain-workflows-basic-table/domain-workflows-basic-table.tsx @@ -14,7 +14,7 @@ import getWorkflowsBasicErrorPanelProps from './helpers/get-workflows-basic-erro export default function DomainWorkflowsBasicTable({ domain, cluster, - areAnyFiltersActive, + hasActiveSearchParams, }: Props) { const [ { @@ -36,7 +36,7 @@ export default function DomainWorkflowsBasicTable({ if (data.length === 0) { const errorPanelProps = getWorkflowsBasicErrorPanelProps({ error, - areAnyFiltersActive, + hasActiveSearchParams, }); if (errorPanelProps) { diff --git a/src/views/domain-workflows-basic/domain-workflows-basic-table/domain-workflows-basic-table.types.ts b/src/views/domain-workflows-basic/domain-workflows-basic-table/domain-workflows-basic-table.types.ts index e60c74253..6beaec6a5 100644 --- a/src/views/domain-workflows-basic/domain-workflows-basic-table/domain-workflows-basic-table.types.ts +++ b/src/views/domain-workflows-basic/domain-workflows-basic-table/domain-workflows-basic-table.types.ts @@ -4,7 +4,7 @@ import { type DomainWorkflow } from '@/views/domain-page/domain-page.types'; export type Props = { domain: string; cluster: string; - areAnyFiltersActive: boolean; + hasActiveSearchParams: boolean; }; export type DomainWorkflowsBasicTableConfig = Array< diff --git a/src/views/domain-workflows-basic/domain-workflows-basic-table/helpers/__tests__/get-workflows-basic-error-panel-props.test.ts b/src/views/domain-workflows-basic/domain-workflows-basic-table/helpers/__tests__/get-workflows-basic-error-panel-props.test.ts index 81a9eabee..874532df6 100644 --- a/src/views/domain-workflows-basic/domain-workflows-basic-table/helpers/__tests__/get-workflows-basic-error-panel-props.test.ts +++ b/src/views/domain-workflows-basic/domain-workflows-basic-table/helpers/__tests__/get-workflows-basic-error-panel-props.test.ts @@ -12,7 +12,7 @@ describe(getWorkflowsBasicErrorPanelProps.name, () => { error: new UseMergedInfiniteQueriesError('Test error', [ new RequestError('Something went wrong', '/query1', 500), ]), - areAnyFiltersActive: true, + hasActiveSearchParams: true, }) ).toEqual({ message: 'Failed to fetch workflows', @@ -32,7 +32,7 @@ describe(getWorkflowsBasicErrorPanelProps.name, () => { }, ]), ]), - areAnyFiltersActive: true, + hasActiveSearchParams: true, }) ).toEqual({ message: 'Validation error: Incorrect field value', @@ -43,7 +43,7 @@ describe(getWorkflowsBasicErrorPanelProps.name, () => { expect( getWorkflowsBasicErrorPanelProps({ error: null, - areAnyFiltersActive: false, + hasActiveSearchParams: false, }) ).toEqual({ message: 'No workflows found for this domain', @@ -62,7 +62,7 @@ describe(getWorkflowsBasicErrorPanelProps.name, () => { expect( getWorkflowsBasicErrorPanelProps({ error: null, - areAnyFiltersActive: true, + hasActiveSearchParams: true, }) ).toBeUndefined(); }); diff --git a/src/views/domain-workflows-basic/domain-workflows-basic-table/helpers/get-workflows-basic-error-panel-props.ts b/src/views/domain-workflows-basic/domain-workflows-basic-table/helpers/get-workflows-basic-error-panel-props.ts index e52ecfe64..ac0b33860 100644 --- a/src/views/domain-workflows-basic/domain-workflows-basic-table/helpers/get-workflows-basic-error-panel-props.ts +++ b/src/views/domain-workflows-basic/domain-workflows-basic-table/helpers/get-workflows-basic-error-panel-props.ts @@ -6,10 +6,10 @@ import { RequestError } from '@/utils/request/request-error'; export default function getWorkflowsBasicErrorPanelProps({ error, - areAnyFiltersActive, + hasActiveSearchParams, }: { error: UseMergedInfiniteQueriesError | null; - areAnyFiltersActive: boolean; + hasActiveSearchParams: boolean; }): ErrorPanelProps | undefined { if (error) { if ( @@ -44,7 +44,7 @@ export default function getWorkflowsBasicErrorPanelProps({ }; } - if (!areAnyFiltersActive) { + if (!hasActiveSearchParams) { return { message: 'No workflows found for this domain', actions: [ diff --git a/src/views/domain-workflows-basic/domain-workflows-basic.tsx b/src/views/domain-workflows-basic/domain-workflows-basic.tsx index a8213f474..d884f91e9 100644 --- a/src/views/domain-workflows-basic/domain-workflows-basic.tsx +++ b/src/views/domain-workflows-basic/domain-workflows-basic.tsx @@ -28,7 +28,7 @@ export default function DomainWorkflowsBasic(props: DomainPageTabContentProps) { 0 || queryParams.workflowId || queryParams.workflowType