public/mailtrain
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

Work in progress on supporting languages in custom forms

Browse source
This commit is contained in:
Tomas Bures 2018-11-18 22:53:34 +01:00
parent ec299053ba
commit f7cbcf871d
4 changed files with 28 additions and 10 deletions
Download patch file Download diff file Expand all files Collapse all files

3
client/src/lib/i18n.js
View file

@ -45,7 +45,8 @@ i18n
},
react: {
wait: true
wait: true,
defaultTransParent: 'span' // This is because we use React < v16
},
detection: {

15
client/src/lists/forms/CUD.js
View file

@ -16,6 +16,7 @@ import {
AlignedRow,
Button,
ButtonRow,
CheckBox,
Dropdown,
Fieldset,
Form,
@ -33,6 +34,7 @@ import {
import {DeleteModalDialog} from "../../lib/modals";
import mailtrainConfig
from 'mailtrainConfig';
import {langCodes} from "../../../../shared/langs";
@withTranslation()
@withForm
@ -82,7 +84,7 @@ export default class CUD extends Component {
const t = props.t;
const helpEmailText = t('thePlaintextVersionForThisEmail');
const helpMjmlGeneral = <Trans i18nKey="customFormsUseMjmlForFormattingSeeThe">Custom forms use MJML for formatting. See the MJML documentation <a className="mjml-documentation">here</a></Trans>;
const helpMjmlGeneral = <Trans i18nKey="customFormsUseMjmlForFormattingSeeThe">Custom forms use MJML for formatting. See the MJML documentation <a className="mjml-documentation" href="https://mjml.io/documentation/">here</a></Trans>;
this.templateSettings = {
layout: {
@ -283,6 +285,7 @@ export default class CUD extends Component {
name: '',
description: '',
selectedTemplate: 'layout',
selectedLanguage: '',
namespace: mailtrainConfig.user.namespace
};
supplyDefaults(data);
@ -378,6 +381,11 @@ export default class CUD extends Component {
});
}
const langOptions = [{key: '', label: t('Default')}];
for (const lng of mailtrainConfig.enabledLanguages) {
langOptions.push({key: lng, label: langCodes[lng].getLabel(t)});
}
const listsColumns = [
{ data: 0, title: "#" },
@ -388,6 +396,7 @@ export default class CUD extends Component {
const previewListId = this.getFormValue('previewList');
const selectedTemplate = this.getFormValue('selectedTemplate');
const selectedLanguage = this.getFormValue('selectedLanguage');
return (
<div>
@ -448,8 +457,10 @@ export default class CUD extends Component {
{ selectedTemplate &&
<Fieldset label={t('templates')}>
<Dropdown id="selectedLanguage" label={t('Language')} options={langOptions}/>
<CheckBox id={'languageEnabled_' + selectedLanguage} text={t('Enabled')}/>
<Dropdown id="selectedTemplate" label={t('edit')} options={templateOptGroups} help={this.templateSettings[selectedTemplate].help}/>
<ACEEditor id={selectedTemplate} height="500px" mode={this.templateSettings[selectedTemplate].mode}/>
<ACEEditor id={(selectedLanguage ? selectedLanguage + ':' : '') + selectedTemplate} height="500px" mode={this.templateSettings[selectedTemplate].mode}/>
</Fieldset>
}

2
locales/extract.js
View file

@ -145,7 +145,7 @@ function parseSpec(specStr) {
}
// see http://blog.stevenlevithan.com/archives/match-quoted-string
const tMatcher = /(^|[ {+(=])((?:tUI|tLog|t|tMark)\s*\(\s*(?:\/\*(.*?)\*\/)?\s*)(["'])((?:(?!\4)[^\\]|\\.)*)(\4)/;
const tMatcher = /(^|[ {+(=.])((?:tUI|tLog|t|tMark)\s*\(\s*(?:\/\*(.*?)\*\/)?\s*)(["'])((?:(?!\4)[^\\]|\\.)*)(\4)/;
const transMatcher = /(\/\*(.*?)\*\/\s*)?(\<Trans[ >][\s\S]*?\<\/Trans\>)/;
const jsxParser = acorn.Parser.extend(acornJsx());

18
server/models/forms.js
View file

@ -7,7 +7,6 @@ const dtHelpers = require('../lib/dt-helpers');
const interoperableErrors = require('../../shared/interoperable-errors');
const shares = require('./shares');
const namespaceHelpers = require('../lib/namespace-helpers');
const bluebird = require('bluebird');
const fs = require('fs-extra');
const path = require('path');
const mjml = require('mjml');
@ -189,7 +188,7 @@ async function getDefaultCustomFormValues() {
async function getContents(fileName) {
try {
const template = await fs.readFile(path.join(basePath, fileName), 'utf8');
return await fs.readFile(path.join(basePath, fileName), 'utf8');
} catch (err) {
return false;
}
@ -205,12 +204,13 @@ async function getDefaultCustomFormValues() {
}
form.layout = await getContents('views/subscription/layout.mjml.hbs') || '';
form.form_input_style = await getContents('static/subscription/form-input-style.css') || '@import url(/subscription/form-input-style.css);';
form.form_input_style = await getContents('../client/static/subscription/form-input-style.css') || '@import url(/subscription/form-input-style.css);';
return form;
}
// TODO - this could run in the browser too - move to shared
function checkForMjmlErrors(form) {
let testLayout = '<mjml><mj-body><mj-container>{{{body}}}</mj-container></mj-body></mjml>';
@ -234,9 +234,15 @@ function checkForMjmlErrors(form) {
const template = form[key];
const errs = hasMjmlError(template);
const msgs = errs.map(x => x.formattedMessage);
let msgs;
if (Array.isArray(errs)) {
msgs = errs.map(x => x.formattedMessage)
} else {
msgs = [ errs.message ];
}
if (key === 'mail_confirm_html' && !template.includes('{{confirmUrl}}')) {
msgs.push('Missing {{confirmUrl}}');
msgs.push('Missing {{confirmUrl}}'); // TODO - add localization support
}
if (msgs.length) {
@ -255,7 +261,7 @@ function checkForMjmlErrors(form) {
}
if (!layout.includes('{{{body}}}')) {
msgs.push(`{{{body}}} not found`);
msgs.push(`{{{body}}} not found`); // TODO - add localization support
}
if (msgs.length) {