fix: cohorts disabled when 'all learners' is selected

src/components/bulk-email-tool/bulk-email-form/BulkEmailForm.jsx

@@ -122,6 +122,14 @@ function BulkEmailForm(props) {
   const onRecipientChange = (event) => {
     if (event.target.checked) {
       dispatch(addRecipient(event.target.value));
+      // if "All Learners" is checked then we want to remove any cohorts, verified learners, and audit learners
+      if (event.target.value === 'learners') {
+        editor.emailRecipients.forEach(recipient => {
+          if (/^cohort/.test(recipient) || /^track/.test(recipient)) {
+            dispatch(removeRecipient(recipient));
+          }
+        });
+      }
     } else {
       dispatch(removeRecipient(event.target.value));
     }

src/components/bulk-email-tool/bulk-email-form/bulk-email-recipient/BulkEmailRecipient.jsx

@@ -69,6 +69,7 @@ export default function BulkEmailRecipient(props) {
             <Form.Checkbox
               key={cohort}
               value={`cohort:${cohort}`}
+              disabled={selectedGroups.find((group) => group === DEFAULT_GROUPS.ALL_LEARNERS)}
               className="col col-lg-4 col-sm-6 col-12"
             >
               <FormattedMessage
@@ -94,7 +95,6 @@ export default function BulkEmailRecipient(props) {
         <Form.Checkbox
           key="learners"
           value="learners"
-          disabled={selectedGroups.find((group) => group === (DEFAULT_GROUPS.AUDIT || DEFAULT_GROUPS.VERIFIED))}
           className="col col-lg-4 col-sm-6 col-12"
         >
           <FormattedMessage

src/components/bulk-email-tool/bulk-email-form/data/__factories__/bulkEmailFormCohort.factory.js

@@ -0,0 +1,7 @@
+import { Factory } from 'rosie'; // eslint-disable-line import/no-extraneous-dependencies
+
+export default Factory.define('')
+  .attr('cohorts', [
+    'Gnarly',
+    'Righteous',
+  ]);

src/components/bulk-email-tool/bulk-email-form/test/BulkEmailForm.test.jsx

@@ -11,6 +11,7 @@ import BulkEmailForm from '..';
 import * as bulkEmailFormApi from '../data/api';
 import { BulkEmailContext, BulkEmailProvider } from '../../bulk-email-context';
 import { formatDate } from '../../../../utils/formatDateAndTime';
+import cohortFactory from '../data/__factories__/bulkEmailFormCohort.factory';
 
 jest.mock('../../text-editor/TextEditor');
 
@@ -21,9 +22,10 @@ const tomorrow = new Date();
 tomorrow.setDate(new Date().getDate() + 1);
 
 function renderBulkEmailForm() {
+  const { cohorts } = cohortFactory.build();
   return (
     <BulkEmailProvider>
-      <BulkEmailForm courseId="test" />
+      <BulkEmailForm courseId="test" cohorts={cohorts} />
     </BulkEmailProvider>
   );
 }
@@ -91,6 +93,16 @@ describe('bulk-email-form', () => {
     fireEvent.click(await screen.findByRole('button', { name: /continue/i }));
     expect(await screen.findByText('An error occured while attempting to send the email.')).toBeInTheDocument();
   });
+  test('Checking "All Learners" disables each learner group', async () => {
+    render(renderBulkEmailForm());
+    fireEvent.click(screen.getByRole('checkbox', { name: 'All Learners' }));
+    const verifiedLearners = screen.getByRole('checkbox', { name: 'Learners in the verified certificate track' });
+    const auditLearners = screen.getByRole('checkbox', { name: 'Learners in the audit track' });
+    const { cohorts } = cohortFactory.build();
+    cohorts.forEach(cohort => expect(screen.getByRole('checkbox', { name: `Cohort: ${cohort}` })).toBeDisabled());
+    expect(verifiedLearners).toBeDisabled();
+    expect(auditLearners).toBeDisabled();
+  });
   test('Shows scheduling form when checkbox is checked and submit is changed', async () => {
     render(renderBulkEmailForm());
     const scheduleCheckbox = screen.getByText('Schedule this email for a future date');