[add] Upgrade ThunderCats react

client/index.js

@@ -6,7 +6,7 @@ import debugFactory from 'debug';
 import { Router } from 'react-router';
 import { createLocation, createHistory } from 'history';
 import { hydrate } from 'thundercats';
-import { Render } from 'thundercats-react';
+import { render$ } from 'thundercats-react';
 
 import { app$ } from '../common/app';
 
@@ -72,7 +72,7 @@ app$({ history, location: appLocation })
   })
   .flatMap(({ props, appCat }) => {
     props.history = history;
-    return Render(
+    return render$(
       appCat,
       React.createElement(Router, props),
       DOMContianer

package.json

@@ -115,9 +115,10 @@
     "rx": "^4.0.0",
     "sanitize-html": "^1.11.1",
     "sort-keys": "^1.1.1",
+    "stampit": "^2.1.1",
     "store": "https://github.com/berkeleytrue/store.js.git#feature/noop-server",
-    "thundercats": "^3.0.0",
-    "thundercats-react": "~0.4.0",
+    "thundercats": "^3.1.0",
+    "thundercats-react": "~0.5.1",
     "twit": "^2.1.1",
     "uglify-js": "^2.5.0",
     "url-regex": "^3.0.0",

server/boot/a-react.js

@@ -3,8 +3,10 @@ import { RoutingContext } from 'react-router';
 import Fetchr from 'fetchr';
 import { createLocation } from 'history';
 import debugFactory from 'debug';
+import { dehydrate } from 'thundercats';
+import { renderToString$ } from 'thundercats-react';
+
 import { app$ } from '../../common/app';
-import { RenderToString } from 'thundercats-react';
 
 const debug = debugFactory('freecc:react-server');
 
@@ -12,14 +14,13 @@ const debug = debugFactory('freecc:react-server');
 // remove their individual controllers
 const routes = [
   '/jobs',
-  '/jobs/*'
-];
-
-const devRoutes = [
+  '/jobs/*',
   '/hikes',
   '/hikes/*'
 ];
 
+const devRoutes = [];
+
 export default function reactSubRouter(app) {
   var router = app.loopback.Router();
 
@@ -51,20 +52,22 @@ export default function reactSubRouter(app) {
         return !!props;
       })
       .flatMap(function({ props, AppCat }) {
-        // call thundercats renderToString
-        // prefetches data and sets up it up for current state
-        debug('rendering to string');
-        return RenderToString(
-          AppCat(null, services),
+        const cat = AppCat(null, services);
+        debug('render react markup and pre-fetch data');
+        return renderToString$(
+          cat,
           React.createElement(RoutingContext, props)
-        );
+        )
+          .flatMap(
+            dehydrate(cat),
+            ({ markup }, data) => ({ markup, data, cat })
+          );
       })
-      // makes sure we only get one onNext and closes subscription
-      .flatMap(function({ data, markup }) {
-        debug('react rendered');
+      .flatMap(function({ data, markup, cat }) {
+        debug('react markup rendered, data fetched');
+        cat.dispose();
         const { title } = data.AppStore;
         res.expose(data, 'data');
-        // now render jade file with markup injected from react
         return res.render$(
           'layout-react',
           { markup, title }
@@ -72,7 +75,7 @@ export default function reactSubRouter(app) {
       })
       .subscribe(
         function(markup) {
-          debug('jade rendered');
+          debug('html rendered and ready to send');
           res.send(markup);
         },
         next