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

Updated all React components to their latest version

Browse Source 
- updated code due to deprecated warnings (mostly router stuff & input default value)
- set default sender based on settings when creating new newsletter
- fixed erroneous UTC offset when displaying dates (PHP takes care of it)
This commit is contained in:
Jonathan Labreuille
2016-04-28 16:54:43 +02:00
parent 59199140bf
commit 4047b41a7f
26 changed files with 128 additions and 109 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
assets/js/src/date.js
View File

@@ -41,9 +41,7 @@ define('date',
},
format: function(date, options) {
this.init(options);
return Moment.utc(date)
.local()
.format(this.convertFormat(this.options.format));
return Moment(date).format(this.convertFormat(this.options.format));
},
short: function(date) {
return this.format(date, {

6
assets/js/src/form/fields/text.jsx
View File

@@ -7,7 +7,10 @@ function(
var FormFieldText = React.createClass({
render: function() {
var value = this.props.item[this.props.field.name];
if(!value) { value = null; }
if(value === undefined) {
value = this.props.field.defaultValue || '';
}
return (
<input
type="text"
@@ -21,7 +24,6 @@ function(
id={ 'field_'+this.props.field.name }
value={ value }
placeholder={ this.props.field.placeholder }
defaultValue={ this.props.field.defaultValue }
onChange={ this.props.onValueChange }
{...this.props.field.validation}
/>

20
assets/js/src/form/form.jsx
View File

@@ -13,10 +13,11 @@ define(
Router,
FormField
) {
var Form = React.createClass({
mixins: [
Router.History
],
contextTypes: {
router: React.PropTypes.object.isRequired
},
getDefaultProps: function() {
return {
params: {},
@@ -68,7 +69,7 @@ define(
loading: false,
item: {}
}, function() {
this.history.pushState(null, '/new');
this.context.router.push('/new');
}.bind(this));
} else {
this.setState({
@@ -118,7 +119,16 @@ define(
if(this.props.onSuccess !== undefined) {
this.props.onSuccess();
} else {
this.history.pushState(null, '/')
var isChrome = (/Chrome/.test(navigator.userAgent))
&& (/Google Inc/.test(navigator.vendor));
if(
(isChrome && history.length > 2)
|| (!isChrome && history.length > 1)
) {
this.context.router.goBack();
} else {
this.context.router.push('/');
}
}
if(this.props.params.id !== undefined) {

8
assets/js/src/forms/forms.jsx
View File

@@ -1,10 +1,10 @@
import React from 'react'
import ReactDOM from 'react-dom'
import { Router, Route, IndexRoute } from 'react-router'
import { Router, Route, IndexRoute, Link, useRouterHistory } from 'react-router'
import { createHashHistory } from 'history'
import FormList from 'forms/list.jsx'
import createHashHistory from 'history/lib/createHashHistory'
let history = createHashHistory({ queryKey: false })
const history = useRouterHistory(createHashHistory)({ queryKey: false });
const App = React.createClass({
render() {
@@ -12,7 +12,7 @@ const App = React.createClass({
}
});
let container = document.getElementById('forms_container');
const container = document.getElementById('forms_container');
if(container) {
ReactDOM.render((

19
assets/js/src/listing/listing.jsx
View File

@@ -295,9 +295,9 @@ define(
});
var Listing = React.createClass({
mixins: [
Router.History
],
contextTypes: {
router: React.PropTypes.object.isRequired
},
getInitialState: function() {
return {
loading: false,
@@ -359,9 +359,12 @@ define(
}
})
}
// default overrides
if(this.props.limit !== undefined) {
state.limit = Math.abs(~~this.props.limit);
}
this.setState(state, function() {
this.getItems();
}.bind(this));
@@ -398,7 +401,7 @@ define(
if(this.props.location) {
if(this.props.location.pathname !== params) {
this.history.pushState(null, `${params}`)
this.context.router.push(`${params}`);
}
}
},
@@ -753,8 +756,8 @@ define(
onSort={ this.handleSort }
onSelectItems={ this.handleSelectItems }
selection={ this.state.selection }
sort_by={ this.state.sort_by }
sort_order={ this.state.sort_order }
sort_by={ sort_by }
sort_order={ sort_order }
columns={ this.props.columns }
is_selectable={ bulk_actions.length > 0 } />
</thead>
@@ -783,8 +786,8 @@ define(
onSort={ this.handleSort }
onSelectItems={ this.handleSelectItems }
selection={ this.state.selection }
sort_by={ this.state.sort_by }
sort_order={ this.state.sort_order }
sort_by={ sort_by }
sort_order={ sort_order }
columns={ this.props.columns }
is_selectable={ bulk_actions.length > 0 } />
</tfoot>

3
assets/js/src/newsletters/breadcrumb.jsx
View File

@@ -14,9 +14,6 @@ define(
var Link = Router.Link;
var Breadcrumb = React.createClass({
mixins: [
Router.History
],
getInitialState: function() {
return {
step: null,

8
assets/js/src/newsletters/newsletters.jsx
View File

@@ -1,6 +1,7 @@
import React from 'react'
import ReactDOM from 'react-dom'
import { Router, Route, IndexRoute, Link } from 'react-router'
import { Router, Route, IndexRoute, Link, useRouterHistory } from 'react-router'
import { createHashHistory } from 'history'
import NewsletterList from 'newsletters/list.jsx'
import NewsletterTypes from 'newsletters/types.jsx'
import NewsletterTemplates from 'newsletters/templates.jsx'
@@ -8,9 +9,8 @@ import NewsletterSend from 'newsletters/send.jsx'
import NewsletterStandard from 'newsletters/types/standard.jsx'
import NewsletterWelcome from 'newsletters/types/welcome/welcome.jsx'
import NewsletterNotification from 'newsletters/types/notification/notification.jsx'
import createHashHistory from 'history/lib/createHashHistory'
let history = createHashHistory({ queryKey: false })
const history = useRouterHistory(createHashHistory)({ queryKey: false });
const App = React.createClass({
render() {
@@ -18,7 +18,7 @@ const App = React.createClass({
}
});
let container = document.getElementById('newsletters_container');
const container = document.getElementById('newsletters_container');
if(container) {
ReactDOM.render((

16
assets/js/src/newsletters/send.jsx
View File

@@ -23,9 +23,9 @@ define(
) {
var NewsletterSend = React.createClass({
mixins: [
Router.History
],
contextTypes: {
router: React.PropTypes.object.isRequired
},
getInitialState: function() {
return {
fields: [],
@@ -68,7 +68,7 @@ define(
loading: false,
item: {},
}, function() {
this.history.pushState(null, '/new');
this.context.router.push('/new');
}.bind(this));
} else {
this.setState({
@@ -106,8 +106,10 @@ define(
}).done((response) => {
this.setState({ loading: false });
if(response.result === true) {
this.history.pushState(null, '/');
MailPoet.Notice.success(response.data.message);
this.context.router.push('/');
MailPoet.Notice.success(
MailPoet.Notice.success(response.data.message);
);
} else {
if(response.errors) {
MailPoet.Notice.error(response.errors);
@@ -133,7 +135,7 @@ define(
this.setState({ loading: false });
if(response.result === true) {
this.history.pushState(null, '/');
this.context.router.push('/');
MailPoet.Notice.success(
MailPoet.I18n.t('newsletterUpdated')
);

10
assets/js/src/newsletters/send/notification.jsx
View File

@@ -60,7 +60,6 @@ define(
name: 'sender_name',
type: 'text',
placeholder: MailPoet.I18n.t('senderNamePlaceholder'),
defaultValue: (settings.sender !== undefined) ? settings.sender.name : '',
validation: {
'data-parsley-required': true
}
@@ -69,7 +68,6 @@ define(
name: 'sender_address',
type: 'text',
placeholder: MailPoet.I18n.t('senderAddressPlaceholder'),
defaultValue: (settings.sender !== undefined) ? settings.sender.address : '',
validation: {
'data-parsley-required': true,
'data-parsley-type': 'email'
@@ -86,15 +84,13 @@ define(
{
name: 'reply_to_name',
type: 'text',
placeholder: MailPoet.I18n.t('replyToNamePlaceholder'),
defaultValue: (settings.reply_to !== undefined) ? settings.reply_to.name : '',
placeholder: MailPoet.I18n.t('replyToNamePlaceholder')
},
{
name: 'reply_to_address',
type: 'text',
placeholder: MailPoet.I18n.t('replyToAddressPlaceholder'),
defaultValue: (settings.reply_to !== undefined) ? settings.reply_to.address : ''
},
placeholder: MailPoet.I18n.t('replyToAddressPlaceholder')
}
]
}
];

10
assets/js/src/newsletters/send/standard.jsx
View File

@@ -52,7 +52,6 @@ define(
name: 'sender_name',
type: 'text',
placeholder: MailPoet.I18n.t('senderNamePlaceholder'),
defaultValue: (settings.sender !== undefined) ? settings.sender.name : '',
validation: {
'data-parsley-required': true
}
@@ -61,7 +60,6 @@ define(
name: 'sender_address',
type: 'text',
placeholder: MailPoet.I18n.t('senderAddressPlaceholder'),
defaultValue: (settings.sender !== undefined) ? settings.sender.address : '',
validation: {
'data-parsley-required': true,
'data-parsley-type': 'email'
@@ -78,15 +76,13 @@ define(
{
name: 'reply_to_name',
type: 'text',
placeholder: MailPoet.I18n.t('replyToNamePlaceholder'),
defaultValue: (settings.reply_to !== undefined) ? settings.reply_to.name : '',
placeholder: MailPoet.I18n.t('replyToNamePlaceholder')
},
{
name: 'reply_to_address',
type: 'text',
placeholder: MailPoet.I18n.t('replyToAddressPlaceholder'),
defaultValue: (settings.reply_to !== undefined) ? settings.reply_to.address : ''
},
placeholder: MailPoet.I18n.t('replyToAddressPlaceholder')
}
]
}
];

10
assets/js/src/newsletters/send/welcome.jsx
View File

@@ -36,7 +36,6 @@ define(
name: 'sender_name',
type: 'text',
placeholder: MailPoet.I18n.t('senderNamePlaceholder'),
defaultValue: (settings.sender !== undefined) ? settings.sender.name : '',
validation: {
'data-parsley-required': true
}
@@ -45,7 +44,6 @@ define(
name: 'sender_address',
type: 'text',
placeholder: MailPoet.I18n.t('senderAddressPlaceholder'),
defaultValue: (settings.sender !== undefined) ? settings.sender.address : '',
validation: {
'data-parsley-required': true,
'data-parsley-type': 'email'
@@ -62,15 +60,13 @@ define(
{
name: 'reply_to_name',
type: 'text',
placeholder: MailPoet.I18n.t('replyToNamePlaceholder'),
defaultValue: (settings.reply_to !== undefined) ? settings.reply_to.name : '',
placeholder: MailPoet.I18n.t('replyToNamePlaceholder')
},
{
name: 'reply_to_address',
type: 'text',
placeholder: MailPoet.I18n.t('replyToAddressPlaceholder'),
defaultValue: (settings.reply_to !== undefined) ? settings.reply_to.address : ''
},
placeholder: MailPoet.I18n.t('replyToAddressPlaceholder')
}
]
}
];

3
assets/js/src/newsletters/templates.jsx
View File

@@ -80,9 +80,6 @@ define(
});
var NewsletterTemplates = React.createClass({
mixins: [
Router.History
],
getInitialState: function() {
return {
loading: false,

10
assets/js/src/newsletters/types.jsx
View File

@@ -12,12 +12,12 @@ define(
Breadcrumb
) {
var NewsletterTypes = React.createClass({
mixins: [
Router.History
],
contextTypes: {
router: React.PropTypes.object.isRequired
},
setupNewsletter: function(type) {
if(type !== undefined) {
this.history.pushState(null, `/new/${type}`);
this.context.router.push(`/new/${type}`);
}
},
createNewsletter: function(type) {
@@ -30,7 +30,7 @@ define(
}
}).done(function(response) {
if(response.result && response.newsletter.id) {
this.history.pushState(null, `/template/${response.newsletter.id}`);
this.context.router.push(`/template/${response.newsletter.id}`);
} else {
if(response.errors.length > 0) {
response.errors.map(function(error) {

8
assets/js/src/newsletters/types/notification/notification.jsx
View File

@@ -24,9 +24,9 @@ define(
};
var NewsletterNotification = React.createClass({
mixins: [
Router.History
],
contextTypes: {
router: React.PropTypes.object.isRequired
},
getInitialState: function() {
return {
options: {
@@ -64,7 +64,7 @@ define(
}.bind(this));
},
showTemplateSelection: function(newsletterId) {
this.history.pushState(null, `/template/${newsletterId}`);
this.context.router.push(`/template/${newsletterId}`);
},
render: function() {
return (

8
assets/js/src/newsletters/types/standard.jsx
View File

@@ -13,11 +13,11 @@ define(
) {
var NewsletterStandard = React.createClass({
mixins: [
Router.History
],
contextTypes: {
router: React.PropTypes.object.isRequired
},
showTemplateSelection: function(newsletterId) {
this.history.pushState(null, `/template/${newsletterId}`);
this.context.router.push(`/template/${newsletterId}`);
},
componentDidMount: function() {
// No options for this type, create a newsletter upon mounting

5
assets/js/src/newsletters/types/welcome/scheduling.jsx
View File

@@ -65,6 +65,9 @@ define(
};
var WelcomeScheduling = React.createClass({
contextTypes: {
router: React.PropTypes.object.isRequired
},
_getCurrentValue: function() {
return this.props.item[this.props.field.name] || {};
},
@@ -131,7 +134,7 @@ define(
}.bind(this));
},
showTemplateSelection: function(newsletterId) {
this.history.pushState(null, `/template/${newsletterId}`);
this.context.router.push(`/template/${newsletterId}`);
},
render: function() {
var value = this._getCurrentValue(),

8
assets/js/src/newsletters/types/welcome/welcome.jsx
View File

@@ -31,9 +31,9 @@ define(
}
var NewsletterWelcome = React.createClass({
mixins: [
Router.History
],
contextTypes: {
router: React.PropTypes.object.isRequired
},
getInitialState: function() {
return {
options: {
@@ -71,7 +71,7 @@ define(
}.bind(this));
},
showTemplateSelection: function(newsletterId) {
this.history.pushState(null, `/template/${newsletterId}`);
this.context.router.push(`/template/${newsletterId}`);
},
render: function() {
return (

8
assets/js/src/segments/form.jsx
View File

@@ -1,13 +1,11 @@
define(
[
'react',
'react-router',
'mailpoet',
'form/form.jsx'
],
function(
React,
Router,
MailPoet,
Form
) {
@@ -21,7 +19,8 @@ define(
{
name: 'description',
label: MailPoet.I18n.t('description'),
type: 'textarea'
type: 'textarea',
tip: MailPoet.I18n.t('segmentDescriptionTip')
}
];
@@ -35,9 +34,6 @@ define(
};
const SegmentForm = React.createClass({
mixins: [
Router.History
],
render: function() {
return (
<div>

4
assets/js/src/segments/list.jsx
View File

@@ -159,9 +159,6 @@ const item_actions = [
}
];
const bulk_actions = [
];
const SegmentList = React.createClass({
renderItem: function(segment, actions) {
var rowClasses = classNames(
@@ -211,7 +208,6 @@ const SegmentList = React.createClass({
endpoint="segments"
onRenderItem={ this.renderItem }
columns={ columns }
bulk_actions={ bulk_actions }
item_actions={ item_actions }
/>
</div>

8
assets/js/src/segments/segments.jsx
View File

@@ -1,11 +1,11 @@
import React from 'react'
import ReactDOM from 'react-dom'
import { Router, Route, IndexRoute, Link } from 'react-router'
import { Router, Route, IndexRoute, Link, useRouterHistory } from 'react-router'
import { createHashHistory } from 'history'
import SegmentList from 'segments/list.jsx'
import SegmentForm from 'segments/form.jsx'
import createHashHistory from 'history/lib/createHashHistory'
let history = createHashHistory({ queryKey: false })
const history = useRouterHistory(createHashHistory)({ queryKey: false });
const App = React.createClass({
render() {
@@ -13,7 +13,7 @@ const App = React.createClass({
}
});
let container = document.getElementById('segments_container');
const container = document.getElementById('segments_container');
if(container) {
ReactDOM.render((

3
assets/js/src/subscribers/form.jsx
View File

@@ -115,9 +115,6 @@ define(
var Link = Router.Link;
var SubscriberForm = React.createClass({
mixins: [
Router.History
],
render: function() {
return (
<div>

6
assets/js/src/subscribers/subscribers.jsx
View File

@@ -1,11 +1,11 @@
import React from 'react'
import ReactDOM from 'react-dom'
import { Router, Route, IndexRoute, Link } from 'react-router'
import { Router, Route, IndexRoute, Link, useRouterHistory } from 'react-router'
import { createHashHistory } from 'history'
import SubscriberList from 'subscribers/list.jsx'
import SubscriberForm from 'subscribers/form.jsx'
import createHashHistory from 'history/lib/createHashHistory'
const history = createHashHistory({ queryKey: false })
const history = useRouterHistory(createHashHistory)({ queryKey: false });
const App = React.createClass({
render() {