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

fixed React/React-router upgrade related issues

Browse Source
This commit is contained in:
Jonathan Labreuille
2015-10-20 15:31:19 +02:00
parent 7bbf660c81
commit 6a1bb0f4a5
14 changed files with 107 additions and 159 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@ -15,7 +15,7 @@ define(
) {
var Form = React.createClass({
mixins: [
Router.Navigation
Router.History
],
getInitialState: function() {
return {
@ -55,7 +55,7 @@ define(
loading: false,
item: {}
}, function() {
this.transitionTo('/new');
this.history.pushState(null, '/new');
}.bind(this));
} else {
this.setState({
@ -78,7 +78,7 @@ define(
this.setState({ loading: false });
if(response === true) {
this.transitionTo('/');
this.history.pushState(null, '/');
if(this.props.params.id !== undefined) {
this.props.messages['updated']();
} else {

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

@ -84,7 +84,7 @@ define(
} else {
item_actions = (
<span className="edit">
<Link to="edit" params={{ id: this.props.item.id }}>Edit</Link>
<Link to={ `/edit/${ this.props.item.id }` }>Edit</Link>
</span>
);
}
@ -384,7 +384,8 @@ define(
}.bind(this));
},
handleRenderItem: function(item, actions) {
return this.props.onRenderItem(item, actions);
var render = this.props.onRenderItem(item, actions);
return render.props.children;
},
render: function() {
var items = this.state.items,

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

@ -13,7 +13,7 @@ define(
var Breadcrumb = React.createClass({
mixins: [
Router.Navigation
Router.History
],
getInitialState: function() {
return {

2
assets/js/src/newsletters/list.jsx
View File

@ -81,7 +81,7 @@ define(
return (
<div>
<h2 className="title">
Newsletters <Link className="add-new-h2" to="new">New</Link>
Newsletters <Link className="add-new-h2" to="/new">New</Link>
</h2>
<Listing

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

@ -1,52 +1,32 @@
define(
[
'react',
'react-router',
'newsletters/list.jsx',
'newsletters/types.jsx',
'newsletters/templates.jsx',
'newsletters/send.jsx'
],
function(
React,
Router,
NewsletterList,
NewsletterTypes,
NewsletterTemplates,
NewsletterSend
) {
var DefaultRoute = Router.DefaultRoute;
var Link = Router.Link;
var Route = Router.Route;
var RouteHandler = Router.RouteHandler;
var NotFoundRoute = Router.NotFoundRoute;
import React from 'react'
import ReactDOM from 'react-dom'
import { Router, Route, IndexRoute, Link } from 'react-router'
import NewsletterList from 'newsletters/list.jsx'
import NewsletterTypes from 'newsletters/types.jsx'
import NewsletterTemplates from 'newsletters/templates.jsx'
import NewsletterSend from 'newsletters/send.jsx'
import createHashHistory from 'history/lib/createHashHistory'
var App = React.createClass({
render: function() {
return (
<RouteHandler />
);
}
});
let history = createHashHistory({ queryKey: false })
var routes = (
<Route name="app" path="/" handler={App}>
<Route name="new" path="/new" handler={ NewsletterTypes } />
<Route name="template" path="/new/:type" handler={ NewsletterTemplates } />
<Route name="send" path="/send/:id" handler={ NewsletterSend } />
<NotFoundRoute handler={ NewsletterList } />
<DefaultRoute handler={ NewsletterList } />
</Route>
);
var hook = document.getElementById('newsletters');
if(hook) {
Router.run(routes, function(Handler, state) {
React.render(
<Handler params={ state.params } query={ state.query } />,
hook
);
});
}
const App = React.createClass({
render() {
return this.props.children
}
);
});
let container = document.getElementById('newsletters');
if(container) {
ReactDOM.render((
<Router history={ history }>
<Route path="/" component={ App }>
<IndexRoute component={ NewsletterList } />
<Route path="new" component={ NewsletterTypes } />
<Route path="new/:type" component={ NewsletterTemplates } />
<Route path="send/:id" component={ NewsletterSend } />
<Route path="*" component={ NewsletterList } />
</Route>
</Router>
), container);
}

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

@ -84,7 +84,7 @@ define(
var NewsletterSend = React.createClass({
mixins: [
Router.Navigation
Router.History
],
handleSend: function() {
MailPoet.Ajax.post({
@ -97,7 +97,8 @@ define(
}
}).done(function(response) {
if(response === true) {
this.transitionTo('/');
this.history.pushState(null, '/');
MailPoet.Notice.success(
'The newsletter has been sent!'
);

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

@ -15,7 +15,7 @@ define(
) {
var NewsletterTemplates = React.createClass({
mixins: [
Router.Navigation
Router.History
],
getInitialState: function() {
return {

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

@ -13,11 +13,11 @@ define(
) {
var NewsletterTypes = React.createClass({
mixins: [
Router.Navigation
Router.History
],
handleSelectType: function(type) {
if(type !== undefined) {
this.transitionTo('/new/'+type);
this.history.pushState(null, `/new/${type}`);
}
},
render: function() {

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

@ -67,7 +67,7 @@ define(
return (
<div>
<h2 className="title">
Segments <Link className="add-new-h2" to="new">New</Link>
Segments <Link className="add-new-h2" to="/new">New</Link>
</h2>
<Listing

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

@ -1,47 +1,29 @@
define(
[
'react',
'react-router',
'segments/list.jsx',
'segments/form.jsx'
],
function(
React,
Router,
List,
Form
) {
var DefaultRoute = Router.DefaultRoute;
var Link = Router.Link;
var Route = Router.Route;
var RouteHandler = Router.RouteHandler;
var NotFoundRoute = Router.NotFoundRoute;
import React from 'react'
import ReactDOM from 'react-dom'
import { Router, Route, IndexRoute, Link } from 'react-router'
import SegmentList from 'segments/list.jsx'
import SegmentForm from 'segments/form.jsx'
import createHashHistory from 'history/lib/createHashHistory'
var App = React.createClass({
render: function() {
return (
<RouteHandler />
);
}
});
let history = createHashHistory({ queryKey: false })
var routes = (
<Route name="app" path="/" handler={App}>
<Route name="new" path="/new" handler={Form} />
<Route name="edit" path="/edit/:id" handler={Form} />
<NotFoundRoute handler={List} />
<DefaultRoute handler={List} />
</Route>
);
var hook = document.getElementById('segments');
if(hook) {
Router.run(routes, function(Handler, state) {
React.render(
<Handler params={state.params} query={state.query} />,
hook
);
});
}
const App = React.createClass({
render() {
return this.props.children
}
);
});
let container = document.getElementById('segments');
if(container) {
ReactDOM.render((
<Router history={ history }>
<Route path="/" component={ App }>
<IndexRoute component={ SegmentList } />
<Route path="new" component={ SegmentForm } />
<Route path="edit/:id" component={ SegmentForm } />
<Route path="*" component={ SegmentList } />
</Route>
</Router>
), container);
}

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

@ -148,7 +148,7 @@ define(
<div>
<td className={ row_classes }>
<strong>
<Link to="edit" params={{ id: subscriber.id }}>
<Link to={ `/edit/${ subscriber.id }` }>
{ subscriber.email }
</Link>
</strong>
@ -179,7 +179,7 @@ define(
return (
<div>
<h2 className="title">
Subscribers <Link className="add-new-h2" to="new">New</Link>
Subscribers <Link className="add-new-h2" to="/new">New</Link>
</h2>
<Listing

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

@ -1,47 +1,29 @@
define(
[
'react',
'react-router',
'subscribers/list.jsx',
'subscribers/form.jsx'
],
function(
React,
Router,
List,
Form
) {
var DefaultRoute = Router.DefaultRoute;
var Link = Router.Link;
var Route = Router.Route;
var RouteHandler = Router.RouteHandler;
var NotFoundRoute = Router.NotFoundRoute;
import React from 'react'
import ReactDOM from 'react-dom'
import { Router, Route, IndexRoute, Link } from 'react-router'
import SubscriberList from 'subscribers/list.jsx'
import SubscriberForm from 'subscribers/form.jsx'
import createHashHistory from 'history/lib/createHashHistory'
var App = React.createClass({
render: function() {
return (
<RouteHandler />
);
}
});
let history = createHashHistory({ queryKey: false })
var routes = (
<Route name="app" path="/" handler={App}>
<Route name="new" path="/new" handler={Form} />
<Route name="edit" path="/edit/:id" handler={Form} />
<NotFoundRoute handler={List} />
<DefaultRoute handler={List} />
</Route>
);
var hook = document.getElementById('subscribers');
if(hook) {
Router.run(routes, function(Handler, state) {
React.render(
<Handler params={state.params} query={state.query} />,
hook
);
});
}
const App = React.createClass({
render() {
return this.props.children
}
);
});
let container = document.getElementById('subscribers');
if(container) {
ReactDOM.render((
<Router history={ history }>
<Route path="/" component={ App }>
<IndexRoute component={ SubscriberList } />
<Route path="new" component={ SubscriberForm } />
<Route path="edit/:id" component={ SubscriberForm } />
<Route path="*" component={ SubscriberList } />
</Route>
</Router>
), container);
}