Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

B 21544 prime successful update message main #14632

Draft
wants to merge 10 commits into
base: main
Choose a base branch
from
+43 −6
Draft

B 21544 prime successful update message main #14632

Show file tree
Hide file tree
Changes from 8 commits
Commits
Show all changes
10 commits
Select commit Hold shift + click to select a range
a002ddd
trying mount retun. working on catching undefined then or return promise
KonstanceH Jan 10, 2025
dfb662a
add in setflashmessage connect
KonstanceH Jan 14, 2025
78f694d
change address form back to original
KonstanceH Jan 14, 2025
0a655c8
Merge branch 'main' into B-21544-Prime-Successful-Update-Message-MAIN
KonstanceH Jan 14, 2025
279f38f
Merge branch 'main' into B-21544-Prime-Successful-Update-Message-MAIN
KonstanceH Jan 15, 2025
1c02ef9
trying to get test working lol
KonstanceH Jan 21, 2025
bdb0392
Merge branch 'main' into B-21544-Prime-Successful-Update-Message-MAIN
KonstanceH Jan 21, 2025
1ea8502
pausing for lunch
KonstanceH Jan 22, 2025
0270705
added tests from comments and modified path assert
KonstanceH Jan 22, 2025
9b5ed98
Merge branch 'main' into B-21544-Prime-Successful-Update-Message-MAIN
KonstanceH Jan 22, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
21 changes: 17 additions & 4 deletions src/pages/PrimeUI/Shipment/PrimeUIShipmentUpdateDestinationAddress.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,8 @@ import { useNavigate, useParams, generatePath } from 'react-router-dom';
import { useMutation } from '@tanstack/react-query';
import { Alert, Grid, GridContainer } from '@trussworks/react-uswds';
import * as Yup from 'yup';
import { connect } from 'react-redux';
import { func } from 'prop-types';

import PrimeUIShipmentUpdateDestinationAddressForm from './PrimeUIShipmentUpdateDestinationAddressForm';

Expand All @@ -17,7 +19,7 @@ import { updateShipmentDestinationAddress } from 'services/primeApi';
import primeStyles from 'pages/PrimeUI/Prime.module.scss';
import { isEmpty } from 'shared/utils';
import { fromPrimeAPIAddressFormat } from 'utils/formatters';
import { setFlashMessage } from 'store/flash/actions';
import { setFlashMessage as setFlashMessageAction } from 'store/flash/actions';

