diff --git a/src/components/Tool/FixSendNewsletter/Contact.test.tsx b/src/components/Tool/FixSendNewsletter/Contact.test.tsx new file mode 100644 index 000000000..17ac3c4f2 --- /dev/null +++ b/src/components/Tool/FixSendNewsletter/Contact.test.tsx @@ -0,0 +1,135 @@ +import { ThemeProvider } from '@mui/material/styles'; +import { render } from '@testing-library/react'; +import theme from 'src/theme'; +import Contact from './Contact'; +import { + ContactPrimaryAddressFragment, + ContactPrimaryPersonFragment, +} from './GetInvalidNewsletter.generated'; + +const TestComponent = ({ + primaryPerson, + primaryAddress, +}: { + primaryPerson: ContactPrimaryPersonFragment; + primaryAddress: ContactPrimaryAddressFragment; +}) => ( + + + +); + +describe('Fix Newsletter - Contact', () => { + describe('inital value for dropdown', () => { + let primaryPerson = {} as ContactPrimaryPersonFragment; + let primaryAddress = {} as ContactPrimaryAddressFragment; + + beforeEach(() => { + primaryPerson = { + firstName: '', + lastName: '', + primaryEmailAddress: { + email: '', + }, + optoutEnewsletter: false, + } as ContactPrimaryPersonFragment; + + primaryAddress = { + street: '', + city: '', + state: '', + postalCode: '', + source: '', + createdAt: '', + } as ContactPrimaryAddressFragment; + }); + + it('should be None', () => { + const { getByRole } = render( + , + ); + + expect(getByRole('combobox')).toHaveDisplayValue(['None']); + }); + + it('should be Physical', () => { + primaryAddress.street = '100 Test St'; + + const { getByRole } = render( + , + ); + + expect(getByRole('combobox')).toHaveDisplayValue(['Physical']); + }); + + it('should be Email', () => { + primaryPerson.primaryEmailAddress = { email: 'a@b.com' }; + + const { getByRole } = render( + , + ); + + expect(getByRole('combobox')).toHaveDisplayValue(['Email']); + }); + + it('should be None when opting out of emails', () => { + primaryPerson.primaryEmailAddress = { email: 'a@b.com' }; + primaryPerson.optoutEnewsletter = true; + + const { getByRole } = render( + , + ); + + expect(getByRole('combobox')).toHaveDisplayValue(['None']); + }); + + it('should be Both', () => { + primaryAddress.street = '100 Test St'; + primaryPerson.primaryEmailAddress = { email: 'a@b.com' }; + + const { getByRole } = render( + , + ); + + expect(getByRole('combobox')).toHaveDisplayValue(['Both']); + }); + + it('should be Physical when opting out of emails', () => { + primaryAddress.street = '100 Test St'; + primaryPerson.primaryEmailAddress = { email: 'a@b.com' }; + primaryPerson.optoutEnewsletter = true; + + const { getByRole } = render( + , + ); + + expect(getByRole('combobox')).toHaveDisplayValue(['Physical']); + }); + }); +}); diff --git a/src/components/Tool/FixSendNewsletter/Contact.tsx b/src/components/Tool/FixSendNewsletter/Contact.tsx index c52209f4a..0a935f501 100644 --- a/src/components/Tool/FixSendNewsletter/Contact.tsx +++ b/src/components/Tool/FixSendNewsletter/Contact.tsx @@ -1,4 +1,4 @@ -import React, { ReactElement, useState } from 'react'; +import React, { ReactElement, useEffect, useState } from 'react'; import { mdiCheckboxMarkedCircle } from '@mdi/js'; import { Icon } from '@mdi/react'; import { @@ -99,9 +99,28 @@ const Contact = ({ setContactFocus, }: Props): ReactElement => { const { t } = useTranslation(); - const [newsletter, setNewsletter] = useState(SendNewsletterEnum.Both); + const [newsletter, setNewsletter] = useState(SendNewsletterEnum.None); const { classes } = useStyles(); + useEffect(() => { + let newNewsletterValue = SendNewsletterEnum.None; + if (primaryAddress?.street) { + newNewsletterValue = SendNewsletterEnum.Physical; + } + if (primaryPerson) { + if (!primaryPerson.optoutEnewsletter) { + if (primaryPerson.primaryEmailAddress?.email?.length) { + if (newNewsletterValue === SendNewsletterEnum.Physical) { + newNewsletterValue = SendNewsletterEnum.Both; + } else { + newNewsletterValue = SendNewsletterEnum.Email; + } + } + } + } + setNewsletter(newNewsletterValue); + }, [primaryAddress]); + //TODO: Add button functionality const handleChange = ( diff --git a/src/components/Tool/FixSendNewsletter/FixSendNewsletter.tsx b/src/components/Tool/FixSendNewsletter/FixSendNewsletter.tsx index 4eb61810b..afa385a22 100644 --- a/src/components/Tool/FixSendNewsletter/FixSendNewsletter.tsx +++ b/src/components/Tool/FixSendNewsletter/FixSendNewsletter.tsx @@ -181,6 +181,7 @@ const FixSendNewsletter: React.FC = ({ primaryEmailAddress: { email: '', }, + optoutEnewsletter: false, } } key={contact.id} diff --git a/src/components/Tool/FixSendNewsletter/GetInvalidNewsletter.graphql b/src/components/Tool/FixSendNewsletter/GetInvalidNewsletter.graphql index 53cfdecb9..5314e1197 100644 --- a/src/components/Tool/FixSendNewsletter/GetInvalidNewsletter.graphql +++ b/src/components/Tool/FixSendNewsletter/GetInvalidNewsletter.graphql @@ -37,4 +37,5 @@ fragment ContactPrimaryPerson on Person { primaryEmailAddress { email } + optoutEnewsletter }