Fix prefer-template eslint rule in ES6 files

[MAILPOET-1139]
This commit is contained in:
Pavel Dohnal
2017-12-06 14:18:24 +00:00
parent e7ddfc3d29
commit 170fd7f051
26 changed files with 58 additions and 59 deletions

View File

@ -40,7 +40,6 @@
"jsx-a11y/alt-text": 0,
"func-names": 0,
"object-shorthand": 0,
"prefer-template": 0,
"default-case": 0,
"array-callback-return": 0,
"consistent-return": 0,

View File

@ -19,7 +19,7 @@ define([
const isChecked = !!(Number(this.props.item[this.props.field.name]));
const options = Object.keys(this.props.field.values).map(
(value, index) => (
<p key={'checkbox-' + index}>
<p key={`checkbox-${index}`}>
<label>
<input
ref="checkbox"

View File

@ -72,14 +72,14 @@ define([
if (inline === true) {
return (
<span key={'field-' + (data.index || 0)}>
<span key={`field-${data.index || 0}`}>
{ field }
{ description }
</span>
);
}
return (
<div key={'field-' + (data.index || 0)}>
<div key={`field-${data.index || 0}`}>
{ field }
{ description }
</div>
@ -110,7 +110,7 @@ define([
<tr>
<th scope="row">
<label
htmlFor={'field_' + this.props.field.name}
htmlFor={`field_${this.props.field.name}`}
>
{ this.props.field.label }
{ tip }

View File

@ -13,7 +13,7 @@ define([
const selected_value = this.props.item[this.props.field.name];
const options = Object.keys(this.props.field.values).map(
(value, index) => (
<p key={'radio-' + index}>
<p key={`radio-${index}`}>
<label>
<input
type="radio"

View File

@ -49,7 +49,7 @@ const FormFieldSelect = React.createClass({
return (
<option
key={'option-' + index}
key={`option-${index}`}
value={value}>
{ this.props.field.values[value] }
</option>
@ -60,7 +60,7 @@ const FormFieldSelect = React.createClass({
return (
<select
name={this.props.field.name}
id={'field_' + this.props.field.name}
id={`field_${this.props.field.name}`}
value={this.props.item[this.props.field.name]}
onChange={this.props.onValueChange}
{...this.props.field.validation}

View File

@ -35,7 +35,7 @@ define([
(this.props.item !== undefined && prevProps.item !== undefined)
&& (this.props.item.id !== prevProps.item.id)
) {
jQuery('#' + this.refs.select.id)
jQuery(`#${this.refs.select.id}`)
.val(this.getSelectedValues())
.trigger('change');
}
@ -47,7 +47,7 @@ define([
},
destroySelect2: function () {
if (this.isSelect2Initialized()) {
jQuery('#' + this.refs.select.id).select2('destroy');
jQuery(`#${this.refs.select.id}`).select2('destroy');
}
},
setupSelect2: function () {
@ -55,7 +55,7 @@ define([
return;
}
const select2 = jQuery('#' + this.refs.select.id).select2({
const select2 = jQuery(`#${this.refs.select.id}`).select2({
width: (this.props.width || ''),
templateResult: function (item) {
if (item.element && item.element.selected) {
@ -97,8 +97,8 @@ define([
return null;
},
loadCachedItems: function () {
if (typeof (window['mailpoet_' + this.props.field.endpoint]) !== 'undefined') {
let items = window['mailpoet_' + this.props.field.endpoint];
if (typeof (window[`mailpoet_${this.props.field.endpoint}`]) !== 'undefined') {
let items = window[`mailpoet_${this.props.field.endpoint}`];
if (this.props.field.filter !== undefined) {
@ -114,7 +114,7 @@ define([
let value;
if (this.props.onValueChange !== undefined) {
if (this.props.field.multiple) {
value = jQuery('#' + this.refs.select.id).val();
value = jQuery(`#${this.refs.select.id}`).val();
} else {
value = e.target.value;
}
@ -162,7 +162,7 @@ define([
return (
<option
key={'option-' + index}
key={`option-${index}`}
value={value}
title={searchLabel}
>

View File

@ -22,7 +22,7 @@ const FormFieldText = React.createClass({
: false
}
name={this.props.field.name}
id={'field_' + this.props.field.name}
id={`field_${this.props.field.name}`}
value={value}
placeholder={this.props.field.placeholder}
onChange={this.props.onValueChange}

View File

@ -11,7 +11,7 @@ define([
type="text"
className="regular-text"
name={this.props.field.name}
id={'field_' + this.props.field.name}
id={`field_${this.props.field.name}`}
value={this.props.item[this.props.field.name]}
placeholder={this.props.field.placeholder}
defaultValue={this.props.field.defaultValue}

View File

@ -156,7 +156,7 @@ define(
let errors;
if (this.getErrors() !== undefined) {
errors = this.getErrors().map((error, index) => (
<p key={'error-' + index} className="mailpoet_error">
<p key={`error-${index}`} className="mailpoet_error">
{ error.message }
</p>
));
@ -193,7 +193,7 @@ define(
field={field}
item={this.getValues()}
onValueChange={onValueChange}
key={'field-' + i} />
key={`field-${i}`} />
);
});

View File

@ -149,7 +149,7 @@ const FormList = React.createClass({
let segments = window.mailpoet_segments.filter(segment => (jQuery.inArray(segment.id, form.segments) !== -1)).map(segment => segment.name).join(', ');
if (form.settings.segments_selected_by === 'user') {
segments = MailPoet.I18n.t('userChoice') + ' ' + segments;
segments = `${MailPoet.I18n.t('userChoice')} ${segments}`;
}
return (

View File

@ -20,7 +20,7 @@ function renderStatusMessage(status, error, link) {
}
return (
<div className={'mailpoet_notice notice inline notice-' + noticeType} style={{ marginTop: '1em' }}>
<div className={`mailpoet_notice notice inline notice-${noticeType}`} style={{ marginTop: '1em' }}>
<p>{noticeMessage}</p>
</div>
);

View File

@ -30,7 +30,7 @@ function Tabs(props) {
return (
<Link
key={'tab-' + index}
key={`tab-${index}`}
className={tabClasses}
to={tab.link}
>{ tab.label }</Link>

View File

@ -98,7 +98,7 @@ define([
{ this.props.bulk_actions.map((action, index) => (
<option
value={action.name}
key={'action-' + index}
key={`action-${index}`}
>{ action.label }</option>
)) }
</select>

View File

@ -12,7 +12,7 @@ define([
handleFilterAction: function () {
const filters = {};
this.getAvailableFilters().map((filter, i) => {
filters[this.refs['filter-' + i].name] = this.refs['filter-' + i].value;
filters[this.refs[`filter-${i}`].name] = this.refs[`filter-${i}`].value;
});
if (this.props.onBeforeSelectFilter) {
this.props.onBeforeSelectFilter(filters);
@ -37,7 +37,7 @@ define([
this.getAvailableFilters().map(
(filter, i) => {
if (selected_filters[filter] !== undefined && selected_filters[filter]) {
jQuery(this.refs['filter-' + i])
jQuery(this.refs[`filter-${i}`])
.val(selected_filters[filter])
.trigger('change');
}
@ -56,7 +56,7 @@ define([
{ filters[filter].map((option, j) => (
<option
value={option.value}
key={'filter-option-' + j}
key={`filter-option-${j}`}
>{ option.label }</option>
)) }
</select>

View File

@ -19,7 +19,7 @@ const ListingHeader = React.createClass({
<ListingColumn
onSort={this.props.onSort}
sort_by={this.props.sort_by}
key={'column-' + index}
key={`column-${index}`}
column={renderColumn} />
);
});

View File

@ -44,7 +44,7 @@ const ListingItem = React.createClass({
checkbox = (
<th className="check-column" scope="row">
<label className="screen-reader-text">{
'Select ' + this.props.item[this.props.columns[0].name]
`Select ${this.props.item[this.props.columns[0].name]}`
}</label>
<input
type="checkbox"
@ -74,7 +74,7 @@ const ListingItem = React.createClass({
if (action.name === 'trash') {
custom_action = (
<span key={'action-' + index} className="trash">
<span key={`action-${index}`} className="trash">
{(!is_first) ? ' | ' : ''}
<a
href="javascript:;"
@ -90,7 +90,7 @@ const ListingItem = React.createClass({
custom_action = (
<span
onClick={this.props.onRefreshItems}
key={'action-' + index} className={action.name}>
key={`action-${index}`} className={action.name}>
{(!is_first) ? ' | ' : ''}
{ action.link(this.props.item) }
</span>
@ -98,7 +98,7 @@ const ListingItem = React.createClass({
} else if (action.link) {
custom_action = (
<span
key={'action-' + index} className={action.name}>
key={`action-${index}`} className={action.name}>
{(!is_first) ? ' | ' : ''}
{ action.link(this.props.item) }
</span>
@ -106,7 +106,7 @@ const ListingItem = React.createClass({
} else {
custom_action = (
<span
key={'action-' + index} className={action.name}>
key={`action-${index}`} className={action.name}>
{(!is_first) ? ' | ' : ''}
<a href="javascript:;" onClick={
(action.onClick !== undefined)
@ -186,7 +186,7 @@ const ListingItem = React.createClass({
const row_classes = classNames({ 'is-expanded': this.state.expanded });
return (
<tr className={row_classes} data-automation-id={'listing_item_' + this.props.item.id}>
<tr className={row_classes} data-automation-id={`listing_item_${this.props.item.id}`}>
{ checkbox }
{ this.props.onRenderItem(this.props.item, actions) }
</tr>
@ -418,8 +418,8 @@ const Listing = React.createClass({
if (ret.indexOf(':') !== -1) {
const params = this.getParams();
Object.keys(params).map((key) => {
if (ret.indexOf(':' + key) !== -1) {
ret = ret.replace(':' + key, params[key]);
if (ret.indexOf(`:${key}`) !== -1) {
ret = ret.replace(`:${key}`, params[key]);
}
});
}

View File

@ -53,7 +53,7 @@ define(
}
return (
<span key={'step-' + index}>
<span key={`step-${index}`}>
<span className={stepClasses}>
{ label }
</span>

View File

@ -19,8 +19,8 @@ const QueueMixin = {
newsletter_id: newsletter.id,
},
}).done(() => {
jQuery('#resume_' + newsletter.id).show();
jQuery('#pause_' + newsletter.id).hide();
jQuery(`#resume_${newsletter.id}`).show();
jQuery(`#pause_${newsletter.id}`).hide();
}).fail((response) => {
if (response.errors.length > 0) {
MailPoet.Notice.error(
@ -39,8 +39,8 @@ const QueueMixin = {
newsletter_id: newsletter.id,
},
}).done(() => {
jQuery('#pause_' + newsletter.id).show();
jQuery('#resume_' + newsletter.id).hide();
jQuery(`#pause_${newsletter.id}`).show();
jQuery(`#resume_${newsletter.id}`).hide();
}).fail((response) => {
if (response.errors.length > 0) {
MailPoet.Notice.error(
@ -95,7 +95,7 @@ const QueueMixin = {
{ newsletter.queue.count_processed } / { newsletter.queue.count_total }
&nbsp;&nbsp;
<a
id={'resume_' + newsletter.id}
id={`resume_${newsletter.id}`}
className="button"
style={{ display: (newsletter.queue.status === 'paused')
? 'inline-block' : 'none' }}
@ -103,7 +103,7 @@ const QueueMixin = {
onClick={this.resumeSending.bind(null, newsletter)}
>{MailPoet.I18n.t('resume')}</a>
<a
id={'pause_' + newsletter.id}
id={`pause_${newsletter.id}`}
className="button mailpoet_pause"
style={{ display: (newsletter.queue.status === null)
? 'inline-block' : 'none' }}
@ -128,7 +128,7 @@ const QueueMixin = {
<div className={progressClasses}>
<span
className="mailpoet_progress_bar"
style={{ width: progress_bar_width + '%' }}
style={{ width: `${progress_bar_width}%` }}
></span>
<span className="mailpoet_progress_label">
{ percentage }
@ -393,8 +393,8 @@ const MailerMixin = {
.replace('%$1s', state.meta.mta_log.error.error_message);
}
if (state.meta.mta_log.error.error_code) {
mailer_error_notice += ' ' + MailPoet.I18n.t('mailerErrorCode')
.replace('%$1s', state.meta.mta_log.error.error_code);
mailer_error_notice += ` ${MailPoet.I18n.t('mailerErrorCode')
.replace('%$1s', state.meta.mta_log.error.error_code)}`;
}
return (
<div>

View File

@ -35,7 +35,7 @@ const ListingTabs = React.createClass({
return (
<Link
key={'tab-' + index}
key={`tab-${index}`}
className={tabClasses}
to={tab.link}
onClick={() => MailPoet.trackEvent(`Tab Emails > ${tab.name} clicked`,

View File

@ -238,7 +238,7 @@ const NewsletterListWelcome = React.createClass({
);
break;
}
sendingEvent += ' [' + sendingDelay + ']';
sendingEvent += ` [${sendingDelay}]`;
}
// add a "period" at the end if we do have a sendingEvent
sendingEvent += '.';

View File

@ -120,7 +120,7 @@ define(
MailPoet.trackEvent('Emails > Welcome email activated', {
'MailPoet Free version': window.mailpoet_version,
'List type': opts.event,
Delay: opts.afterTimeNumber + ' ' + opts.afterTimeType,
Delay: `${opts.afterTimeNumber} ${opts.afterTimeType}`,
});
} else if (response2.data.type === 'notification') {
MailPoet.Notice.success(
@ -324,7 +324,7 @@ define(
&nbsp;{MailPoet.I18n.t('orSimply')}&nbsp;
<a
href={
'?page=mailpoet-newsletter-editor&id=' + this.props.params.id
`?page=mailpoet-newsletter-editor&id=${this.props.params.id}`
}
onClick={this.handleRedirectToDesign}>
{MailPoet.I18n.t('goBackToDesign')}

View File

@ -42,7 +42,7 @@ define(
return !segment.deleted_at;
},
getLabel: function (segment) {
return segment.name + ' (' + parseInt(segment.subscribers, 10).toLocaleString() + ')';
return `${segment.name} (${parseInt(segment.subscribers, 10).toLocaleString()})`;
},
transformChangedValue: function (segment_ids) {
const all_segments = this.state.items;

View File

@ -16,7 +16,7 @@ define(
const jQuery = jq;
const currentTime = window.mailpoet_current_time || '00:00';
const defaultDateTime = window.mailpoet_current_date + ' 00:00:00';
const defaultDateTime = `${window.mailpoet_current_date} 00:00:00`;
const timeOfDayItems = window.mailpoet_schedule_time_of_day;
const dateDisplayFormat = window.mailpoet_date_display_format;
const dateStorageFormat = window.mailpoet_date_storage_format;
@ -170,7 +170,7 @@ define(
const options = Object.keys(timeOfDayItems).map(
(value, index) => (
<option
key={'option-' + index}
key={`option-${index}`}
value={value}>
{ timeOfDayItems[value] }
</option>
@ -348,7 +348,7 @@ define(
return !segment.deleted_at;
},
getLabel: function (segment) {
return segment.name + ' (' + parseInt(segment.subscribers, 10).toLocaleString() + ')';
return `${segment.name} (${parseInt(segment.subscribers, 10).toLocaleString()})`;
},
transformChangedValue: function (segment_ids) {
const all_segments = this.state.items;

View File

@ -151,7 +151,7 @@ const NewsletterTemplates = React.createClass({
},
}).done((response) => {
// TODO: Move this URL elsewhere
window.location = 'admin.php?page=mailpoet-newsletter-editor&id=' + response.data.id;
window.location = `admin.php?page=mailpoet-newsletter-editor&id=${response.data.id}`;
}).fail((response) => {
if (response.errors.length > 0) {
MailPoet.Notice.error(
@ -229,7 +229,7 @@ const NewsletterTemplates = React.createClass({
}
return (
<li key={'template-' + index}>
<li key={`template-${index}`}>
<div className="mailpoet_thumbnail">
{ thumbnail }
</div>
@ -249,7 +249,7 @@ const NewsletterTemplates = React.createClass({
&nbsp;
<a
className="button button-primary"
data-automation-id={'select_template_' + index}
data-automation-id={`select_template_${index}`}
onClick={this.handleSelectTemplate.bind(null, template)}
>
{MailPoet.I18n.t('select')}

View File

@ -22,7 +22,7 @@ const events = {
const availableSegmentValues = _.object(_.map(
availableSegments,
(segment) => {
const name = segment.name + ' (' + parseInt(segment.subscribers, 10).toLocaleString() + ')';
const name = `${segment.name} (${parseInt(segment.subscribers, 10).toLocaleString()})`;
return [segment.id, name];
}
));

View File

@ -78,7 +78,7 @@ define(
return !!(!segment.deleted_at && segment.type === 'default');
},
getLabel: function (segment) {
return segment.name + ' (' + segment.subscribers + ')';
return `${segment.name} (${segment.subscribers})`;
},
getSearchLabel: function (segment, subscriber) {
let label = '';
@ -110,7 +110,7 @@ define(
const custom_fields = window.mailpoet_custom_fields || [];
custom_fields.map((custom_field) => {
const field = {
name: 'cf_' + custom_field.id,
name: `cf_${custom_field.id}`,
label: custom_field.name,
type: custom_field.type,
};