const updateDestinationAddressSchema = Yup.object().shape({
mtoShipmentID: Yup.string(),
Expand All @@ -28,7 +30,7 @@ const updateDestinationAddressSchema = Yup.object().shape({
eTag: Yup.string(),
});

const PrimeUIShipmentUpdateDestinationAddress = () => {
const PrimeUIShipmentUpdateDestinationAddress = ({ setFlashMessage }) => {
const [errorMessage, setErrorMessage] = useState();
const { moveCodeOrID, shipmentId } = useParams();
const { moveTaskOrder, isLoading, isError } = usePrimeSimulatorGetMove(moveCodeOrID);
Expand All @@ -40,7 +42,6 @@ const PrimeUIShipmentUpdateDestinationAddress = () => {
navigate(generatePath(primeSimulatorRoutes.VIEW_MOVE_PATH, { moveCodeOrID }));
};

/* istanbul ignore next */
const { mutate: updateShipmentDestinationAddressAPI } = useMutation(updateShipmentDestinationAddress, {
onSuccess: (updatedMTOShipment) => {
mtoShipments[mtoShipments.findIndex((mtoShipment) => mtoShipment.id === updatedMTOShipment.id)] =
Expand Down Expand Up @@ -146,4 +147,16 @@ const PrimeUIShipmentUpdateDestinationAddress = () => {
);
};

export default PrimeUIShipmentUpdateDestinationAddress;
PrimeUIShipmentUpdateDestinationAddress.propTypes = {
setFlashMessage: func,
};

PrimeUIShipmentUpdateDestinationAddress.defaultProps = {
setFlashMessage: () => {},
};

const mapDispatchToProps = {
setFlashMessage: setFlashMessageAction,
};

export default connect(() => ({}), mapDispatchToProps)(PrimeUIShipmentUpdateDestinationAddress);
48 changes: 47 additions & 1 deletion src/pages/PrimeUI/Shipment/PrimeUIShipmentUpdateDestinationAddress.test.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,12 +1,14 @@
import React from 'react';
import { act, render, screen, waitFor } from '@testing-library/react';
import userEvent from '@testing-library/user-event';
import { generatePath } from 'react-router-dom';

import { usePrimeSimulatorGetMove } from '../../../hooks/queries';
import { updateShipmentDestinationAddress } from '../../../services/primeApi';

import PrimeUIShipmentUpdateDestinationAddress from './PrimeUIShipmentUpdateDestinationAddress';

// import { setFlashMessage } from 'store/flash/actions';
import { ReactQueryWrapper, MockProviders } from 'testUtils';
import { primeSimulatorRoutes } from 'constants/routes';

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Add this mock for the flashmessage:

const mockSetFlashMessage = jest.fn();

jest.mock('react-redux', () => ({
  ...jest.requireActual('react-redux'),
  connect: jest.fn(() => (component) => (props) => component({ ...props, setFlashMessage: mockSetFlashMessage })),
}));

Expand Down Expand Up @@ -97,6 +99,17 @@ const testShipmentReturnValue = {
isError: false,
};

// const mockedComponent = (
// <MockProviders path={primeSimulatorRoutes.SHIPMENT_UPDATE_DESTINATION_ADDRESS_PATH} params={routingParams}>
// <PrimeUIShipmentUpdateDestinationAddress setFlashMessage={jest.fn()} />
// </MockProviders>
// );

const movePath = generatePath(primeSimulatorRoutes.VIEW_MOVE_PATH, {
moveCodeOrID: 'LN4T89',
setFlashMessage: jest.fn(),
});

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

don't need these I don't think

const renderComponent = () => {
render(
<ReactQueryWrapper>
Expand All @@ -107,7 +120,11 @@ const renderComponent = () => {
);
};

describe('PrimeUIShipmentUpdateAddress page', () => {
beforeEach(() => {
jest.resetAllMocks();
});

describe('PrimeUIShipmentUpdateDestinationAddress page', () => {
describe('check loading and error component states', () => {
const loadingReturnValue = {
moveTaskOrder: undefined,
Expand Down Expand Up @@ -218,6 +235,35 @@ describe('PrimeUIShipmentUpdateAddress page', () => {
expect(mockNavigate).toHaveBeenCalledWith('/simulator/moves/LN4T89/details');
});
});

it('routes to the review page when the user clicks save', async () => {
usePrimeSimulatorGetMove.mockReturnValue(moveReturnValue);
updateShipmentDestinationAddress.mockReturnValue({
id: 'c56a4180-65aa-42ec-a945-5fd21dec0538',
streetAddress1: '444 Main Ave',
streetAddress2: 'Apartment 9000',
streetAddress3: '',
city: 'Anytown',
state: 'AL',
postalCode: '90210',
country: 'USA',
eTag: '1234567890',
setFlashMessage: jest.fn(),
});
renderComponent();

const addressChange = screen.getByLabelText('Address 1');
const contractorRemarks = screen.getByLabelText('Contractor Remarks');
await act(() => userEvent.type(addressChange, 'Address Tester'));
await act(() => userEvent.type(contractorRemarks, 'testing contractor remarks'));

const saveButton = await screen.findByRole('button', { name: 'Save' });
await act(() => userEvent.click(saveButton));

await waitFor(() => {
expect(mockNavigate).toHaveBeenCalledWith(movePath);
});
});
Copy link
Contributor

@taeJungCaci taeJungCaci Jan 22, 2025 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think test above your added test is already checking this - line where it starts with describe('successful submission of form', () => {.

Your should just be able to add this test:

expect(mockSetFlashMessage).toHaveBeenCalledTimes(1);

with

await waitFor(() => {
        expect(mockNavigate).toHaveBeenCalledWith('/simulator/moves/LN4T89/details');
      });

Copy link
Contributor

@taeJungCaci taeJungCaci Jan 22, 2025 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You can also use .toHaveBeenCalledWith() if you want to check details

});

describe('error alert display', () => {
Expand Down
Loading