From 726999be2824c828823767804050885ef47f577f Mon Sep 17 00:00:00 2001 From: Tam Vu Date: Thu, 3 Sep 2026 15:27:40 -0400 Subject: [PATCH 1/2] Update the ASR completed status screen Co-authored-by: zach w/ an e --- .../AdditionalSalaryRequest.test.tsx | 8 +++-- .../Shared/Helper/getDotColor.test.ts | 11 ++++--- .../Shared/Helper/getDotColor.ts | 10 ++++-- .../SharedComponents/CurrentRequest.test.tsx | 31 ++++++++++--------- .../SharedComponents/CurrentRequest.tsx | 18 ++++++++--- 5 files changed, 49 insertions(+), 29 deletions(-) diff --git a/src/components/HrTools/AdditionalSalaryRequest/AdditionalSalaryRequest.test.tsx b/src/components/HrTools/AdditionalSalaryRequest/AdditionalSalaryRequest.test.tsx index 384f687350..298f5c593b 100644 --- a/src/components/HrTools/AdditionalSalaryRequest/AdditionalSalaryRequest.test.tsx +++ b/src/components/HrTools/AdditionalSalaryRequest/AdditionalSalaryRequest.test.tsx @@ -194,7 +194,8 @@ describe('AdditionalSalaryRequest', () => { />, ); - expect(await findByText(/Request processed on:/i)).toBeInTheDocument(); + expect(await findByText('Request processed')).toBeInTheDocument(); + expect(await findByText('Payroll processing')).toBeInTheDocument(); expect( await findByText(/Pending Additional Salary Request/i), ).toBeInTheDocument(); @@ -217,7 +218,8 @@ describe('AdditionalSalaryRequest', () => { />, ); - expect(await findByText(/Request processed on:/i)).toBeInTheDocument(); + expect(await findByText('Request processed')).toBeInTheDocument(); + expect(await findByText('Request approved')).toBeInTheDocument(); expect( await findByText(/Pending Additional Salary Request/i), ).toBeInTheDocument(); @@ -241,7 +243,7 @@ describe('AdditionalSalaryRequest', () => { />, ); - expect(await findByText('Action Required:')).toBeInTheDocument(); + expect(await findByText('Action required:')).toBeInTheDocument(); expect( await findByText('Please provide additional documentation'), ).toBeInTheDocument(); diff --git a/src/components/HrTools/AdditionalSalaryRequest/Shared/Helper/getDotColor.test.ts b/src/components/HrTools/AdditionalSalaryRequest/Shared/Helper/getDotColor.test.ts index 135903e2dc..3e4923d986 100644 --- a/src/components/HrTools/AdditionalSalaryRequest/Shared/Helper/getDotColor.test.ts +++ b/src/components/HrTools/AdditionalSalaryRequest/Shared/Helper/getDotColor.test.ts @@ -43,15 +43,18 @@ describe('getDotColor', () => { }); describe('complete step', () => { - it('returns success.main when status is ApprovedNotPaid or ApprovedAndPaid', () => { - expect( - getDotColor(AsrStatusEnum.ApprovedNotPaid, 'complete', false, true), - ).toBe('success.main'); + it('returns success.main when status is ApprovedAndPaid', () => { expect( getDotColor(AsrStatusEnum.ApprovedAndPaid, 'complete', false, true), ).toBe('success.main'); }); + it('returns warning.main when status is ApprovedNotPaid', () => { + expect( + getDotColor(AsrStatusEnum.ApprovedNotPaid, 'complete', false, true), + ).toBe('warning.main'); + }); + it('returns warning.main when status is ActionRequired', () => { expect( getDotColor(AsrStatusEnum.ActionRequired, 'complete', false, false), diff --git a/src/components/HrTools/AdditionalSalaryRequest/Shared/Helper/getDotColor.ts b/src/components/HrTools/AdditionalSalaryRequest/Shared/Helper/getDotColor.ts index 5c4a664610..a4859bfa2d 100644 --- a/src/components/HrTools/AdditionalSalaryRequest/Shared/Helper/getDotColor.ts +++ b/src/components/HrTools/AdditionalSalaryRequest/Shared/Helper/getDotColor.ts @@ -15,7 +15,7 @@ export const getDotColor = ( return 'info.main'; case 'processed': - if (isApproved || status === AsrStatusEnum.ActionRequired) { + if (isApproved) { return 'success.main'; } if (isPending) { @@ -23,10 +23,14 @@ export const getDotColor = ( } // fallthrough case 'complete': - if (isApproved) { + if (status === AsrStatusEnum.ApprovedAndPaid) { return 'success.main'; } - if (status === AsrStatusEnum.ActionRequired) { + // Approved but payroll has not paid it yet, so the step is not done + if ( + status === AsrStatusEnum.ApprovedNotPaid || + status === AsrStatusEnum.ActionRequired + ) { return 'warning.main'; } // fallthrough diff --git a/src/components/HrTools/AdditionalSalaryRequest/SharedComponents/CurrentRequest.test.tsx b/src/components/HrTools/AdditionalSalaryRequest/SharedComponents/CurrentRequest.test.tsx index 2b7a1d9662..cfb80cbfee 100644 --- a/src/components/HrTools/AdditionalSalaryRequest/SharedComponents/CurrentRequest.test.tsx +++ b/src/components/HrTools/AdditionalSalaryRequest/SharedComponents/CurrentRequest.test.tsx @@ -180,7 +180,7 @@ describe('CurrentRequest', () => { const { getByText } = render(); - expect(getByText('Request In Process')).toBeInTheDocument(); + expect(getByText('Request in process')).toBeInTheDocument(); }); }); @@ -193,7 +193,7 @@ describe('CurrentRequest', () => { }); }); - it('displays "Request processed on:" for approved requests - approved not paid', () => { + it('displays "Request processed" for approved requests - approved not paid', () => { const approvedRequest: RequestType = { ...mockRequest, status: AsrStatusEnum.ApprovedNotPaid, @@ -202,10 +202,10 @@ describe('CurrentRequest', () => { const { getByText } = render(); - expect(getByText('Request processed on:')).toBeInTheDocument(); + expect(getByText('Request processed')).toBeInTheDocument(); }); - it('displays "Request processed on:" for approved requests - approved and paid', () => { + it('displays "Request complete" for approved requests - approved and paid', () => { const approvedRequest: RequestType = { ...mockRequest, status: AsrStatusEnum.ApprovedAndPaid, @@ -214,21 +214,24 @@ describe('CurrentRequest', () => { const { getByText } = render(); - expect(getByText('Request processed on:')).toBeInTheDocument(); + expect(getByText('Request complete')).toBeInTheDocument(); }); - it('displays "Request Complete" for approved not paid status', () => { + it('displays "Payroll processing" for approved not paid status', () => { const approvedRequest: RequestType = { ...mockRequest, status: AsrStatusEnum.ApprovedNotPaid, }; - const { getByText } = render(); + const { getByText, queryByText } = render( + , + ); - expect(getByText('Request Complete')).toBeInTheDocument(); + expect(getByText('Payroll processing')).toBeInTheDocument(); + expect(queryByText('Request complete')).not.toBeInTheDocument(); }); - it('displays "Request Complete" for approved and paid status', () => { + it('displays "Request complete" for approved and paid status', () => { const approvedRequest: RequestType = { ...mockRequest, status: AsrStatusEnum.ApprovedAndPaid, @@ -236,12 +239,12 @@ describe('CurrentRequest', () => { const { getByText } = render(); - expect(getByText('Request Complete')).toBeInTheDocument(); + expect(getByText('Request complete')).toBeInTheDocument(); }); }); describe('timeline status - ActionRequired', () => { - it('displays "Action Required:" with feedback', () => { + it('displays "Changes requested on:" with feedback', () => { const actionRequiredRequest: RequestType = { ...mockRequest, status: AsrStatusEnum.ActionRequired, @@ -252,13 +255,13 @@ describe('CurrentRequest', () => { , ); - expect(getByText('Action Required:')).toBeInTheDocument(); + expect(getByText('Changes requested on:')).toBeInTheDocument(); expect( getByText('Please provide additional documentation'), ).toBeInTheDocument(); }); - it('displays "Request processed on:" for action required status', () => { + it('displays "Request processed" for action required status', () => { const actionRequiredRequest: RequestType = { ...mockRequest, status: AsrStatusEnum.ActionRequired, @@ -269,7 +272,7 @@ describe('CurrentRequest', () => { , ); - expect(getByText('Request processed on:')).toBeInTheDocument(); + expect(getByText('Request processed')).toBeInTheDocument(); }); }); diff --git a/src/components/HrTools/AdditionalSalaryRequest/SharedComponents/CurrentRequest.tsx b/src/components/HrTools/AdditionalSalaryRequest/SharedComponents/CurrentRequest.tsx index 843eb93183..c829fc31f2 100644 --- a/src/components/HrTools/AdditionalSalaryRequest/SharedComponents/CurrentRequest.tsx +++ b/src/components/HrTools/AdditionalSalaryRequest/SharedComponents/CurrentRequest.tsx @@ -152,17 +152,21 @@ export const CurrentRequest: React.FC = ({ request }) => { - {isApproved || status === AsrStatusEnum.ActionRequired ? ( + {isApproved ? ( + + {t('Request processed')} + + ) : status === AsrStatusEnum.ActionRequired ? ( - {t('Request processed on:')} + {t('Changes requested on:')} {changesRequestedAt && ` ${dateFormat(DateTime.fromISO(changesRequestedAt), locale)}`} ) : ( - {t('Request In Process')} + {t('Request in process')} )} @@ -190,13 +194,17 @@ export const CurrentRequest: React.FC = ({ request }) => { {status === AsrStatusEnum.ActionRequired ? ( <> - {t('Action Required:')}{' '} + {t('Action required:')}{' '} {request?.feedback} + ) : status === AsrStatusEnum.ApprovedNotPaid ? ( + + {t('Payroll processing')} + ) : ( - {t('Request Complete')} + {t('Request complete')} )} From 66d62b3d8b63e9a79aabb2006b452ac361c3f524 Mon Sep 17 00:00:00 2001 From: Tam Vu Date: Thu, 3 Sep 2026 16:09:50 -0400 Subject: [PATCH 2/2] Fixed tests --- .../AdditionalSalaryRequest/Shared/Helper/getDotColor.ts | 2 +- .../SharedComponents/CurrentRequest.test.tsx | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/src/components/HrTools/AdditionalSalaryRequest/Shared/Helper/getDotColor.ts b/src/components/HrTools/AdditionalSalaryRequest/Shared/Helper/getDotColor.ts index a4859bfa2d..89381693b3 100644 --- a/src/components/HrTools/AdditionalSalaryRequest/Shared/Helper/getDotColor.ts +++ b/src/components/HrTools/AdditionalSalaryRequest/Shared/Helper/getDotColor.ts @@ -15,7 +15,7 @@ export const getDotColor = ( return 'info.main'; case 'processed': - if (isApproved) { + if (isApproved || status === AsrStatusEnum.ActionRequired) { return 'success.main'; } if (isPending) { diff --git a/src/components/HrTools/AdditionalSalaryRequest/SharedComponents/CurrentRequest.test.tsx b/src/components/HrTools/AdditionalSalaryRequest/SharedComponents/CurrentRequest.test.tsx index cfb80cbfee..f231f84da3 100644 --- a/src/components/HrTools/AdditionalSalaryRequest/SharedComponents/CurrentRequest.test.tsx +++ b/src/components/HrTools/AdditionalSalaryRequest/SharedComponents/CurrentRequest.test.tsx @@ -261,7 +261,7 @@ describe('CurrentRequest', () => { ).toBeInTheDocument(); }); - it('displays "Request processed" for action required status', () => { + it('displays "Request processed on:" for action required status', () => { const actionRequiredRequest: RequestType = { ...mockRequest, status: AsrStatusEnum.ActionRequired, @@ -272,7 +272,7 @@ describe('CurrentRequest', () => { , ); - expect(getByText('Request processed')).toBeInTheDocument(); + expect(getByText('Action required:')).toBeInTheDocument(); }); });