Initial move to redux

server/boot/a-react.js

@@ -1,14 +1,14 @@
 import React from 'react';
 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 debug from 'debug';
+
+import renderToString from '../../common/app/utils/render-to-string';
+import provideStore from '../../common/app/provide-store';
 
 import app$ from '../../common/app';
 
-const debug = debugFactory('freecc:react-server');
+const log = debug('fcc:react-server');
 
 // add routes here as they slowly get reactified
 // remove their individual controllers
@@ -38,52 +38,43 @@ export default function reactSubRouter(app) {
   app.use(router);
 
   function serveReactApp(req, res, next) {
-    const services = new Fetchr({ req });
+    const serviceOptions = { req };
     const location = createLocation(req.path);
 
     // returns a router wrapped app
-    app$({ location })
+    app$({
+      location,
+      serviceOptions
+    })
       // if react-router does not find a route send down the chain
-      .filter(function({ props }) {
+      .filter(({ props }) => {
         if (!props) {
-          debug('react tried to find %s but got 404', location.pathname);
+          log(`react tried to find ${location.pathname} but got 404`);
           return next();
         }
         return !!props;
       })
-      .flatMap(function({ props, AppCat }) {
-        const cat = AppCat(null, services);
-        debug('render react markup and pre-fetch data');
-        const store = cat.getStore('appStore');
+      .flatMap(({ props, store }) => {
+        log('render react markup and pre-fetch data');
 
-        // primes store to observe action changes
-        // cleaned up by cat.dispose further down
-        store.subscribe(() => {});
-
-        return renderToString$(
-          cat,
-          React.createElement(RoutingContext, props)
+        return renderToString(
+          provideStore(React.createElement(RoutingContext, props), store)
         )
-          .flatMap(
-            dehydrate(cat),
-            ({ markup }, data) => ({ markup, data, cat })
-          );
+          .map(({ markup }) => ({ markup, store }));
       })
-      .flatMap(function({ data, markup, cat }) {
-        debug('react markup rendered, data fetched');
-        cat.dispose();
-        const { title } = data.AppStore;
-        res.expose(data, 'data');
+      .flatMap(function({ markup, store }) {
+        log('react markup rendered, data fetched');
+        const state = store.getState();
+        const { title } = state.app.title;
+        res.expose(state, 'data');
         return res.render$(
           'layout-react',
           { markup, title }
         );
       })
+      .doOnNext(markup => res.send(markup))
       .subscribe(
-        function(markup) {
-          debug('html rendered and ready to send');
-          res.send(markup);
-        },
+        () => log('html rendered and ready to send'),
         next
       );
   }