Create mailchimp component in react

[MAILPOET-1808]
This commit is contained in:
Pavel Dohnal
2019-04-11 14:35:50 +02:00
committed by M. Shull
parent 8d6b05a80e
commit 1a4b0f2785
2 changed files with 26 additions and 6 deletions

View File

@@ -1,21 +1,39 @@
import React from 'react'; import React, { useState } from 'react';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import MailPoet from 'mailpoet'; import MailPoet from 'mailpoet';
const MethodMailChimp = ({ setInputValid }) => { const MethodMailChimp = ({ setInputValid, setInputInvalid, onValueChange }) => {
const [key, setKey] = useState('');
return ( return (
<div> <>
MethodMailChimp <label htmlFor="paste_input" className="import_method_paste">
</div> <div>
<span className="import_heading">{MailPoet.I18n.t('methodMailChimpLabel')}</span>
</div>
<input
id="paste_input"
type="text"
onChange={setKey}
/>
<button className="button" type="button">
{MailPoet.I18n.t('methodMailChimpVerify')}
</button>
<span className="mailpoet_mailchimp-key-status"></span>
</label>
</>
); );
}; };
MethodMailChimp.propTypes = { MethodMailChimp.propTypes = {
setInputValid: PropTypes.func, setInputValid: PropTypes.func,
setInputInvalid: PropTypes.func,
onValueChange: PropTypes.func.isRequired,
}; };
MethodMailChimp.defaultProps = { MethodMailChimp.defaultProps = {
setInputValid: () => {}, setInputValid: () => {},
setInputInvalid: () => {},
}; };
export default MethodMailChimp; export default MethodMailChimp;

View File

@@ -26,7 +26,7 @@
importData = {}, importData = {},
mailpoetColumnsSelect2 = <%= subscriberFieldsSelect2|raw %>, mailpoetColumnsSelect2 = <%= subscriberFieldsSelect2|raw %>,
mailpoetColumns = <%= subscriberFields|raw %>, mailpoetColumns = <%= subscriberFields|raw %>,
mailpoetSegments = <%= segments|raw %> mailpoetSegments = <%= segments|raw %>;
<% set newUser = (is_new_user == true) ? 'true' : 'false' %> <% set newUser = (is_new_user == true) ? 'true' : 'false' %>
var mailpoet_is_new_user = <%= newUser %>; var mailpoet_is_new_user = <%= newUser %>;
</script> </script>
@@ -97,6 +97,8 @@
'methodPaste': __('Paste the data into a text box'), 'methodPaste': __('Paste the data into a text box'),
'methodUpload': __('Upload a file'), 'methodUpload': __('Upload a file'),
'methodMailChimp': __('Import from MailChimp'), 'methodMailChimp': __('Import from MailChimp'),
'methodMailChimpLabel': __('Enter your MailChimp API key'),
'methodMailChimpVerify': __('Verify'),
'pasteLabel': __('Copy and paste your subscribers from Excel/Spreadsheets'), 'pasteLabel': __('Copy and paste your subscribers from Excel/Spreadsheets'),
'pasteDescription': __('This file needs to be formatted in a CSV style (comma-separated-values.) Look at some [link]examples on our support site[/link].'), 'pasteDescription': __('This file needs to be formatted in a CSV style (comma-separated-values.) Look at some [link]examples on our support site[/link].'),
'methodSelectionHead': __('How would you like to import subscribers?') 'methodSelectionHead': __('How would you like to import subscribers?')