Unify error message for unauthorized email

[MAILPOET-4506]

mailpoet/assets/js/src/common/sender_email_address_warning.jsx

@@ -41,18 +41,20 @@ function SenderEmailAddressWarning({
           <p className="sender_email_address_warning">
             {ReactStringReplace(
               MailPoet.I18n.t('youNeedToAuthorizeTheEmail'),
-              '[email]',
-              () => emailAddress,
-            )}{' '}
-            <a
-              className="mailpoet-link"
-              href="#"
-              target="_blank"
-              rel="noopener noreferrer"
-              onClick={(e) => loadModal(e, 'sender_email')}
-            >
-              {MailPoet.I18n.t('authorizeMyEmail')}
-            </a>
+              /\[link\](.*?)\[\/link\]/g,
+              (match) => (
+                <a
+                  className="mailpoet-link"
+                  href="#"
+                  target="_blank"
+                  rel="noopener noreferrer"
+                  onClick={(e) => loadModal(e, 'sender_email')}
+                  key={emailAddress}
+                >
+                  {match}
+                </a>
+              ),
+            )}
           </p>
         </div>,
       );

mailpoet/assets/js/src/newsletters/send.jsx

@@ -166,38 +166,6 @@ class NewsletterSendComponent extends Component {
     return addresses.indexOf(fromAddress) !== -1;
   };
 
-  showInvalidFromAddressError = () => {
-    const fromAddress = this.state.item.sender_address;
-    let errorMessage = ReactStringReplace(
-      MailPoet.I18n.t('newsletterInvalidFromAddress'),
-      '%1$s',
-      () => fromAddress,
-    );
-    errorMessage = ReactStringReplace(
-      errorMessage,
-      /\[link\](.*?)\[\/link\]/g,
-      (match) =>
-        `<a href="https://account.mailpoet.com/authorization?email=${encodeURIComponent(
-          fromAddress,
-        )}" target="_blank" class="mailpoet-js-button-authorize-email-and-sender-domain" data-email="${fromAddress}" data-type="email" rel="noopener noreferrer">${match}</a>`,
-    );
-    jQuery('#field_sender_address')
-      .parsley()
-      .addError('invalidFromAddress', {
-        message: errorMessage.join(''),
-        updateClass: true,
-      });
-    MailPoet.trackEvent('Unauthorized email used', {
-      'Unauthorized email source': 'send',
-    });
-  };
-
-  removeInvalidFromAddressError = () => {
-    jQuery('#field_sender_address')
-      .parsley()
-      .removeError('invalidFromAddress', { updateClass: true });
-  };
-
   loadItem = (id) => {
     this.setState({ loading: true });
 
@@ -295,12 +263,13 @@ class NewsletterSendComponent extends Component {
       endpoint: 'mailer',
       action: 'getAuthorizedEmailAddresses',
     });
-    return response.data || [];
+    const authorizedEmails = response.data || [];
+    window.mailpoet_authorized_emails = authorizedEmails;
+    return authorizedEmails;
   };
 
   handleSend = (e) => {
     e.preventDefault();
-    this.removeInvalidFromAddressError();
 
     if (!this.isValid()) {
       return jQuery('#mailpoet_newsletter').parsley().validate();
@@ -310,7 +279,8 @@ class NewsletterSendComponent extends Component {
 
     return this.isValidFromAddress().then((valid) => {
       if (!valid) {
-        this.showInvalidFromAddressError();
+        // handling invalid error message is handled in sender_address_field component
+        window.mailpoet_sender_address_field_blur();
         return MailPoet.Modal.loading(false);
       }
       return this.saveNewsletter(e)

mailpoet/assets/js/src/newsletters/send/sender_address_field.jsx

@@ -22,6 +22,8 @@ class SenderField extends Component {
     };
     this.onChange = this.onChange.bind(this);
     this.onBlur = this.onBlur.bind(this);
+    // to allow use the same error message from the last step of sending
+    window.mailpoet_sender_address_field_blur = this.onBlur;
 
     const fieldId = props.field.id || `field_${props.field.name}`;
     this.domElementSelector = `#${fieldId}`;

mailpoet/views/newsletters.html

@@ -296,7 +296,7 @@
     'websiteTimeIs': __("Your website’s time is"),
     'noScheduledDateError': __('Please enter the scheduled date.'),
     'schedule': __('Schedule'),
-    'youNeedToAuthorizeTheEmail': __('You need to authorize the email address [email] to be able to send with it.'),
+    'youNeedToAuthorizeTheEmail': __('Not an authorized sender email address. [link]Authorize it now.[/link]'),
     'authorizeMyEmail': __('Authorize my email address'),
 
     'next': __('Next'),
@@ -304,7 +304,6 @@
     'newsletterBeingSent': __('The newsletter is being sent...'),
     'newsletterHasBeenScheduled': __('The newsletter has been scheduled.'),
     'newsletterSendingHasBeenResumed': __('The newsletter sending has been resumed.'),
-    'newsletterInvalidFromAddress': _x('You need to authorize the email address <i>%1$s</i> to be able to send with it. [link]Authorize my email address[/link]', 'Users need to confirm that they own the email address they want to use to send their newsletter'),
     'welcomeEmailActivated': __('Your Welcome Email is now activated!'),
     'welcomeEmailActivationFailed': __('Your Welcome Email could not be activated, please check the settings.'),
     'reEngagementEmailActivated': __('Your ReEngagement Email is now activated!'),

mailpoet/views/settings.html

@@ -97,7 +97,7 @@
     'readGuide': __('Read our guide'),
 
     'invalidEmail': __('Invalid email address'),
-    'youNeedToAuthorizeTheEmail': __('You need to authorize the email address [email] to be able to send with it.'),
+    'youNeedToAuthorizeTheEmail': __('Not an authorized sender email address. [link]Authorize it now.[/link]'),
     'authorizeMyEmail': __('Authorize my email address'),
     'authorizeSenderDomain': __('Email violates Sender Domain’s DMARC policy. Please set up [link]sender authentication[/link].'),