Skip to content

Commit

Permalink
Merge pull request #965 from CruGlobal/confirm-buttons-on-fix-mailing…
Browse files Browse the repository at this point in the history 
…-addressess

Fix Mailing Address - Confirm buttons
  • Loading branch information
@dr-bizz
dr-bizz authored Jun 28, 2024
2 parents ea1fb47 + f4ed663 commit bdb139d
Show file tree
Hide file tree
Showing 4 changed files with 395 additions and 3 deletions.
19 changes: 16 additions & 3 deletions src/components/Tool/FixMailingAddresses/Contact.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -38,11 +38,10 @@ import { useUpdateCache } from 'src/hooks/useUpdateCache';
import { dateFormatShort } from 'src/lib/intlFormat';
import { contactPartnershipStatus } from 'src/utils/contacts/contactPartnershipStatus';
import theme from '../../../theme';
import { emptyAddress } from './FixMailingAddresses';
import { HandleSingleConfirmProps, emptyAddress } from './FixMailingAddresses';
import { ContactAddressFragment } from './GetInvalidAddresses.generated';

const ContactHeader = styled(CardHeader)(() => ({
cursor: 'pointer',
'.MuiCardHeader-action': {
alignSelf: 'center',
},
Expand Down Expand Up @@ -117,6 +116,11 @@ interface Props {
openEditAddressModal: (address: ContactAddressFragment, id: string) => void;
openNewAddressModal: (address: ContactAddressFragment, id: string) => void;
setContactFocus: SetContactFocus;
handleSingleConfirm: ({
addresses,
id,
name,
}: HandleSingleConfirmProps) => void;
}

const Contact: React.FC<Props> = ({
Expand All @@ -128,6 +132,7 @@ const Contact: React.FC<Props> = ({
openEditAddressModal,
openNewAddressModal,
setContactFocus,
handleSingleConfirm,
}) => {
const { t } = useTranslation();
const locale = useLocale();
Expand Down Expand Up @@ -161,6 +166,10 @@ const Contact: React.FC<Props> = ({
});
};

const handleConfirm = () => {
handleSingleConfirm({ addresses, id, name });
};

const handleContactNameClick = () => {
setContactFocus(id);
};
Expand All @@ -176,7 +185,11 @@ const Contact: React.FC<Props> = ({
/>
}
action={
<Button variant="contained" className={classes.confirmButon}>
<Button
variant="contained"
className={classes.confirmButon}
onClick={handleConfirm}
>
<Icon path={mdiCheckboxMarkedCircle} size={0.8} />
{t('Confirm')}
</Button>
Expand Down
226 changes: 226 additions & 0 deletions src/components/Tool/FixMailingAddresses/FixMailingAddresses.test.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -427,4 +427,230 @@ describe('FixSendNewsletter', () => {
expect(setContactFocus).toHaveBeenCalledWith(contactId);
});
});

describe('handleSingleConfirm()', () => {
const name = 'Baggins, Frodo';
it('should handle error', async () => {
const { getAllByRole, getByText, queryByTestId } = render(
<Components
mocks={{
InvalidAddresses: {
...mockInvalidAddressesResponse.InvalidAddresses,
},
UpdateContactAddress: () => {
throw new Error('Server Error');
},
}}
/>,
);
await waitFor(() =>
expect(queryByTestId('loading')).not.toBeInTheDocument(),
);
userEvent.click(getAllByRole('button', { name: 'Confirm' })[0]);

await waitFor(() => expect(getByText(name)).toBeInTheDocument());

await waitFor(() => {
expect(mockEnqueue).toHaveBeenCalledWith(
`Error updating contact ${name}`,
{
variant: 'error',
autoHideDuration: 7000,
},
);
});
expect(getByText(name)).toBeInTheDocument();
});

it('should handle success and remove contact', async () => {
const { getAllByRole, getByText, queryByTestId, queryByText } = render(
<Components
mocks={{
InvalidAddresses: {
...mockInvalidAddressesResponse.InvalidAddresses,
},
}}
/>,
);
await waitFor(() =>
expect(queryByTestId('loading')).not.toBeInTheDocument(),
);
userEvent.click(getAllByRole('button', { name: 'Confirm' })[0]);

await waitFor(() => expect(getByText(name)).toBeInTheDocument());

await waitFor(() => {
expect(mockEnqueue).toHaveBeenCalledWith(`Updated contact ${name}`, {
variant: 'success',
});
expect(queryByText(name)).not.toBeInTheDocument();
});
});
});

describe('handleBulkConfirm()', () => {
const name1 = 'Baggins, Frodo';
const name2 = 'Gamgee, Samwise';

it('should handle Error', async () => {
process.env.APP_NAME = 'MPDX';
const { getByRole, getByText, queryByTestId } = render(
<Components
mocks={{
InvalidAddresses: {
contacts: {
nodes: [
{
id: 'contactId',
name: name1,
status: null,
addresses: {
nodes: [mpdxSourcedAddress, tntSourcedAddress],
},
},
{
id: 'contactId2',
name: name2,
status: null,
addresses: {
nodes: [mpdxSourcedAddress, tntSourcedAddress],
},
},
],
},
},
UpdateContactAddress: () => {
throw new Error('Server Error');
},
}}
/>,
);
await waitFor(() =>
expect(queryByTestId('loading')).not.toBeInTheDocument(),
);

expect(getByText(name1)).toBeInTheDocument();
expect(getByText(name2)).toBeInTheDocument();

userEvent.click(getByRole('button', { name: 'Confirm 2 as MPDX' }));

await waitFor(() =>
expect(getByRole('heading', { name: 'Confirm' })).toBeInTheDocument(),
);

userEvent.click(getByRole('button', { name: 'Yes' }));

await waitFor(() => {
expect(mockEnqueue).toHaveBeenCalledWith(
`Error updating contact ${name1}`,
{
variant: 'error',
autoHideDuration: 7000,
},
);
expect(mockEnqueue).toHaveBeenCalledWith(
`Error updating contact ${name2}`,
{
variant: 'error',
autoHideDuration: 7000,
},
);
expect(mockEnqueue).toHaveBeenCalledWith(
`Error when updating 2 contact(s)`,
{
variant: 'error',
},
);

expect(getByText(name1)).toBeInTheDocument();
expect(getByText(name2)).toBeInTheDocument();
});
});

it('should handle success and remove contacts', async () => {
process.env.APP_NAME = 'MPDX';
const { getByRole, queryByTestId, queryByText } = render(
<Components
mocks={{
InvalidAddresses: {
contacts: {
nodes: [
{
id: 'contactId',
name: name1,
status: null,
addresses: {
nodes: [mpdxSourcedAddress, tntSourcedAddress],
},
},
{
id: 'contactId2',
name: name2,
status: null,
addresses: {
nodes: [mpdxSourcedAddress, tntSourcedAddress],
},
},
],
},
},
}}
/>,
);
await waitFor(() =>
expect(queryByTestId('loading')).not.toBeInTheDocument(),
);
userEvent.click(getByRole('button', { name: 'Confirm 2 as MPDX' }));

await waitFor(() =>
expect(getByRole('heading', { name: 'Confirm' })).toBeInTheDocument(),
);

userEvent.click(getByRole('button', { name: 'Yes' }));

await waitFor(() => {
expect(mockEnqueue).toHaveBeenCalledWith(`Updated contact ${name1}`, {
variant: 'success',
});
expect(mockEnqueue).toHaveBeenCalledWith(`Updated contact ${name2}`, {
variant: 'success',
});

expect(queryByText(name1)).not.toBeInTheDocument();
expect(queryByText(name2)).not.toBeInTheDocument();
});
});
});

it('should not fire handleSingleConfirm', async () => {
process.env.APP_NAME = 'MPDX';
const { getByRole, queryByTestId, queryByText } = render(
<Components
mocks={{
InvalidAddresses: {
...mockInvalidAddressesResponse.InvalidAddresses,
},
}}
/>,
);
await waitFor(() =>
expect(queryByTestId('loading')).not.toBeInTheDocument(),
);
const name = 'Baggins, Frodo';
userEvent.click(getByRole('combobox'));
userEvent.click(getByRole('option', { name: 'DataServer' }));

userEvent.click(getByRole('button', { name: 'Confirm 1 as DataServer' }));

await waitFor(() =>
expect(getByRole('heading', { name: 'Confirm' })).toBeInTheDocument(),
);

userEvent.click(getByRole('button', { name: 'No' }));

await waitFor(() => {
expect(mockEnqueue).not.toHaveBeenCalled();
expect(queryByText(name)).toBeInTheDocument();
});
});
});
Loading

0 comments on commit bdb139d

Please sign in to comment.