From 7851bfa96a3cb87aac75a1f96c433d9562a7425f Mon Sep 17 00:00:00 2001 From: Michael Inthavongsay Date: Sun, 9 Jun 2024 19:58:19 +0000 Subject: [PATCH 1/2] Add From-To address label for PPM card on customer side --- migrations/app/migrations_manifest.txt | 2 +- .../PPMSummaryList/PPMSummaryList.jsx | 32 ++++-- .../PPMSummaryList/PPMSummaryList.module.scss | 9 ++ .../PPMSummaryList/PPMSummaryList.test.jsx | 102 +++++++++++++++++- src/pages/MyMove/Home/MoveHome.test.jsx | 64 +++++++++++ src/pages/MyMove/Home/index.test.jsx | 54 +++++++++- src/utils/test/factories/ppmShipment.js | 16 +++ 7 files changed, 268 insertions(+), 11 deletions(-) diff --git a/migrations/app/migrations_manifest.txt b/migrations/app/migrations_manifest.txt index fb2a94600a3..0e3df3c2b78 100644 --- a/migrations/app/migrations_manifest.txt +++ b/migrations/app/migrations_manifest.txt @@ -938,10 +938,10 @@ 20240515164336_ignore_locked_columns_in_moves_table_for_history_log.up.sql 20240516143952_add_pricing_estimate_to_mto_service_items.up.sql 20240516184021_import_pricing_data_ghc.up.sql -20240524214247_add_sit_location_moving_expenses.up.sql 20240521160335_backfill_LOA_FY_TX.up.sql 20240521184834_add_standalone_field_to_service_items.up.sql 20240522124339_add_csr_to_roles.up.sql +20240524214247_add_sit_location_moving_expenses.up.sql 20240530020648_adding_standalone_crate_service_param.up.sql 20240531050324_adding_standalone_crate_cap.up.sql 20240531152430_migrate_data_to_new_ppm_statuses.up.sql diff --git a/src/components/PPMSummaryList/PPMSummaryList.jsx b/src/components/PPMSummaryList/PPMSummaryList.jsx index 9f628d2b262..4ba14e0bcfc 100644 --- a/src/components/PPMSummaryList/PPMSummaryList.jsx +++ b/src/components/PPMSummaryList/PPMSummaryList.jsx @@ -7,10 +7,23 @@ import styles from './PPMSummaryList.module.scss'; import SectionWrapper from 'components/Customer/SectionWrapper'; import { ppmShipmentStatuses } from 'constants/shipments'; import { ShipmentShape } from 'types/shipment'; -import { formatCustomerDate } from 'utils/formatters'; +import { formatCustomerDate, formatAddressShort } from 'utils/formatters'; import AsyncPacketDownloadLink from 'shared/AsyncPacketDownloadLink/AsyncPacketDownloadLink'; import { downloadPPMPaymentPacket } from 'services/internalApi'; +const toFromAddressDisplay = (pickupAddress, destinationAddress) => { + return ( +
+

+ From: + {formatAddressShort(pickupAddress)} + To: + {formatAddressShort(destinationAddress)} +

+
+ ); +}; + const submittedContent = ( <>

After a counselor approves your PPM, you will be able to:

@@ -21,9 +34,10 @@ const submittedContent = ( ); -const approvedContent = (approvedAt) => { +const approvedContent = (approvedAt, pickupAddress, destinationAddress) => { return ( <> + {toFromAddressDisplay(pickupAddress, destinationAddress)}

{`PPM approved: ${formatCustomerDate(approvedAt)}.`}

@@ -37,9 +51,10 @@ const approvedContent = (approvedAt) => { ); }; -const paymentSubmitted = (approvedAt, submittedAt) => { +const paymentSubmitted = (approvedAt, submittedAt, pickupAddress, destinationAddress) => { return ( <> + {toFromAddressDisplay(pickupAddress, destinationAddress)}

{`PPM approved: ${formatCustomerDate(approvedAt)}`}

{`PPM documentation submitted: ${formatCustomerDate(submittedAt)}`}

@@ -54,9 +69,10 @@ const paymentSubmitted = (approvedAt, submittedAt) => { ); }; -const paymentReviewed = (approvedAt, submittedAt, reviewedAt) => { +const paymentReviewed = (approvedAt, submittedAt, reviewedAt, pickupAddress, destinationAddress) => { return ( <> + {toFromAddressDisplay(pickupAddress, destinationAddress)}

{`PPM approved: ${formatCustomerDate(approvedAt)}`}

{`PPM documentation submitted: ${formatCustomerDate(submittedAt)}`}

@@ -74,7 +90,7 @@ const paymentReviewed = (approvedAt, submittedAt, reviewedAt) => { const PPMSummaryStatus = (shipment, orderLabel, onButtonClick, onDownloadError) => { const { - ppmShipment: { status, approvedAt, submittedAt, reviewedAt }, + ppmShipment: { status, approvedAt, submittedAt, reviewedAt, pickupAddress, destinationAddress }, } = shipment; let actionButton; @@ -87,11 +103,11 @@ const PPMSummaryStatus = (shipment, orderLabel, onButtonClick, onDownloadError) break; case ppmShipmentStatuses.WAITING_ON_CUSTOMER: actionButton = ; - content = approvedContent(approvedAt); + content = approvedContent(approvedAt, pickupAddress, destinationAddress); break; case ppmShipmentStatuses.NEEDS_CLOSEOUT: actionButton = ; - content = paymentSubmitted(approvedAt, submittedAt); + content = paymentSubmitted(approvedAt, submittedAt, pickupAddress, destinationAddress); break; case ppmShipmentStatuses.CLOSEOUT_COMPLETE: actionButton = ( @@ -104,7 +120,7 @@ const PPMSummaryStatus = (shipment, orderLabel, onButtonClick, onDownloadError) /> ); - content = paymentReviewed(approvedAt, submittedAt, reviewedAt); + content = paymentReviewed(approvedAt, submittedAt, reviewedAt, pickupAddress, destinationAddress); break; default: } diff --git a/src/components/PPMSummaryList/PPMSummaryList.module.scss b/src/components/PPMSummaryList/PPMSummaryList.module.scss index 2af4e8df892..571f9e841db 100644 --- a/src/components/PPMSummaryList/PPMSummaryList.module.scss +++ b/src/components/PPMSummaryList/PPMSummaryList.module.scss @@ -36,6 +36,15 @@ @include u-margin-bottom(2); } + .addressDisplay { + @include u-margin-top(2); + @include u-margin-bottom(2); + } + + .bold { + font-weight: bold; + } + &:last-of-type { @include u-margin-bottom(0); } diff --git a/src/components/PPMSummaryList/PPMSummaryList.test.jsx b/src/components/PPMSummaryList/PPMSummaryList.test.jsx index 260e1f5b663..8511160ce98 100644 --- a/src/components/PPMSummaryList/PPMSummaryList.test.jsx +++ b/src/components/PPMSummaryList/PPMSummaryList.test.jsx @@ -26,6 +26,22 @@ const shipments = [ status: ppmShipmentStatuses.SUBMITTED, hasRequestedAdvance: true, advanceAmountRequested: 10000, + pickupAddress: { + streetAddress1: '1 Test Street', + streetAddress2: '2 Test Street', + streetAddress3: '3 Test Street', + city: 'Pickup Test City', + state: 'NY', + postalCode: '10001', + }, + destinationAddress: { + streetAddress1: '1 Test Street', + streetAddress2: '2 Test Street', + streetAddress3: '3 Test Street', + city: 'Destination Test City', + state: 'NY', + postalCode: '11111', + }, }, }, { @@ -37,6 +53,22 @@ const shipments = [ approvedAt: '2022-04-15T15:38:07.103Z', hasRequestedAdvance: true, advanceAmountRequested: 10000, + pickupAddress: { + streetAddress1: '1 Test Street', + streetAddress2: '2 Test Street', + streetAddress3: '3 Test Street', + city: 'Pickup Test City', + state: 'NY', + postalCode: '10001', + }, + destinationAddress: { + streetAddress1: '1 Test Street', + streetAddress2: '2 Test Street', + streetAddress3: '3 Test Street', + city: 'Destination Test City', + state: 'NY', + postalCode: '11111', + }, }, }, { @@ -49,6 +81,22 @@ const shipments = [ submittedAt: '2022-04-19T15:38:07.103Z', hasRequestedAdvance: true, advanceAmountRequested: 10000, + pickupAddress: { + streetAddress1: '1 Test Street', + streetAddress2: '2 Test Street', + streetAddress3: '3 Test Street', + city: 'Pickup Test City', + state: 'NY', + postalCode: '10001', + }, + destinationAddress: { + streetAddress1: '1 Test Street', + streetAddress2: '2 Test Street', + streetAddress3: '3 Test Street', + city: 'Destination Test City', + state: 'NY', + postalCode: '11111', + }, }, }, { @@ -62,6 +110,22 @@ const shipments = [ reviewedAt: '2022-04-23T15:38:07.103Z', hasRequestedAdvance: true, advanceAmountRequested: 10000, + pickupAddress: { + streetAddress1: '1 Test Street', + streetAddress2: '2 Test Street', + streetAddress3: '3 Test Street', + city: 'Pickup Test City', + state: 'NY', + postalCode: '10001', + }, + destinationAddress: { + streetAddress1: '1 Test Street', + streetAddress2: '2 Test Street', + streetAddress3: '3 Test Street', + city: 'Destination Test City', + state: 'NY', + postalCode: '11111', + }, }, }, ]; @@ -89,10 +153,16 @@ describe('PPMSummaryList component', () => { await userEvent.click(uploadButton); expect(onUploadClick).toHaveBeenCalledWith(props.shipments[0].id); // called with mtoShipmentId expect(onUploadClick).toHaveBeenCalledTimes(1); + expect(screen.getByText(/From:/, { selector: 'span' })).toBeInTheDocument(); + expect(screen.getByText(/Pickup Test City, NY 10001/, { selector: 'p' })).toBeInTheDocument(); + expect(screen.getByText(/To:/, { selector: 'span' })).toBeInTheDocument(); + expect(screen.getByText(/Destination Test City, NY 11111/, { selector: 'p' })).toBeInTheDocument(); }); it('should contain approved date', () => { render(); expect(screen.queryByText(`PPM approved: 15 Apr 2022.`)).toBeInTheDocument(); + + expect(screen.queryByText(`PPM`)).toBeInTheDocument(); }); }); @@ -101,6 +171,11 @@ describe('PPMSummaryList component', () => { render(); expect(screen.getByRole('button', { name: 'Download Payment Packet' })).toBeDisabled(); + expect(screen.getByText(/From:/, { selector: 'span' })).toBeInTheDocument(); + expect(screen.getByText(/Pickup Test City, NY 10001/, { selector: 'p' })).toBeInTheDocument(); + expect(screen.getByText(/To:/, { selector: 'span' })).toBeInTheDocument(); + expect(screen.getByText(/Destination Test City, NY 11111/, { selector: 'p' })).toBeInTheDocument(); + expect(screen.queryByText(`PPM approved: 15 Apr 2022`)).toBeInTheDocument(); expect(screen.queryByText(`PPM documentation submitted: 19 Apr 2022`)).toBeInTheDocument(); @@ -121,6 +196,11 @@ describe('PPMSummaryList component', () => { expect(screen.queryByText(`PPM documentation submitted: 19 Apr 2022`)).toBeInTheDocument(); expect(screen.queryByText(`Documentation accepted and verified: 23 Apr 2022`)).toBeInTheDocument(); + expect(screen.getByText(/From:/, { selector: 'span' })).toBeInTheDocument(); + expect(screen.getByText(/Pickup Test City, NY 10001/, { selector: 'p' })).toBeInTheDocument(); + expect(screen.getByText(/To:/, { selector: 'span' })).toBeInTheDocument(); + expect(screen.getByText(/Destination Test City, NY 11111/, { selector: 'p' })).toBeInTheDocument(); + expect( screen.queryByText( 'You can now download your incentive packet and submit it to Finance to request payment. You will also need to include a completed DD-1351-2, and any other paperwork required by your service.', @@ -178,7 +258,27 @@ describe('PPMSummaryList component', () => { response: { body: { title: 'Error title', detail: 'Error detail' } }, }); - const shipment = { ppmShipment: { status: ppmShipmentStatuses.CLOSEOUT_COMPLETE } }; + const shipment = { + ppmShipment: { + status: ppmShipmentStatuses.CLOSEOUT_COMPLETE, + pickupAddress: { + streetAddress1: '1 Test Street', + streetAddress2: '2 Test Street', + streetAddress3: '3 Test Street', + city: 'Pickup Test City', + state: 'NY', + postalCode: '10001', + }, + destinationAddress: { + streetAddress1: '1 Test Street', + streetAddress2: '2 Test Street', + streetAddress3: '3 Test Street', + city: 'Destination Test City', + state: 'NY', + postalCode: '11111', + }, + }, + }; const onErrorHandler = jest.fn(); render( diff --git a/src/pages/MyMove/Home/MoveHome.test.jsx b/src/pages/MyMove/Home/MoveHome.test.jsx index 2db4cfac836..566c968707a 100644 --- a/src/pages/MyMove/Home/MoveHome.test.jsx +++ b/src/pages/MyMove/Home/MoveHome.test.jsx @@ -290,6 +290,22 @@ const defaultPropsOrdersWithUnsubmittedShipments = { submittedAt: null, updatedAt: '2024-02-20T17:22:03.085Z', weightTickets: [], + pickupAddress: { + streetAddress1: '1 Test Street', + streetAddress2: '2 Test Street', + streetAddress3: '3 Test Street', + city: 'Pickup Test City', + state: 'NY', + postalCode: '10001', + }, + destinationAddress: { + streetAddress1: '1 Test Street', + streetAddress2: '2 Test Street', + streetAddress3: '3 Test Street', + city: 'Destination Test City', + state: 'NY', + postalCode: '11111', + }, }, shipmentType: 'PPM', status: 'DRAFT', @@ -493,6 +509,22 @@ const defaultPropsOrdersWithSubmittedShipments = { submittedAt: null, updatedAt: '2024-02-20T17:22:03.085Z', weightTickets: [], + pickupAddress: { + streetAddress1: '1 Test Street', + streetAddress2: '2 Test Street', + streetAddress3: '3 Test Street', + city: 'Pickup Test City', + state: 'NY', + postalCode: '10001', + }, + destinationAddress: { + streetAddress1: '1 Test Street', + streetAddress2: '2 Test Street', + streetAddress3: '3 Test Street', + city: 'Destination Test City', + state: 'NY', + postalCode: '11111', + }, }, shipmentType: 'PPM', status: 'DRAFT', @@ -666,6 +698,22 @@ const defaultPropsAmendedOrdersWithAdvanceRequested = { submittedAt: null, updatedAt: '2024-02-20T17:40:47.772Z', weightTickets: [], + pickupAddress: { + streetAddress1: '1 Test Street', + streetAddress2: '2 Test Street', + streetAddress3: '3 Test Street', + city: 'Pickup Test City', + state: 'NY', + postalCode: '10001', + }, + destinationAddress: { + streetAddress1: '1 Test Street', + streetAddress2: '2 Test Street', + streetAddress3: '3 Test Street', + city: 'Destination Test City', + state: 'NY', + postalCode: '11111', + }, }, shipmentType: 'PPM', status: 'SUBMITTED', @@ -858,6 +906,22 @@ const defaultPropsWithAdvanceAndPPMApproved = { submittedAt: null, updatedAt: '2024-02-20T18:01:14.760Z', weightTickets: [], + pickupAddress: { + streetAddress1: '1 Test Street', + streetAddress2: '2 Test Street', + streetAddress3: '3 Test Street', + city: 'Pickup Test City', + state: 'NY', + postalCode: '10001', + }, + destinationAddress: { + streetAddress1: '1 Test Street', + streetAddress2: '2 Test Street', + streetAddress3: '3 Test Street', + city: 'Destination Test City', + state: 'NY', + postalCode: '11111', + }, }, shipmentType: 'PPM', status: 'APPROVED', diff --git a/src/pages/MyMove/Home/index.test.jsx b/src/pages/MyMove/Home/index.test.jsx index e4949e9cafc..e4d3b9deac0 100644 --- a/src/pages/MyMove/Home/index.test.jsx +++ b/src/pages/MyMove/Home/index.test.jsx @@ -106,6 +106,22 @@ const incompletePPMShipment = { createdAt: ppmShipmentCreatedDate.toISOString(), updatedAt: ppmShipmentCreatedDate.toISOString(), eTag: window.btoa(ppmShipmentCreatedDate.toISOString()), + pickupAddress: { + streetAddress1: '1 Test Street', + streetAddress2: '2 Test Street', + streetAddress3: '3 Test Street', + city: 'Pickup Test City', + state: 'NY', + postalCode: '10001', + }, + destinationAddress: { + streetAddress1: '1 Test Street', + streetAddress2: '2 Test Street', + streetAddress3: '3 Test Street', + city: 'Destination Test City', + state: 'NY', + postalCode: '11111', + }, }, createdAt: mtoShipmentCreatedDate.toISOString(), updatedAt: mtoShipmentCreatedDate.toISOString(), @@ -154,6 +170,22 @@ const approvedPPMShipment = { approvedAt: approvedDate.toISOString(), updatedAt: approvedDate.toISOString(), eTag: window.btoa(approvedDate.toISOString()), + pickupAddress: { + streetAddress1: '1 Test Street', + streetAddress2: '2 Test Street', + streetAddress3: '3 Test Street', + city: 'Pickup Test City', + state: 'NY', + postalCode: '10001', + }, + destinationAddress: { + streetAddress1: '1 Test Street', + streetAddress2: '2 Test Street', + streetAddress3: '3 Test Street', + city: 'Destination Test City', + state: 'NY', + postalCode: '11111', + }, }, updatedAt: approvedDate.toISOString(), eTag: window.btoa(approvedDate.toISOString()), @@ -962,7 +994,27 @@ describe('Home component', () => { const propsForCloseoutCompleteShipment = { ...props, mtoShipments: [ - createPPMShipmentWithFinalIncentive({ ppmShipment: { status: ppmShipmentStatuses.NEEDS_CLOSEOUT } }), + createPPMShipmentWithFinalIncentive({ + ppmShipment: { + status: ppmShipmentStatuses.NEEDS_CLOSEOUT, + pickupAddress: { + streetAddress1: '1 Test Street', + streetAddress2: '2 Test Street', + streetAddress3: '3 Test Street', + city: 'Pickup Test City', + state: 'NY', + postalCode: '10001', + }, + destinationAddress: { + streetAddress1: '1 Test Street', + streetAddress2: '2 Test Street', + streetAddress3: '3 Test Street', + city: 'Destination Test City', + state: 'NY', + postalCode: '11111', + }, + }, + }), ], }; diff --git a/src/utils/test/factories/ppmShipment.js b/src/utils/test/factories/ppmShipment.js index 038e7df486d..37b2d3e357e 100644 --- a/src/utils/test/factories/ppmShipment.js +++ b/src/utils/test/factories/ppmShipment.js @@ -94,6 +94,22 @@ const createSubmittedPPMShipment = (fieldOverrides = {}) => { { ppmShipment: { status: ppmShipmentStatuses.SUBMITTED, + pickupAddress: { + streetAddress1: '1 Test Street', + streetAddress2: '2 Test Street', + streetAddress3: '3 Test Street', + city: 'Pickup Test City', + state: 'NY', + postalCode: '10001', + }, + destinationAddress: { + streetAddress1: '1 Test Street', + streetAddress2: '2 Test Street', + streetAddress3: '3 Test Street', + city: 'Destination Test City', + state: 'NY', + postalCode: '11111', + }, }, }, fieldOverrides, From 1b5c6382a847f05206d4ad859e557c858cd0b782 Mon Sep 17 00:00:00 2001 From: Michael Inthavongsay Date: Tue, 11 Jun 2024 16:07:55 +0000 Subject: [PATCH 2/2] fix failing Happo test for PPMShipmentList --- .../PPMSummaryList/PPMSummaryList.stories.jsx | 96 +++++++++++++++++++ 1 file changed, 96 insertions(+) diff --git a/src/components/PPMSummaryList/PPMSummaryList.stories.jsx b/src/components/PPMSummaryList/PPMSummaryList.stories.jsx index b411d48f2f6..801c7c8f116 100644 --- a/src/components/PPMSummaryList/PPMSummaryList.stories.jsx +++ b/src/components/PPMSummaryList/PPMSummaryList.stories.jsx @@ -25,6 +25,22 @@ Submitted.args = { status: ppmShipmentStatuses.SUBMITTED, hasRequestedAdvance: true, advanceAmountRequested: 10000, + pickupAddress: { + streetAddress1: '1 Test Street', + streetAddress2: '2 Test Street', + streetAddress3: '3 Test Street', + city: 'Pickup Test City', + state: 'NY', + postalCode: '10001', + }, + destinationAddress: { + streetAddress1: '1 Test Street', + streetAddress2: '2 Test Street', + streetAddress3: '3 Test Street', + city: 'Destination Test City', + state: 'NY', + postalCode: '11111', + }, }, }, ], @@ -42,6 +58,22 @@ Approved.args = { approvedAt: '2022-04-15T15:38:07.103Z', hasRequestedAdvance: true, advanceAmountRequested: 10000, + pickupAddress: { + streetAddress1: '1 Test Street', + streetAddress2: '2 Test Street', + streetAddress3: '3 Test Street', + city: 'Pickup Test City', + state: 'NY', + postalCode: '10001', + }, + destinationAddress: { + streetAddress1: '1 Test Street', + streetAddress2: '2 Test Street', + streetAddress3: '3 Test Street', + city: 'Destination Test City', + state: 'NY', + postalCode: '11111', + }, }, }, ], @@ -59,6 +91,22 @@ ApprovedMultiple.args = { approvedAt: '2022-04-15T15:38:07.103Z', hasRequestedAdvance: true, advanceAmountRequested: 10000, + pickupAddress: { + streetAddress1: '1 Test Street', + streetAddress2: '2 Test Street', + streetAddress3: '3 Test Street', + city: 'Pickup Test City', + state: 'NY', + postalCode: '10001', + }, + destinationAddress: { + streetAddress1: '1 Test Street', + streetAddress2: '2 Test Street', + streetAddress3: '3 Test Street', + city: 'Destination Test City', + state: 'NY', + postalCode: '11111', + }, }, }, { @@ -70,6 +118,22 @@ ApprovedMultiple.args = { approvedAt: '2022-04-20T15:38:07.103Z', hasRequestedAdvance: true, advanceAmountRequested: 10000, + pickupAddress: { + streetAddress1: '1 Test Street', + streetAddress2: '2 Test Street', + streetAddress3: '3 Test Street', + city: 'Pickup Test City', + state: 'NY', + postalCode: '10001', + }, + destinationAddress: { + streetAddress1: '1 Test Street', + streetAddress2: '2 Test Street', + streetAddress3: '3 Test Street', + city: 'Destination Test City', + state: 'NY', + postalCode: '11111', + }, }, }, ], @@ -88,6 +152,22 @@ PaymentSubmitted.args = { submittedAt: '2022-04-19T15:38:07.103Z', hasRequestedAdvance: true, advanceAmountRequested: 10000, + pickupAddress: { + streetAddress1: '1 Test Street', + streetAddress2: '2 Test Street', + streetAddress3: '3 Test Street', + city: 'Pickup Test City', + state: 'NY', + postalCode: '10001', + }, + destinationAddress: { + streetAddress1: '1 Test Street', + streetAddress2: '2 Test Street', + streetAddress3: '3 Test Street', + city: 'Destination Test City', + state: 'NY', + postalCode: '11111', + }, }, }, ], @@ -107,6 +187,22 @@ PaymentReviewed.args = { reviewedAt: '2022-04-23T15:38:07.103Z', hasRequestedAdvance: true, advanceAmountRequested: 10000, + pickupAddress: { + streetAddress1: '1 Test Street', + streetAddress2: '2 Test Street', + streetAddress3: '3 Test Street', + city: 'Pickup Test City', + state: 'NY', + postalCode: '10001', + }, + destinationAddress: { + streetAddress1: '1 Test Street', + streetAddress2: '2 Test Street', + streetAddress3: '3 Test Street', + city: 'Destination Test City', + state: 'NY', + postalCode: '11111', + }, }, }, ],