ES6 rules
This commit is contained in:
@@ -12,7 +12,7 @@ function printData(data) {
|
|||||||
const printableData = Object.keys(data).map(key => `${key}: ${data[key]}`);
|
const printableData = Object.keys(data).map(key => `${key}: ${data[key]}`);
|
||||||
|
|
||||||
return (<textarea
|
return (<textarea
|
||||||
readOnly={true}
|
readOnly
|
||||||
onFocus={handleFocus}
|
onFocus={handleFocus}
|
||||||
value={printableData.join('\n')}
|
value={printableData.join('\n')}
|
||||||
style={{
|
style={{
|
||||||
|
@@ -22,7 +22,7 @@ const tabs = [
|
|||||||
];
|
];
|
||||||
|
|
||||||
function Tabs(props) {
|
function Tabs(props) {
|
||||||
const tabLinks = tabs.map((tab, index) => {
|
const tabLinks = tabs.map((tab) => {
|
||||||
const tabClasses = classNames(
|
const tabClasses = classNames(
|
||||||
'nav-tab',
|
'nav-tab',
|
||||||
{ 'nav-tab-active': (props.tab === tab.name) }
|
{ 'nav-tab-active': (props.tab === tab.name) }
|
||||||
@@ -30,7 +30,7 @@ function Tabs(props) {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<Link
|
<Link
|
||||||
key={`tab-${index}`}
|
key={`tab-${tab.name}`}
|
||||||
className={tabClasses}
|
className={tabClasses}
|
||||||
to={tab.link}
|
to={tab.link}
|
||||||
>{ tab.label }</Link>
|
>{ tab.label }</Link>
|
||||||
|
@@ -1,120 +1,114 @@
|
|||||||
define([
|
import React from 'react';
|
||||||
'react',
|
import MailPoet from 'mailpoet';
|
||||||
'mailpoet',
|
|
||||||
],
|
|
||||||
(
|
|
||||||
React,
|
|
||||||
MailPoet
|
|
||||||
) => {
|
|
||||||
const ListingBulkActions = React.createClass({
|
|
||||||
getInitialState: function getInitialState() {
|
|
||||||
return {
|
|
||||||
action: false,
|
|
||||||
extra: false,
|
|
||||||
};
|
|
||||||
},
|
|
||||||
handleChangeAction: function handleChangeAction(e) {
|
|
||||||
this.setState({
|
|
||||||
action: e.target.value,
|
|
||||||
extra: false,
|
|
||||||
}, () => {
|
|
||||||
const action = this.getSelectedAction();
|
|
||||||
|
|
||||||
// action on select callback
|
|
||||||
if (action !== null && action.onSelect !== undefined) {
|
|
||||||
this.setState({
|
|
||||||
extra: action.onSelect(e),
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
},
|
|
||||||
handleApplyAction: function handleApplyAction(e) {
|
|
||||||
e.preventDefault();
|
|
||||||
|
|
||||||
|
const ListingBulkActions = React.createClass({
|
||||||
|
getInitialState: function getInitialState() {
|
||||||
|
return {
|
||||||
|
action: false,
|
||||||
|
extra: false,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
handleChangeAction: function handleChangeAction(e) {
|
||||||
|
this.setState({
|
||||||
|
action: e.target.value,
|
||||||
|
extra: false,
|
||||||
|
}, () => {
|
||||||
const action = this.getSelectedAction();
|
const action = this.getSelectedAction();
|
||||||
|
|
||||||
if (action === null) {
|
// action on select callback
|
||||||
return;
|
if (action !== null && action.onSelect !== undefined) {
|
||||||
|
this.setState({
|
||||||
|
extra: action.onSelect(e),
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
handleApplyAction: function handleApplyAction(e) {
|
||||||
|
e.preventDefault();
|
||||||
|
|
||||||
const selectedIds = (this.props.selection !== 'all')
|
const action = this.getSelectedAction();
|
||||||
? this.props.selected_ids
|
|
||||||
: [];
|
|
||||||
|
|
||||||
const data = (action.getData !== undefined)
|
if (action === null) {
|
||||||
? action.getData()
|
return;
|
||||||
: {};
|
}
|
||||||
|
|
||||||
data.action = this.state.action;
|
const selectedIds = (this.props.selection !== 'all')
|
||||||
|
? this.props.selected_ids
|
||||||
|
: [];
|
||||||
|
|
||||||
let onSuccess = () => {};
|
const data = (action.getData !== undefined)
|
||||||
if (action.onSuccess !== undefined) {
|
? action.getData()
|
||||||
onSuccess = action.onSuccess;
|
: {};
|
||||||
|
|
||||||
|
data.action = this.state.action;
|
||||||
|
|
||||||
|
let onSuccess = () => {};
|
||||||
|
if (action.onSuccess !== undefined) {
|
||||||
|
onSuccess = action.onSuccess;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (data.action) {
|
||||||
|
const promise = this.props.onBulkAction(selectedIds, data);
|
||||||
|
if (promise !== false) {
|
||||||
|
promise.then(onSuccess);
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
if (data.action) {
|
this.setState({
|
||||||
const promise = this.props.onBulkAction(selectedIds, data);
|
action: false,
|
||||||
if (promise !== false) {
|
extra: false,
|
||||||
promise.then(onSuccess);
|
});
|
||||||
}
|
},
|
||||||
}
|
getSelectedAction: function getSelectedAction() {
|
||||||
|
const selectedAction = this.action.value;
|
||||||
this.setState({
|
if (selectedAction.length > 0) {
|
||||||
action: false,
|
const action = this.props.bulk_actions.filter(act => (act.name === selectedAction));
|
||||||
extra: false,
|
|
||||||
});
|
if (action.length > 0) {
|
||||||
},
|
return action[0];
|
||||||
getSelectedAction: function getSelectedAction() {
|
|
||||||
const selectedAction = this.action.value;
|
|
||||||
if (selectedAction.length > 0) {
|
|
||||||
const action = this.props.bulk_actions.filter(act => (act.name === selectedAction));
|
|
||||||
|
|
||||||
if (action.length > 0) {
|
|
||||||
return action[0];
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
return null;
|
||||||
|
},
|
||||||
|
render: function render() {
|
||||||
|
if (this.props.bulk_actions.length === 0) {
|
||||||
return null;
|
return null;
|
||||||
},
|
}
|
||||||
render: function render() {
|
|
||||||
if (this.props.bulk_actions.length === 0) {
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="alignleft actions bulkactions">
|
<div className="alignleft actions bulkactions">
|
||||||
<label
|
<label
|
||||||
className="screen-reader-text"
|
className="screen-reader-text"
|
||||||
htmlFor="bulk-action-selector-top"
|
htmlFor="bulk-action-selector-top"
|
||||||
>
|
>
|
||||||
{MailPoet.I18n.t('selectBulkAction')}
|
{MailPoet.I18n.t('selectBulkAction')}
|
||||||
</label>
|
</label>
|
||||||
|
|
||||||
<select
|
<select
|
||||||
name="bulk_actions"
|
name="bulk_actions"
|
||||||
ref={(c) => { this.action = c; }}
|
ref={(c) => { this.action = c; }}
|
||||||
value={this.state.action}
|
value={this.state.action}
|
||||||
onChange={this.handleChangeAction}
|
onChange={this.handleChangeAction}
|
||||||
>
|
>
|
||||||
<option value="">{MailPoet.I18n.t('bulkActions')}</option>
|
<option value="">{MailPoet.I18n.t('bulkActions')}</option>
|
||||||
{ this.props.bulk_actions.map((action, index) => (
|
{ this.props.bulk_actions.map(action => (
|
||||||
<option
|
<option
|
||||||
value={action.name}
|
value={action.name}
|
||||||
key={`action-${index}`}
|
key={`action-${action.name}`}
|
||||||
>{ action.label }</option>
|
>{ action.label }</option>
|
||||||
)) }
|
)) }
|
||||||
</select>
|
</select>
|
||||||
<input
|
<input
|
||||||
onClick={this.handleApplyAction}
|
onClick={this.handleApplyAction}
|
||||||
type="submit"
|
type="submit"
|
||||||
defaultValue={MailPoet.I18n.t('apply')}
|
defaultValue={MailPoet.I18n.t('apply')}
|
||||||
className="button action"
|
className="button action"
|
||||||
/>
|
/>
|
||||||
|
|
||||||
{ this.state.extra }
|
{ this.state.extra }
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
});
|
|
||||||
|
|
||||||
return ListingBulkActions;
|
|
||||||
});
|
});
|
||||||
|
|
||||||
|
export default ListingBulkActions;
|
||||||
|
Reference in New Issue
Block a user