diff --git a/frontend/benefit/handler/src/components/applicationList/HandlerIndex.tsx b/frontend/benefit/handler/src/components/applicationList/HandlerIndex.tsx index 1d839eae3c..3a7a5685e5 100644 --- a/frontend/benefit/handler/src/components/applicationList/HandlerIndex.tsx +++ b/frontend/benefit/handler/src/components/applicationList/HandlerIndex.tsx @@ -1,4 +1,7 @@ -import { ALL_APPLICATION_STATUSES } from 'benefit/handler/constants'; +import { + ALL_APPLICATION_STATUSES, + APPLICATION_LIST_TABS, +} from 'benefit/handler/constants'; import FrontPageProvider from 'benefit/handler/context/FrontPageProvider'; import { APPLICATION_STATUSES, BATCH_STATUSES } from 'benefit-shared/constants'; import { ApplicationListItemData } from 'benefit-shared/types/application'; @@ -110,6 +113,9 @@ const HandlerIndex: React.FC = ({ ); } + const updateTabToUrl = (tabNumber: APPLICATION_LIST_TABS): void => + window.history.pushState({ tab }, '', `/?tab=${tabNumber}`); + return ( <$BackgroundWrapper backgroundColor={layoutBackgroundColor}> @@ -117,32 +123,44 @@ const HandlerIndex: React.FC = ({ - + updateTabToUrl(APPLICATION_LIST_TABS.ALL)} + > {getListHeadingByStatus('all', ALL_APPLICATION_STATUSES)} - + updateTabToUrl(APPLICATION_LIST_TABS.DRAFT)} + > {getListHeadingByStatus(APPLICATION_STATUSES.DRAFT, [ APPLICATION_STATUSES.DRAFT, ])} - + updateTabToUrl(APPLICATION_LIST_TABS.RECEIVED)} + > {getListHeadingByStatus(APPLICATION_STATUSES.RECEIVED, [ APPLICATION_STATUSES.RECEIVED, ])} - + updateTabToUrl(APPLICATION_LIST_TABS.HANDLING)} + > {getListHeadingByStatus(APPLICATION_STATUSES.HANDLING, [ APPLICATION_STATUSES.HANDLING, APPLICATION_STATUSES.INFO_REQUIRED, ])} - + updateTabToUrl(APPLICATION_LIST_TABS.ACCEPTED)} + > {getListHeadingByStatus('pending', [ APPLICATION_STATUSES.ACCEPTED, APPLICATION_STATUSES.REJECTED, ])} - + updateTabToUrl(APPLICATION_LIST_TABS.IN_PAYMENT)} + > {getListHeadingByStatus('inPayment', [ APPLICATION_STATUSES.ACCEPTED, ])} diff --git a/frontend/benefit/handler/src/constants.ts b/frontend/benefit/handler/src/constants.ts index d5b4c0b919..3ca0277ca7 100644 --- a/frontend/benefit/handler/src/constants.ts +++ b/frontend/benefit/handler/src/constants.ts @@ -234,6 +234,7 @@ export enum APPLICATION_LIST_TABS { HANDLING = '3', ACCEPTED = '4', REJECTED = '5', + IN_PAYMENT = '5', } export const DEFAULT_MINIMUM_RECOVERY_AMOUNT = 20;