Use React notices in set FROM address modal

[MAILPOET-2804]
This commit is contained in:
Jan Jakeš
2020-03-31 14:25:04 +02:00
committed by Veljko V
parent e237eb33b1
commit 6636313baf
2 changed files with 33 additions and 12 deletions

View File

@@ -3,6 +3,7 @@ import ReactStringReplace from 'react-string-replace';
import jQuery from 'jquery'; import jQuery from 'jquery';
import MailPoet from 'mailpoet'; import MailPoet from 'mailpoet';
import Modal from 'common/modal/modal.jsx'; import Modal from 'common/modal/modal.jsx';
import { GlobalContext } from 'context';
const mailPoetApiVersion = (window as any).mailpoet_api_version as string; const mailPoetApiVersion = (window as any).mailpoet_api_version as string;
@@ -30,9 +31,22 @@ const getErrorMessage = (error: any|null): string => {
return error.message || MailPoet.I18n.t('setFromAddressEmailUnknownError'); return error.message || MailPoet.I18n.t('setFromAddressEmailUnknownError');
}; };
const getSuccessMessage = (): string => MailPoet.I18n.t('setFromAddressEmailSuccess').replace( const getSuccessMessage = (): JSX.Element => (
/\[link\](.*?)\[\/link\]/g, <p>
'<a href="?page=mailpoet-settings#basics" rel="noopener noreferrer">$1</a>' { ReactStringReplace(
MailPoet.I18n.t('setFromAddressEmailSuccess'),
/\[link\](.*?)\[\/link\]/g,
(match) => (
<a
key="setFromAddressModalBasicsTabLink"
href="?page=mailpoet-settings#basics"
rel="noopener noreferrer"
>
{match}
</a>
)
)}
</p>
); );
const removeUnauthorizedEmailNotices = () => { const removeUnauthorizedEmailNotices = () => {
@@ -52,6 +66,7 @@ type Props = {
const SetFromAddressModal = ({ onRequestClose }: Props) => { const SetFromAddressModal = ({ onRequestClose }: Props) => {
const [address, setAddress] = useState(null); const [address, setAddress] = useState(null);
const { notices } = React.useContext<any>(GlobalContext);
return ( return (
<Modal <Modal
@@ -109,7 +124,7 @@ const SetFromAddressModal = ({ onRequestClose }: Props) => {
await handleSave(address); await handleSave(address);
onRequestClose(); onRequestClose();
removeUnauthorizedEmailNotices(); removeUnauthorizedEmailNotices();
MailPoet.Notice.success(getSuccessMessage()); notices.success(getSuccessMessage(), { timeout: false });
} catch (e) { } catch (e) {
const error = e.errors && e.errors[0] ? e.errors[0] : null; const error = e.errors && e.errors[0] ? e.errors[0] : null;
const message = getErrorMessage(error); const message = getErrorMessage(error);

View File

@@ -3,6 +3,8 @@ import React, { useMemo, useState } from 'react';
import ReactDOM from 'react-dom'; import ReactDOM from 'react-dom';
import MailPoet from 'mailpoet'; import MailPoet from 'mailpoet';
import SetFromAddressModal from 'common/set_from_address_modal.tsx'; import SetFromAddressModal from 'common/set_from_address_modal.tsx';
import { GlobalContext, useGlobalContextValue } from 'context/index.jsx';
import Notices from 'notices/notices.jsx';
import KeyMessages from 'old_settings/premium_tab/messages/key_messages.jsx'; import KeyMessages from 'old_settings/premium_tab/messages/key_messages.jsx';
import { MssStatus, MssMessages } from 'old_settings/premium_tab/messages/mss_messages.jsx'; import { MssStatus, MssMessages } from 'old_settings/premium_tab/messages/mss_messages.jsx';
import { PremiumStatus, PremiumMessages } from 'old_settings/premium_tab/messages/premium_messages.jsx'; import { PremiumStatus, PremiumMessages } from 'old_settings/premium_tab/messages/premium_messages.jsx';
@@ -279,13 +281,17 @@ if (container) {
return mssActive ? MssStatus.KEY_VALID_MSS_ACTIVE : MssStatus.KEY_VALID_MSS_NOT_ACTIVE; return mssActive ? MssStatus.KEY_VALID_MSS_ACTIVE : MssStatus.KEY_VALID_MSS_NOT_ACTIVE;
}; };
ReactDOM.render( const App = () => (
<PremiumTab <GlobalContext.Provider value={useGlobalContextValue(window)}>
activationKey={window.mailpoet_activation_key} <Notices />
premiumStatus={getPremiumStatus()} <PremiumTab
mssStatus={getMssStatus()} activationKey={window.mailpoet_activation_key}
premiumPluginActive={!!window.mailpoet_premium_version} premiumStatus={getPremiumStatus()}
/>, mssStatus={getMssStatus()}
container premiumPluginActive={!!window.mailpoet_premium_version}
/>
</GlobalContext.Provider>
); );
ReactDOM.render(<App />, container);
} }