diff --git a/.eslintrc.js b/.eslintrc.js index 0e87381..81ad9ce 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -1,3 +1,13 @@ +// eslint-disable-next-line import/no-extraneous-dependencies const { createConfig } = require('@edx/frontend-build'); -module.exports = createConfig('eslint'); \ No newline at end of file +module.exports = createConfig( + 'eslint', + { + rules: { + 'template-curly-spacing': 'off', + 'react-hooks/exhaustive-deps': 'off', + 'react/jsx-no-bind': [0, { ignoreDOMComponents: true }], + }, + }, +); diff --git a/src/components/bulk-email-tool/bulk-email-form/BulkEmailForm.jsx b/src/components/bulk-email-tool/bulk-email-form/BulkEmailForm.jsx index bc0e532..3702ded 100644 --- a/src/components/bulk-email-tool/bulk-email-form/BulkEmailForm.jsx +++ b/src/components/bulk-email-tool/bulk-email-form/BulkEmailForm.jsx @@ -45,6 +45,55 @@ const FORM_ACTIONS = { PATCH: 'PATCH', }; +function AlertMessage(intl, editor, isScheduled) { + return ( + <> +

{intl.formatMessage(messages.bulkEmailTaskAlertRecipients, { subject: editor.emailSubject })}

+ + {!isScheduled && ( +

+ {intl.formatMessage(messages.bulkEmailInstructionsCaution)} + {intl.formatMessage(messages.bulkEmailInstructionsCautionMessage)} +

+ )} + + ); +} + +function EditMessage(intl, editor, isScheduled) { + return ( + <> +

+ {intl.formatMessage(messages.bulkEmailTaskAlertEditingDate, { + dateTime: new Date(`${editor.scheduleDate} ${editor.scheduleTime}`).toLocaleString(), + })} +

+

+ {intl.formatMessage(messages.bulkEmailTaskAlertEditingSubject, { + subject: editor.emailSubject, + })} +

+

{intl.formatMessage(messages.bulkEmailTaskAlertEditingTo)}

+ +

{intl.formatMessage(messages.bulkEmailTaskAlertEditingWarning)}

+ {!isScheduled && ( +

+ {intl.formatMessage(messages.bulkEmailInstructionsCaution)} + {intl.formatMessage(messages.bulkEmailInstructionsCautionMessage)} +

+ )} + + ); +} + function BulkEmailForm(props) { const { courseId, cohorts, intl } = props; const [{ editor }, dispatch] = useContext(BulkEmailContext); @@ -205,58 +254,15 @@ function BulkEmailForm(props) { } else { setEmailFormStatus(FORM_SUBMIT_STATES.DEFAULT); } - }, [isScheduled, editor.editMode, editor.isLoading, editor.errorRetrievingData, editor.formComplete]); - - const AlertMessage = () => ( - <> -

{intl.formatMessage(messages.bulkEmailTaskAlertRecipients, { subject: editor.emailSubject })}

- - {!isScheduled && ( -

- {intl.formatMessage(messages.bulkEmailInstructionsCaution)} - {intl.formatMessage(messages.bulkEmailInstructionsCautionMessage)} -

- )} - - ); - - const EditMessage = () => ( - <> -

- {intl.formatMessage(messages.bulkEmailTaskAlertEditingDate, { - dateTime: new Date(`${editor.scheduleDate} ${editor.scheduleTime}`).toLocaleString(), - })} -

-

- {intl.formatMessage(messages.bulkEmailTaskAlertEditingSubject, { - subject: editor.emailSubject, - })} -

-

{intl.formatMessage(messages.bulkEmailTaskAlertEditingTo)}

- -

{intl.formatMessage(messages.bulkEmailTaskAlertEditingWarning)}

- {!isScheduled && ( -

- {intl.formatMessage(messages.bulkEmailInstructionsCaution)} - {intl.formatMessage(messages.bulkEmailInstructionsCautionMessage)} -

- )} - - ); + }, [isScheduled, editor.editMode, editor.isLoading, editor.errorRetrievingData, + editor.formComplete, delayedEmailFormReset]); return (
{ closeTaskAlert(); if (event.target.name === 'continue') { diff --git a/src/components/bulk-email-tool/bulk-email-task-manager/BulkEmailContentHistory.jsx b/src/components/bulk-email-tool/bulk-email-task-manager/BulkEmailContentHistory.jsx index 75a0dab..d7f3a4e 100644 --- a/src/components/bulk-email-tool/bulk-email-task-manager/BulkEmailContentHistory.jsx +++ b/src/components/bulk-email-tool/bulk-email-task-manager/BulkEmailContentHistory.jsx @@ -94,6 +94,12 @@ function BulkEmailContentHistory({ intl }) { }, ]; + const getCell = (tableData, row) => ( + + ); + /** * Paragon's DataTable supports the ability to add extra columns that might not directly coincide with the data being * represented in the table. We are using an additional column to embed a button that will open a Modal to display the @@ -106,11 +112,7 @@ function BulkEmailContentHistory({ intl }) { { id: 'view_message', Header: '', - Cell: ({ row }) => ( - - ), + Cell: ({ row }) => getCell(tableData, row), }, ]; }; diff --git a/src/components/bulk-email-tool/bulk-email-task-manager/bulk-email-scheduled-emails-table/BulkEmailScheduledEmailsTable.jsx b/src/components/bulk-email-tool/bulk-email-task-manager/bulk-email-scheduled-emails-table/BulkEmailScheduledEmailsTable.jsx index 59f3aa4..ac499f1 100644 --- a/src/components/bulk-email-tool/bulk-email-task-manager/bulk-email-scheduled-emails-table/BulkEmailScheduledEmailsTable.jsx +++ b/src/components/bulk-email-tool/bulk-email-task-manager/bulk-email-scheduled-emails-table/BulkEmailScheduledEmailsTable.jsx @@ -108,6 +108,25 @@ function BulkEmailScheduledEmailsTable({ intl }) { }), ); }; + + const getCell = (row, state, page, previousPage) => ( + <> + handleViewEmail(row)} /> + { + setCurrentTask({ + row, pageIndex: state.pageIndex, page, previousPage, + }); + openConfirmModal(); + }} + /> + handleEditEmail(row)} /> + + ); + return ( <> ( - <> - handleViewEmail(row)} /> - { - setCurrentTask({ - row, pageIndex: state.pageIndex, page, previousPage, - }); - openConfirmModal(); - }} - /> - handleEditEmail(row)} /> - - ), + }) => getCell(row, state, page, previousPage), }, ]} />