implement subapps with subspace

Author: rikukissa

package.json

@@ -37,8 +37,11 @@
     "react-dom": "^15.6.1",
     "react-error-overlay": "^1.0.9",
     "react-redux": "^5.0.6",
+    "react-redux-subspace": "^2.0.3-alpha",
     "react-test-renderer": "^15.6.1",
     "redux": "^3.7.2",
+    "redux-subspace": "^2.0.3-alpha",
+    "redux-thunk": "^2.2.0",
     "style-loader": "0.18.2",
     "sw-precache-webpack-plugin": "0.11.3",
     "url-loader": "0.5.9",

src/App.js

@@ -1,15 +1,25 @@
 import React, { Component } from "react";
 import UserCreator from "./UserCreator";
 import { connect } from "react-redux";
+import { SubspaceProvider } from "react-redux-subspace";
 
 class App extends Component {
   render() {
     const { users } = this.props;
     return (
       <div>
-        <UserCreator />
-        <UserCreator />
-        <UserCreator />
+        <SubspaceProvider mapState={state => state.app.userCreator1} namespace="userCreator1">
+          <UserCreator />
+        </SubspaceProvider>
+
+        <SubspaceProvider mapState={state => state.app.userCreator2} namespace="userCreator2">
+          <UserCreator />
+        </SubspaceProvider>
+
+        <SubspaceProvider mapState={state => state.app.userCreator3} namespace="userCreator3">
+          <UserCreator />
+        </SubspaceProvider>
+
         <div id="userList">
           {users.map(({ name }) =>
             <div key={name} className="user">

src/UserCreator/actions.js

@@ -1,3 +1,5 @@
+import { globalAction } from "redux-subspace";
+import { userCreated } from "../state/users";
 export const UPDATE_NAME_FIELD = "USER_CREATOR/UPDATE_NAME_FIELD";
 export function updateNameField(name) {
   return {
@@ -6,9 +8,9 @@ export function updateNameField(name) {
   };
 }
 
-export const CREATE_USER = "USER_CREATOR/CREATE_USER";
 export function createUser() {
-  return {
-    type: CREATE_USER
+  return (dispatch, getState, a, b) => {
+    const user = getState();
+    dispatch(globalAction(userCreated(user)));
   };
 }

src/state/app.js

@@ -1,6 +1,9 @@
-export default function(state = [], action) {
-  switch (action.type) {
-    default:
-      return state;
-  }
-}
+import { combineReducers } from "redux";
+import { namespaced } from "redux-subspace";
+import userCreatorReducer from "../UserCreator/reducer";
+
+export default combineReducers({
+  userCreator1: namespaced("userCreator1")(userCreatorReducer),
+  userCreator2: namespaced("userCreator2")(userCreatorReducer),
+  userCreator3: namespaced("userCreator3")(userCreatorReducer)
+});

src/store.js

@@ -1,13 +1,20 @@
-import { combineReducers, createStore } from "redux";
-
+import { compose, combineReducers, createStore } from "redux";
+import { applyMiddleware } from "redux-subspace";
 import appReducer from "./state/app";
 import usersReducer from "./state/users";
+import thunk from "redux-thunk";
+
+const enhancers = [applyMiddleware(thunk)];
+
+if (window.__REDUX_DEVTOOLS_EXTENSION__) {
+  enhancers.push(window.__REDUX_DEVTOOLS_EXTENSION__());
+}
 
 export default () =>
   createStore(
     combineReducers({
       app: appReducer,
       users: usersReducer
     }),
-    window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()
+    compose(...enhancers)
   );

yarn.lock

@@ -1255,6 +1255,10 @@ chalk@^2.0.1:
     escape-string-regexp "^1.0.5"
     supports-color "^4.0.0"
 
+change-emitter@^0.1.2:
+  version "0.1.6"
+  resolved "https://registry.yarnpkg.com/change-emitter/-/change-emitter-0.1.6.tgz#e8b2fe3d7f1ab7d69a32199aff91ea6931409515"
+
 cheerio@^0.22.0:
   version "0.22.0"
   resolved "https://registry.yarnpkg.com/cheerio/-/cheerio-0.22.0.tgz#a9baa860a3f9b595a6b81b1a86873121ed3a269e"
@@ -2478,7 +2482,7 @@ fb-watchman@^2.0.0:
   dependencies:
     bser "^2.0.0"
 
-fbjs@^0.8.9:
+fbjs@^0.8.1, fbjs@^0.8.9:
   version "0.8.14"
   resolved "https://registry.yarnpkg.com/fbjs/-/fbjs-0.8.14.tgz#d1dbe2be254c35a91e09f31f9cd50a40b2a0ed1c"
   dependencies:
@@ -2897,6 +2901,10 @@ [email protected]:
   version "2.16.3"
   resolved "https://registry.yarnpkg.com/hoek/-/hoek-2.16.3.tgz#20bb7403d3cea398e91dc4710a8ff1b8274a25ed"
 
+hoist-non-react-statics@^1.0.0:
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/hoist-non-react-statics/-/hoist-non-react-statics-1.2.0.tgz#aa448cf0986d55cc40773b17174b7dd066cb7cfb"
+
 hoist-non-react-statics@^2.2.1:
   version "2.3.0"
   resolved "https://registry.yarnpkg.com/hoist-non-react-statics/-/hoist-non-react-statics-2.3.0.tgz#ede16318c2ff1f9fe3a025396ba06fd4c44608bb"
@@ -4979,7 +4987,7 @@ [email protected], promise@^7.1.1:
   dependencies:
     asap "~2.0.3"
 
-prop-types@^15.5.10:
+prop-types@^15.5.0, prop-types@^15.5.10:
   version "15.5.10"
   resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.5.10.tgz#2797dfc3126182e3a95e3dfbb2e893ddd7456154"
   dependencies:
@@ -5119,6 +5127,15 @@ react-error-overlay@^1.0.9:
     settle-promise "1.0.0"
     source-map "0.5.6"
 
+react-redux-subspace@^2.0.3-alpha:
+  version "2.0.3-alpha"
+  resolved "https://registry.yarnpkg.com/react-redux-subspace/-/react-redux-subspace-2.0.3-alpha.tgz#df1e1bab58ee4d253927a6b3c21e4a2dc73a9237"
+  dependencies:
+    hoist-non-react-statics "^2.2.1"
+    prop-types "^15.5.0"
+    recompose "^0.24.0"
+    redux-subspace "^2.0.3-alpha"
+
 react-redux@^5.0.6:
   version "5.0.6"
   resolved "https://registry.yarnpkg.com/react-redux/-/react-redux-5.0.6.tgz#23ed3a4f986359d68b5212eaaa681e60d6574946"
@@ -5213,6 +5230,15 @@ rechoir@^0.6.2:
   dependencies:
     resolve "^1.1.6"
 
+recompose@^0.24.0:
+  version "0.24.0"
+  resolved "https://registry.yarnpkg.com/recompose/-/recompose-0.24.0.tgz#262e93f974439eb17e7779824d88cce90492a5dd"
+  dependencies:
+    change-emitter "^0.1.2"
+    fbjs "^0.8.1"
+    hoist-non-react-statics "^1.0.0"
+    symbol-observable "^1.0.4"
+
 [email protected]:
   version "2.2.1"
   resolved "https://registry.yarnpkg.com/recursive-readdir/-/recursive-readdir-2.2.1.tgz#90ef231d0778c5ce093c9a48d74e5c5422d13a99"
@@ -5240,6 +5266,14 @@ reduce-function-call@^1.0.1:
   dependencies:
     balanced-match "^0.4.2"
 
+redux-subspace@^2.0.3-alpha:
+  version "2.0.3-alpha"
+  resolved "https://registry.yarnpkg.com/redux-subspace/-/redux-subspace-2.0.3-alpha.tgz#c785e931224e122fe3ce4f744c79f7c9ed43a54f"
+
+redux-thunk@^2.2.0:
+  version "2.2.0"
+  resolved "https://registry.yarnpkg.com/redux-thunk/-/redux-thunk-2.2.0.tgz#e615a16e16b47a19a515766133d1e3e99b7852e5"
+
 redux@^3.7.2:
   version "3.7.2"
   resolved "https://registry.yarnpkg.com/redux/-/redux-3.7.2.tgz#06b73123215901d25d065be342eb026bc1c8537b"
@@ -5905,7 +5939,7 @@ sw-toolbox@^3.4.0:
     path-to-regexp "^1.0.1"
     serviceworker-cache-polyfill "^4.0.0"
 
-symbol-observable@^1.0.3:
+symbol-observable@^1.0.3, symbol-observable@^1.0.4:
   version "1.0.4"
   resolved "https://registry.yarnpkg.com/symbol-observable/-/symbol-observable-1.0.4.tgz#29bf615d4aa7121bdd898b22d4b3f9bc4e2aa03d"