Refactor form placement panel to extra component

[MAILPOET-2455]
This commit is contained in:
Rostislav Wolny
2019-11-19 14:29:27 +01:00
committed by Jack Kitterhing
parent 969f66e71c
commit 72fe158069
3 changed files with 42 additions and 30 deletions

View File

@@ -16,14 +16,6 @@ export default () => {
[]
);
const addFormWidgetHint = ReactStringReplace(
MailPoet.I18n.t('addFormWidgetHint'),
/\[link\](.*?)\[\/link\]/g,
(match) => (
<a key="addFormWidgetHintLink" href="widgets.php" target="_blank">{match}</a>
)
);
const exportLinkClicked = (event, type) => {
event.preventDefault();
if (type === 'php') {
@@ -35,11 +27,19 @@ export default () => {
return setCopyAreaContent(formExports.shortcode);
};
const addFormWidgetHint = ReactStringReplace(
MailPoet.I18n.t('addFormWidgetHint'),
/\[link\](.*?)\[\/link\]/g,
(match) => (
<a key="addFormWidgetHintLink" href="widgets.php" target="_blank">{match}</a>
)
);
const addFormShortcodeHint = ReactStringReplace(
MailPoet.I18n.t('addFormShortcodeHint'),
/\[link\](.*?)\[\/link\]/g,
(match) => (
<a key="exportShorcode" href="#" onClick={(e) => exportLinkClicked(e, 'shortcode')}>{match}</a>
<a key="exportShortcode" href="#" onClick={(e) => exportLinkClicked(e, 'shortcode')}>{match}</a>
)
);
@@ -68,25 +68,13 @@ export default () => {
};
return (
<>
<Panel>
<PanelBody title={MailPoet.I18n.t('formSettings')}>
<p>TODO Basic Settings</p>
</PanelBody>
</Panel>
<Panel>
<PanelBody title={MailPoet.I18n.t('formPlacement')} initialOpen={false}>
<p>{addFormWidgetHint}</p>
<p>{addFormShortcodeHint}</p>
<p>{addFormPhpIframeHint}</p>
{getCopyTextArea()}
</PanelBody>
</Panel>
<Panel>
<PanelBody title={MailPoet.I18n.t('customCss')} initialOpen={false}>
<p>TODO Custom CSS</p>
</PanelBody>
</Panel>
</>
<Panel>
<PanelBody title={MailPoet.I18n.t('formPlacement')} initialOpen={false}>
<p>{addFormWidgetHint}</p>
<p>{addFormShortcodeHint}</p>
<p>{addFormPhpIframeHint}</p>
{getCopyTextArea()}
</PanelBody>
</Panel>
);
};

View File

@@ -0,0 +1,24 @@
import React from 'react';
import {
Panel,
PanelBody,
} from '@wordpress/components';
import MailPoet from 'mailpoet';
import FormPlacementPanel from './form_placement_panel.jsx';
export default () => (
<>
<Panel>
<PanelBody title={MailPoet.I18n.t('formSettings')}>
<p>TODO Basic Settings</p>
</PanelBody>
</Panel>
<FormPlacementPanel />
<Panel>
<PanelBody title={MailPoet.I18n.t('customCss')} initialOpen={false}>
<p>TODO Custom CSS</p>
</PanelBody>
</Panel>
</>
);

View File

@@ -6,7 +6,7 @@ import PropTypes from 'prop-types';
import classnames from 'classnames';
import MailPoet from 'mailpoet';
import BlockSettings from './block_settings.jsx';
import FormSettings from './form_settings.jsx';
import FormSettings from './form_settings/form_settings.jsx';
const SidebarHeader = ({ children, closeSidebar }) => (
<>