From c8561ac6dc34a95991f69a141ab556b263404f5f Mon Sep 17 00:00:00 2001
From: Tobias Koppers <tobias.koppers@googlemail.com>
Date: Sun, 22 Jun 2014 22:55:17 +0200
Subject: [PATCH] Use the bundle-loader

to implement an AsyncReactComponent
---
 examples/partial-app-loading/app.js           | 24 +++++++++----------
 .../{async-components => }/dashboard.js       |  2 +-
 .../{async-components => }/inbox.js           |  0
 3 files changed, 12 insertions(+), 14 deletions(-)
 rename examples/partial-app-loading/{async-components => }/dashboard.js (87%)
 rename examples/partial-app-loading/{async-components => }/inbox.js (100%)

diff --git a/examples/partial-app-loading/app.js b/examples/partial-app-loading/app.js
index fce2c55900..fbb90710db 100644
--- a/examples/partial-app-loading/app.js
+++ b/examples/partial-app-loading/app.js
@@ -5,16 +5,16 @@ var Router = ReactRouter.Router;
 var Route = ReactRouter.Route;
 var Link = ReactRouter.Link;
 
-var AsyncJSXRoute = {
-  routeCache: {},
+var AsyncReactComponent = {
+  loadedComponent: null,
 
   load: function() {
-    if (this.routeCache[this.globalName]) {
+    if (this.constructor.loadedComponent) {
       return;
     }
 
-    require.ensure([], function() {
-      this.routeCache[this.globalName] = require('./async-components/' + this.filePath);
+    this.bundle(function(component) {
+      this.constructor.loadedComponent = component;
       this.forceUpdate();
     }.bind(this));
   },
@@ -24,24 +24,22 @@ var AsyncJSXRoute = {
   },
 
   render: function() {
-    var fullRoute = this.routeCache[this.globalName];
-    return fullRoute ? fullRoute(this.props) : this.preRender();
+    var component = this.constructor.loadedComponent;
+    return component ? component(this.props) : this.preRender();
   }
 };
 
 var PreDashboard = React.createClass({
-  mixins: [AsyncJSXRoute],
-  filePath: 'dashboard.js',
-  globalName: 'Dashboard',
+  mixins: [AsyncReactComponent],
+  bundle: require('bundle?lazy!./dashboard.js'),
   preRender: function() {
     return <div>Loading dashboard...</div>
   }
 });
 
 var PreInbox = React.createClass({
-  mixins: [AsyncJSXRoute],
-  filePath: 'inbox.js',
-  globalName: 'Inbox',
+  mixins: [AsyncReactComponent],
+  bundle: require('bundle?lazy!./inbox.js'),
   preRender: function() {
     return <div>Loading inbox...</div>
   }
diff --git a/examples/partial-app-loading/async-components/dashboard.js b/examples/partial-app-loading/dashboard.js
similarity index 87%
rename from examples/partial-app-loading/async-components/dashboard.js
rename to examples/partial-app-loading/dashboard.js
index cf0a599e42..46d52f3108 100644
--- a/examples/partial-app-loading/async-components/dashboard.js
+++ b/examples/partial-app-loading/dashboard.js
@@ -1,7 +1,7 @@
 /** @jsx React.DOM */
 
 var React = require('react');
-var ReactRouter = require('../../../modules/main');
+var ReactRouter = require('../../modules/main');
 var Link = ReactRouter.Link;
 
 var Dashboard = React.createClass({
diff --git a/examples/partial-app-loading/async-components/inbox.js b/examples/partial-app-loading/inbox.js
similarity index 100%
rename from examples/partial-app-loading/async-components/inbox.js
rename to examples/partial-app-loading/inbox.js