Merge pull request #1147 from CruGlobal/MPDX-8403

MPDX 8403 - Fix email exports to export the correct emails
CruGlobal · Oct 23, 2024 · 5ade3d4 · 5ade3d4
2 parents acc4107 + c6c2d3b
commit 5ade3d4
Show file tree

Hide file tree

Showing 7 changed files with 127 additions and 144 deletions.
diff --git a/src/components/Contacts/MassActions/Exports/Emails/GetEmailsForExporting.graphql b/src/components/Contacts/MassActions/Exports/Emails/GetEmailsForExporting.graphql
@@ -12,6 +12,8 @@ query GetEmailsForExporting(
       id
       people(first: 25) {
         nodes {
+          id
+          optoutEnewsletter
           primaryEmailAddress {
             id
             email

diff --git a/src/components/Contacts/MassActions/Exports/Emails/MassActionsExportEmailsModal.test.tsx b/src/components/Contacts/MassActions/Exports/Emails/MassActionsExportEmailsModal.test.tsx
@@ -6,43 +6,20 @@ import { render, waitFor } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 import { SnackbarProvider } from 'notistack';
 import { GqlMockedProvider } from '__tests__/util/graphqlMocking';
+import {
+  correctEmailsForExport,
+  getEmailNewsletterContactsMocks as getEmailsForExportingMocks,
+} from 'src/components/Dashboard/ThisWeek/NewsletterMenu/MenuItems/ExportEmail/ExportEmailMocks';
 import theme from 'src/theme';
 import { GetEmailsForExportingQuery } from './GetEmailsForExporting.generated';
 import { MassActionsExportEmailsModal } from './MassActionsExportEmailsModal';
 
 const mockEnqueue = jest.fn();
 const selectedIds: string[] = ['abc'];
-const accountListId = '123456789';
+const accountListId = 'accountListId';
 const handleClose = jest.fn();
 const mocks = {
-  GetEmailsForExporting: {
-    contacts: {
-      nodes: [
-        {
-          people: {
-            nodes: [
-              {
-                primaryEmailAddress: {
-                  email: '[email protected]',
-                },
-              },
-            ],
-          },
-        },
-        {
-          people: {
-            nodes: [
-              {
-                primaryEmailAddress: {
-                  email: '[email protected]',
-                },
-              },
-            ],
-          },
-        },
-      ],
-    },
-  },
+  GetEmailsForExporting: getEmailsForExportingMocks,
 };
 
 jest.mock('notistack', () => ({
@@ -96,7 +73,7 @@ describe('MassActionsExportEmailsModal', () => {
     userEvent.click(queryAllByText('Copy All')[0]);
     await waitFor(() =>
       expect(navigator.clipboard.writeText).toHaveBeenCalledWith(
-        '[email protected],[email protected]',
+        correctEmailsForExport,
       ),
     );
     // Export Outlook emails
@@ -114,7 +91,7 @@ describe('MassActionsExportEmailsModal', () => {
     userEvent.click(queryAllByText('Copy All')[1]);
     await waitFor(() =>
       expect(navigator.clipboard.writeText).toHaveBeenCalledWith(
-        '[email protected];[email protected]',
+        correctEmailsForExport,
       ),
     );
     // Exit

diff --git a/src/components/Contacts/MassActions/Exports/Emails/MassActionsExportEmailsModal.tsx b/src/components/Contacts/MassActions/Exports/Emails/MassActionsExportEmailsModal.tsx
@@ -48,10 +48,14 @@ export const MassActionsExportEmailsModal: React.FC<
     },
   });
 
+  // Contact Query filters "optOut" removes any contacts that one of their people has opted out of the digital newsletter.
+  // So we have to filter out contacts that have opted out of the digital newsletter from the people nodes.
   const contactPrimaryEmails =
     contactData?.contacts.nodes
       .flatMap((contact) => contact.people.nodes)
-      .filter((person) => person.primaryEmailAddress)
+      .filter(
+        (person) => person.primaryEmailAddress && !person.optoutEnewsletter,
+      )
       .map((person) => person.primaryEmailAddress?.email) ?? [];
 
   const regularFormat = contactPrimaryEmails.join(',');

diff --git a/src/components/Dashboard/ThisWeek/NewsletterMenu/MenuItems/ExportEmail/ExportEmail.test.tsx b/src/components/Dashboard/ThisWeek/NewsletterMenu/MenuItems/ExportEmail/ExportEmail.test.tsx
@@ -5,73 +5,38 @@ import userEvent from '@testing-library/user-event';
 import { GqlMockedProvider } from '__tests__/util/graphqlMocking';
 import theme from '../../../../../../theme';
 import ExportEmail from './ExportEmail';
+import {
+  correctEmailsForExport,
+  getEmailNewsletterContactsMocks,
+} from './ExportEmailMocks';
 import { GetEmailNewsletterContactsQuery } from './GetNewsletterContacts.generated';
 
 const accountListId = '111';
 const handleClose = jest.fn();
 
+const Components = () => (
+  <ThemeProvider theme={theme}>
+    <GqlMockedProvider<{
+      GetEmailNewsletterContacts: GetEmailNewsletterContactsQuery;
+    }>
+      mocks={{
+        GetEmailNewsletterContacts: getEmailNewsletterContactsMocks,
+      }}
+    >
+      <ExportEmail accountListId={accountListId} handleClose={handleClose} />
+    </GqlMockedProvider>
+  </ThemeProvider>
+);
 describe('LogNewsletter', () => {
   it('default', () => {
-    const { queryByText } = render(
-      <ThemeProvider theme={theme}>
-        <GqlMockedProvider>
-          <ExportEmail
-            accountListId={accountListId}
-            handleClose={handleClose}
-          />
-        </GqlMockedProvider>
-      </ThemeProvider>,
-    );
+    const { queryByText } = render(<Components />);
     expect(queryByText('Digital Newsletter List')).toBeInTheDocument();
   });
 
   it('creates emailList string', async () => {
-    const email1 = '[email protected]';
-    const email2 = '[email protected]';
-    const mocks = {
-      GetEmailNewsletterContacts: {
-        contacts: {
-          nodes: [
-            {
-              primaryPerson: {
-                primaryEmailAddress: {
-                  email: email1,
-                },
-              },
-            },
-            {
-              primaryPerson: {
-                primaryEmailAddress: {
-                  email: email2,
-                },
-              },
-            },
-            {
-              primaryPerson: null,
-            },
-          ],
-          pageInfo: {
-            hasNextPage: false,
-          },
-        },
-      },
-    };
-    const { queryByTestId } = render(
-      <ThemeProvider theme={theme}>
-        <GqlMockedProvider<{
-          GetEmailNewsletterContacts: GetEmailNewsletterContactsQuery;
-        }>
-          mocks={mocks}
-        >
-          <ExportEmail
-            accountListId={accountListId}
-            handleClose={handleClose}
-          />
-        </GqlMockedProvider>
-      </ThemeProvider>,
-    );
+    const { queryByTestId } = render(<Components />);
     await waitFor(() => expect(queryByTestId('emailList')).not.toBeNull());
-    expect(queryByTestId('emailList')).toHaveValue(`${email1},${email2}`);
+    expect(queryByTestId('emailList')).toHaveValue(correctEmailsForExport);
   });
 
   it('copies emailList to clipboard', async () => {
@@ -80,54 +45,11 @@ describe('LogNewsletter', () => {
         writeText: jest.fn(),
       },
     });
-    const email1 = '[email protected]';
-    const email2 = '[email protected]';
-    const mocks = {
-      GetEmailNewsletterContacts: {
-        contacts: {
-          nodes: [
-            {
-              primaryPerson: {
-                primaryEmailAddress: {
-                  email: email1,
-                },
-              },
-            },
-            {
-              primaryPerson: {
-                primaryEmailAddress: {
-                  email: email2,
-                },
-              },
-            },
-            {
-              primaryPerson: null,
-            },
-          ],
-          pageInfo: {
-            hasNextPage: false,
-          },
-        },
-      },
-    };
-    const { queryByTestId, getByText } = render(
-      <ThemeProvider theme={theme}>
-        <GqlMockedProvider<{
-          GetEmailNewsletterContacts: GetEmailNewsletterContactsQuery;
-        }>
-          mocks={mocks}
-        >
-          <ExportEmail
-            accountListId={accountListId}
-            handleClose={handleClose}
-          />
-        </GqlMockedProvider>
-      </ThemeProvider>,
-    );
+    const { queryByTestId, getByText } = render(<Components />);
     await waitFor(() => expect(queryByTestId('emailList')).not.toBeNull());
     userEvent.click(getByText('Copy All'));
     expect(navigator.clipboard.writeText).toHaveBeenCalledWith(
-      `${email1},${email2}`,
+      correctEmailsForExport,
     );
   });
 });
diff --git a/src/components/Dashboard/ThisWeek/NewsletterMenu/MenuItems/ExportEmail/ExportEmail.tsx b/src/components/Dashboard/ThisWeek/NewsletterMenu/MenuItems/ExportEmail/ExportEmail.tsx
@@ -57,14 +57,18 @@ const ExportEmail = ({
     pageInfo: data?.contacts.pageInfo,
   });
 
-  const emailList = useMemo(
-    () =>
-      data?.contacts?.nodes
-        .map((contact) => contact.primaryPerson?.primaryEmailAddress?.email)
-        .filter(Boolean)
-        .join(','),
-    [data],
-  );
+  const emailList = useMemo(() => {
+    if (!data) {
+      return '';
+    }
+    return data.contacts.nodes
+      .flatMap((contact) => contact.people.nodes)
+      .filter(
+        (person) => person.primaryEmailAddress && !person.optoutEnewsletter,
+      )
+      .map((person) => person.primaryEmailAddress?.email)
+      .join(',');
+  }, [data]);
 
   return (
     <>

diff --git a/src/components/Dashboard/ThisWeek/NewsletterMenu/MenuItems/ExportEmail/ExportEmailMocks.ts b/src/components/Dashboard/ThisWeek/NewsletterMenu/MenuItems/ExportEmail/ExportEmailMocks.ts
@@ -0,0 +1,71 @@
+export const correctEmailsForExport = 'email1,email3,email4,email7';
+
+export const getEmailNewsletterContactsMocks = {
+  contacts: {
+    nodes: [
+      {
+        people: {
+          nodes: [
+            {
+              optoutEnewsletter: false,
+              primaryEmailAddress: {
+                email: 'email1',
+              },
+            },
+            {
+              optoutEnewsletter: true,
+              primaryEmailAddress: {
+                email: 'email2',
+              },
+            },
+            {
+              optoutEnewsletter: false,
+              primaryEmailAddress: {
+                email: 'email3',
+              },
+            },
+          ],
+        },
+      },
+      {
+        people: {
+          nodes: [
+            {
+              optoutEnewsletter: false,
+              primaryEmailAddress: {
+                email: 'email4',
+              },
+            },
+          ],
+        },
+      },
+      {
+        people: {
+          nodes: [
+            {
+              optoutEnewsletter: true,
+              primaryEmailAddress: {
+                email: 'email5',
+              },
+            },
+            {
+              optoutEnewsletter: true,
+              primaryEmailAddress: {
+                email: 'email6',
+              },
+            },
+            {
+              optoutEnewsletter: false,
+              primaryEmailAddress: {
+                email: 'email7',
+              },
+            },
+          ],
+        },
+      },
+    ],
+    pageInfo: {
+      hasNextPage: false,
+    },
+  },
+};
diff --git a/...nts/Dashboard/ThisWeek/NewsletterMenu/MenuItems/ExportEmail/GetNewsletterContacts.graphql b/...nts/Dashboard/ThisWeek/NewsletterMenu/MenuItems/ExportEmail/GetNewsletterContacts.graphql
@@ -7,11 +7,14 @@ query GetEmailNewsletterContacts($accountListId: ID!, $after: String) {
   ) {
     nodes {
       id
-      primaryPerson {
-        id
-        primaryEmailAddress {
+      people {
+        nodes {
           id
-          email
+          optoutEnewsletter
+          primaryEmailAddress {
+            id
+            email
+          }
         }
       }
     }