Remove histories from top-level exports

dongpei021 · Jun 10, 2015 · c80d865 · c80d865
1 parent 5f7d7e1
commit c80d865
Show file tree

Hide file tree

Showing 13 changed files with 128 additions and 135 deletions.
diff --git a/examples/animations/app.js b/examples/animations/app.js
@@ -1,10 +1,11 @@
-var React = require('react/addons');
+import React from 'react/addons';
+import HashHistory from 'react-router/lib/HashHistory';
+import { Router, Route, Link } from 'react-router';
+
 var { CSSTransitionGroup } = React.addons;
-var { Router, Route, Link, HashHistory } = require('react-router');
 
 var App = React.createClass({
-
-  render () {
+  render() {
     var key = this.props.location.path;
     return (
       <div>
@@ -21,7 +22,7 @@ var App = React.createClass({
 });
 
 var Page1 = React.createClass({
-  render () {
+  render() {
     return (
       <div className="Image">
         <h1>Page 1</h1>
@@ -32,7 +33,7 @@ var Page1 = React.createClass({
 });
 
 var Page2 = React.createClass({
-  render () {
+  render() {
     return (
       <div className="Image">
         <h1>Page 2</h1>
@@ -51,4 +52,3 @@ React.render((
     </Route>
   </Router>
 ), document.getElementById('example'));
-
diff --git a/examples/async-data/app.js b/examples/async-data/app.js
@@ -1,9 +1,9 @@
-var React = require('react');
-var { Router, Route, Link, HashHistory } = require('react-router');
-var { loadContacts, loadContact, createContact, shallowEqual } = require('./utils');
+import React from 'react';
+import HashHistory from 'react-router/lib/HashHistory';
+import { Router, Route, Link } from 'react-router';
+import { loadContacts, loadContact, createContact, shallowEqual } from './utils';
 
 var App = React.createClass({
-
   statics: {
     loadProps(params, cb) {
       console.log('loading App props');
@@ -17,18 +17,16 @@ var App = React.createClass({
     };
   },
 
-  componentWillReceiveProps(nextProps) {
-  },
-
   handleSubmit(event) {
-    var [first, last] = event.target.elements;
+    var [ first, last ] = event.target.elements;
+
     createContact({
       first: first.value,
       last: last.value
     }, this.props.onPropsDidChange);
   },
 
-  render () {
+  render() {
     return (
       <div className={this.props.propsAreLoading ? 'loading' : ''}>
         <form onSubmit={this.handleSubmit}>
@@ -56,8 +54,9 @@ var Contact = React.createClass({
     }
   },
 
-  render () {
+  render() {
     var { contact } = this.props;
+
     return (
       <div>
         <p><Link to="/">Back</Link></p>
@@ -69,7 +68,7 @@ var Contact = React.createClass({
 });
 
 var Index = React.createClass({
-  render () {
+  render() {
     return (
       <div>
         <h1>Welcome!</h1>
@@ -158,4 +157,3 @@ React.render((
     </Route>
   </Router>
 ), document.getElementById('example'));
-
diff --git a/examples/auth-flow/app.js b/examples/auth-flow/app.js
@@ -1,6 +1,7 @@
-var React = require('react');
-var { HashHistory, Router, Route, Link, Navigation } = require('react-router');
-var auth = require('./auth');
+import React from 'react';
+import HashHistory from 'react-router/lib/HashHistory';
+import { Router, Route, Link, Navigation } from 'react-router';
+import auth from './auth';
 
 var App = React.createClass({
   getInitialState() {
@@ -9,18 +10,18 @@ var App = React.createClass({
     };
   },
 
-  setStateOnAuth (loggedIn) {
+  setStateOnAuth(loggedIn) {
     this.setState({
       loggedIn: loggedIn
     });
   },
 
-  componentWillMount () {
+  componentWillMount() {
     auth.onChange = this.setStateOnAuth;
     auth.login();
   },
 
-  render () {
+  render() {
     return (
       <div>
         <ul>
@@ -41,7 +42,7 @@ var App = React.createClass({
 });
 
 var Dashboard = React.createClass({
-  render () {
+  render() {
     var token = auth.getToken();
     return (
       <div>
@@ -63,23 +64,26 @@ var Login = React.createClass({
     };
   },
 
-  handleSubmit (event) {
+  handleSubmit(event) {
     event.preventDefault();
-    var { nextPath } = this.props.query;
+
+    var { nextPathname } = this.props.query;
     var email = this.refs.email.getDOMNode().value;
     var pass = this.refs.pass.getDOMNode().value;
+
     auth.login(email, pass, (loggedIn) => {
       if (!loggedIn)
         return this.setState({ error: true });
-      if (nextPath) {
-        this.replaceWith(nextPath);
+
+      if (nextPathname) {
+        this.replaceWith(nextPathname);
       } else {
         this.replaceWith('/about');
       }
     });
   },
 
-  render () {
+  render() {
     return (
       <form onSubmit={this.handleSubmit}>
         <label><input ref="email" placeholder="email" defaultValue="joe@example.com"/></label>
@@ -94,24 +98,24 @@ var Login = React.createClass({
 });
 
 var About = React.createClass({
-  render () {
+  render() {
     return <h1>About</h1>;
   }
 });
 
 var Logout = React.createClass({
-  componentDidMount () {
+  componentDidMount() {
     auth.logout();
   },
 
-  render () {
+  render() {
     return <p>You are now logged out</p>;
   }
 });
 
-function requireAuth (state, router) {
+function requireAuth(nextState, router) {
   if (!auth.loggedIn())
-    router.replaceWith('/login', {nextPath: state.location.path});
+    router.replaceWith('/login', { nextPathname: nextState.location.pathname });
 }
 
 React.render((

diff --git a/examples/dynamic-segments/app.js b/examples/dynamic-segments/app.js
@@ -1,8 +1,9 @@
 import React from 'react';
-import { Router, Route, Link, HashHistory } from 'react-router';
+import HashHistory from 'react-router/lib/HashHistory';
+import { Router, Route, Link, Redirect } from 'react-router';
 
 var App = React.createClass({
-  render () {
+  render() {
     return (
       <div>
         <ul>
@@ -16,29 +17,30 @@ var App = React.createClass({
 });
 
 var User = React.createClass({
-  render () {
-    var { userId } = this.props.params;
+  render() {
+    var { userID } = this.props.params;
+
     return (
       <div className="User">
-        <h1>User id: {userId}</h1>
+        <h1>User id: {userID}</h1>
         <ul>
-          <li><Link to={`/user/${userId}/tasks/foo`}>foo task</Link></li>
-          <li><Link to={`/user/${userId}/tasks/bar`}>bar task</Link></li>
+          <li><Link to={`/user/${userID}/tasks/foo`}>foo task</Link></li>
+          <li><Link to={`/user/${userID}/tasks/bar`}>bar task</Link></li>
         </ul>
         {this.props.children}
       </div>
     );
   }
 });
 
-
 var Task = React.createClass({
-  render () {
-    var { userId, taskId } = this.props.params;
+  render() {
+    var { userID, taskID } = this.props.params;
+
     return (
       <div className="Task">
-        <h2>User id: {userId}</h2>
-        <h3>Task id: {taskId}</h3>
+        <h2>User ID: {userID}</h2>
+        <h3>Task ID: {taskID}</h3>
       </div>
     );
   }
@@ -47,11 +49,10 @@ var Task = React.createClass({
 React.render((
   <Router history={HashHistory}>
     <Route path="/" component={App}>
-      <Route path="user/:userId" component={User}>
-        <Route path="tasks/:taskId" component={Task}/>
-        {/*<Redirect from="todos/:taskId" to="task"/>*/}
+      <Route path="user/:userID" component={User}>
+        <Route path="tasks/:taskID" component={Task}/>
+        <Redirect from="todos/:taskID" to="task"/>
       </Route>
     </Route>
   </Router>
 ), document.getElementById('example'));
-
diff --git a/examples/huge-apps/app.js b/examples/huge-apps/app.js
@@ -1,10 +1,10 @@
-import stubbedCourses from './stubs/courses';
 import React from 'react';
-import { createRouter, Route, Link } from 'react-router';
-import History from 'react-router/HashHistory';
+import HashHistory from 'react-router/lib/HashHistory';
+import { Router, Route, Link } from 'react-router';
 import getAsyncProps from './lib/getAsyncProps';
+import stubbedCourses from './stubs/courses';
 
-const rootRoute = {
+var rootRoute = {
   path: '/',
 
   childRoutes: [
@@ -18,16 +18,15 @@ const rootRoute = {
   component: require('./components/App'),
 };
 
-const Router = createRouter(rootRoute);
-
-History.listen((location) => {
-  Router.match(location, (err, props) => {
-    getAsyncProps(props, (err, newProps) => {
-      // swallowed errors?!
-      setTimeout(() => {
-        React.render(<Router {...newProps} />, document.getElementById('example'));
-      }, 0);
-    });
-  });
-});
-
+//var Router = createRouter(rootRoute);
+//
+//History.listen((location) => {
+//  Router.match(location, (err, props) => {
+//    getAsyncProps(props, (err, newProps) => {
+//      // swallowed errors?!
+//      setTimeout(() => {
+//        React.render(<Router {...newProps} />, document.getElementById('example'));
+//      }, 0);
+//    });
+//  });
+//});