Cavemanon/piratepoet
8
Fork 0
Code Pull Requests Actions Releases 16 Activity

Display preview modes switches

Browse Source 
[MAILPOET-2602]
This commit is contained in:
Pavel Dohnal
2020-02-11 09:23:06 +01:00
committed by Jack Kitterhing
parent bf9ddc10cb
commit e534997d48
6 changed files with 87 additions and 59 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
assets/js/src/common/preview.jsx
View File

@@ -1,14 +1,37 @@
import React from 'react';
import React, { useState } from 'react';
import PropTypes from 'prop-types';
import MailPoet from 'mailpoet';
function Preview({
children,
}) {
const [checked, setChecked] = useState('desktop');
return (
<>
<div className="mailpoet_browser_preview">
<div className="mailpoet_browser_preview_toggle">
<label>
<input
type="radio"
name="mailpoet_browser_preview_type"
className="mailpoet_browser_preview_type"
checked={checked === 'desktop'}
onChange={() => setChecked('desktop')}
/>
{MailPoet.I18n.t('formPreviewDesktop')}
</label>
<label>
<input
type="radio"
name="mailpoet_browser_preview_type"
className="mailpoet_browser_preview_type"
checked={checked !== 'desktop'}
onChange={() => setChecked('mobile')}
/>
{MailPoet.I18n.t('formPreviewMobile')}
</label>
</div>
{children}
</>
</div>
);
}

18
assets/js/src/form_editor/components/preview.jsx
View File

@@ -56,13 +56,13 @@ const FormPreview = () => {
title={MailPoet.I18n.t('formPreview')}
onRequestClose={onClose}
>
<Preview>
{form === null && (
<div className="mailpoet_spinner_wrapper">
<Spinner />
</div>
)}
{form !== null && (
{form === null && (
<div className="mailpoet_spinner_wrapper">
<Spinner />
</div>
)}
{form !== null && (
<Preview>
<div>
<style type="text/css">
{'.mailpoet_hp_email_label { display: none }' }
@@ -74,8 +74,8 @@ const FormPreview = () => {
</div>
<div dangerouslySetInnerHTML={{ __html: form.html }} />
</div>
)}
</Preview>
</Preview>
)}
</Modal>
);
};