Merge pull request #10 from CodeSignal/9-classes

Fix the bug + add classes back in!

Author: ksaxberg

.babelrc.js

@@ -9,6 +9,7 @@ module.exports = {
     "@babel/flow"
   ],
   plugins: [
+    "@babel/proposal-class-properties",
     "@babel/proposal-object-rest-spread",
     "transform-imports",
     "@babel/transform-modules-commonjs"

README.md

@@ -89,7 +89,7 @@ need to handle the addition of dynamic reducers!
 
 Here's what your Redux store creation will look like:
 ```js
-import { combineReducers, createStore, applyMiddleware } from 'redux';
+import { compose, combineReducers, createStore, applyMiddleware } from 'redux';
 import thunk from 'redux-thunk';
 
 import { combineAsyncReducers, configureRags } from 'redux-rags';

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "redux-rags",
-  "version": "1.2.0",
+  "version": "1.2.1",
   "description": "Redux Reducers, Actions, and Getters. Simplified!",
   "main": "build/index.js",
   "scripts": {
@@ -32,6 +32,7 @@
   "devDependencies": {
     "@babel/cli": "^7.2.3",
     "@babel/core": "^7.2.2",
+    "@babel/plugin-proposal-class-properties": "^7.3.0",
     "@babel/plugin-proposal-object-rest-spread": "^7.3.1",
     "@babel/plugin-transform-modules-commonjs": "^7.2.0",
     "@babel/preset-env": "^7.3.1",
@@ -49,6 +50,7 @@
     "flow-bin": "^0.86.0",
     "jest": "^23.6.0",
     "redux": "^4.0.1",
+    "redux-thunk": "^2.3.0",
     "regenerator-runtime": "^0.13.1"
   }
 }

package.json

@@ -10,12 +10,11 @@ const recursivelyCombineAsyncReducers = function (combineReducers: Function, asy
   for (let prop of Object.getOwnPropertyNames(asyncReducers)) {
     const subreducer = asyncReducers[prop];
     if (typeof subreducer === 'object') {
-      recursivelyCombineAsyncReducers(combineReducers, subreducer);
+      reducers[prop] = recursivelyCombineAsyncReducers(combineReducers, subreducer);
     } else {
       reducers[prop] = subreducer;
     }
   }
-
   return combineReducers(reducers);
 };
 

src/combineAsyncReducers.js

@@ -77,97 +77,97 @@ const createFactory = (injectReducer: Function) => <T, G: Array<mixed>>(config:
   const {
     name = '',
     load,
-    getInStore,
     loadOnlyOnce,
+    getInStore,
     getInitialState,
     update,
     partialReducer,
   } = config;
   generatedCount += 1;
 
   const safeDataName = `${name}/${generatedCount}`;
-  const Getters = new function () {
-    const wrappedGetInitialState: () => BoilerState<T> = createGetInitialState(getInitialState);
-    this.getInitialState  = wrappedGetInitialState;
+  const wrappedGetInitialState: () => BoilerState<T> = createGetInitialState(getInitialState);
+  class Getters {
+    static getInitialState  = wrappedGetInitialState;
 
-    this.get = getInStore ||
+    static get = getInStore ||
       ((reduxStore: Object): BoilerState<T> =>
-        reduxStore[prefix][safeDataName] || this.getInitialState());
+        reduxStore[prefix][safeDataName] || Getters.getInitialState());
 
-    this.getData = (reduxStore: Object): $PropertyType<BoilerState<T>, 'data'> => {
-      const state = this.get(reduxStore);
+    static getData = (reduxStore: Object): $PropertyType<BoilerState<T>, 'data'> => {
+      const state = Getters.get(reduxStore);
       if (!state.hasOwnProperty('data')) {
         warning(`redux-rags: getData failed to find the property \'data\' on the object returned by Getters.get.
         This is likely caused by providing an incorrect 'getInStore' configuration option.`);
       }
       return state.data;
     };
 
-    this.getMeta = (reduxStore: Object): $PropertyType<BoilerState<T>, 'meta'> => {
-      const state = this.get(reduxStore);
+    static getMeta = (reduxStore: Object): $PropertyType<BoilerState<T>, 'meta'> => {
+      const state = Getters.get(reduxStore);
       if (!state.hasOwnProperty('meta')) {
         warning(`redux-rags: getData failed to find the property \'meta\' on the object returned by Getters.get.
         This is likely caused by providing an incorrect 'getInStore' configuration option.`);
       }
       return state.meta;
     };
 
-    this.getIsLoading = (reduxStore: Object) => {
-      const meta = this.getMeta(reduxStore);
+    static getIsLoading = (reduxStore: Object) => {
+      const meta = Getters.getMeta(reduxStore);
       return meta && meta.loading;
     };
-  };
+  }
 
   const BEGIN_LOADING = getLoadingType(name);
   const END_LOADING = getEndLoadingType(name);
   const ERRORS = getErrorsType(name);
   const UPDATE_DATA = getUpdateType(name);
   const RESET = getResetType(name);
 
-  const Actions = new function(){
-    this.beginLoading = () => ({
+  class Actions {
+    static beginLoading = () => ({
       type: BEGIN_LOADING,
       payload: null,
     });
 
-    this.endLoading = () => ({
+    static endLoading = () => ({
       type: END_LOADING,
       payload: null,
     });
 
-    this.reset = () => ({
+    static reset = () => ({
       type: RESET,
       payload: null,
     });
 
-    this.errors = (errors: Object | String) => ({
+    static errors = (errors: Object | String) => ({
       type: ERRORS,
       payload: errors,
     });
 
-    this.clearErrors = () => ({
+    static clearErrors = () => ({
       type: ERRORS,
       payload: null,
     });
 
-    this.updateData = (data: ?T) => ({
+    static updateData = (data: ?T) => ({
       type: UPDATE_DATA,
       payload: data,
     });
 
-    this.update = (...args: *) => async (dispatch, getState: () => Object) => {
+    static update = (...args: *) => async (dispatch, getState: () => Object) => {
       if (!update || typeof update !== 'function') {
         return;
       }
       try {
         const manipulated = await Promise.resolve(update(Getters.getData(getState()), ...args));
-        dispatch(this.updateData(manipulated));
+        dispatch(Actions.updateData(manipulated));
       } catch (err) {
-        dispatch(this.errors(err));
+        dispatch(Actions.errors(err));
       }
     };
 
-    this.load = (...args: G) => async (
+    static load = (...args: G) => async (
       dispatch: Dispatch,
       getState: () => Object
     ): Promise<?T> => {
@@ -180,18 +180,18 @@ const createFactory = (injectReducer: Function) => <T, G: Array<mixed>>(config:
           return state.data;
         }
       }
-      dispatch(this.beginLoading());
+      dispatch(Actions.beginLoading());
       try {
         const data = await Promise.resolve(load(...args));
-        dispatch(this.updateData(data));
+        dispatch(Actions.updateData(data));
         return data;
       } catch (err) {
-        dispatch(this.errors(err));
-        dispatch(this.endLoading());
+        dispatch(Actions.errors(err));
+        dispatch(Actions.endLoading());
         return null;
       }
     };
-  };
+  }
 
   type Interpret = <R>((...Iterable<any>) => R) => R;
   type ExtractReturn<Fn> = $Call<Interpret, Fn>;
@@ -202,10 +202,10 @@ const createFactory = (injectReducer: Function) => <T, G: Array<mixed>>(config:
     | ExtractReturn<typeof Actions.clearErrors>
     | ExtractReturn<typeof Actions.updateData>
     | ExtractReturn<typeof Actions.endLoading>;
-  const Subreducer = new function() {
-    this.partialReducer = partialReducer;
+  class Subreducer {
+    static partialReducer = partialReducer;
 
-    this.subreduce = (
+    static subreduce = (
       state?: BoilerState<T> = Getters.getInitialState(),
       action?: GeneratedAction | * // Support other action types
     ) => {
@@ -235,13 +235,13 @@ const createFactory = (injectReducer: Function) => <T, G: Array<mixed>>(config:
         case RESET:
           return (Getters.getInitialState(): BoilerState<T>);
         default:
-          if (typeof this.partialReducer === 'function') {
-            return {...state, ...(this.partialReducer(state, action) || {})};
+          if (typeof Subreducer.partialReducer === 'function') {
+            return {...state, ...(Subreducer.partialReducer(state, action) || {})};
           }
           return state;
       }
     };
-  };
+  }
 
   if (!getInStore) {
     injectReducer([prefix, safeDataName], Subreducer.subreduce);

src/factory.js

@@ -34,40 +34,40 @@ let generatedCount = 0;
 const convertArgsToString = (...args) => JSON.stringify(args);
 
 const createFactoryMap = (injectReducer: Function) => {
-    const factory = createFactory(injectReducer);
-    return <T, G: Array<mixed>>(config: ConfigType<T, G>): ReturnType<T, G> => {
-      const { name = '', load, getInitialState } = config;
-      generatedCount += 1;
+  const factory = createFactory(injectReducer);
+  return <T, G: Array<mixed>>(config: ConfigType<T, G>): ReturnType<T, G> => {
+    const { name = '', load, getInitialState } = config;
+    generatedCount += 1;
 
-      const safeDataName = `${name}/${generatedCount}`;
-      const mapArgsToGenerated = {};
-      const Getters = new function() {
-        const _getInitialStateForKey: () => BoilerState<T> = createGetInitialState(getInitialState);
+    const safeDataName = `${name}/${generatedCount}`;
+    const mapArgsToGenerated = {};
+    class Getters {
+        static _getInitialStateForKey: () => BoilerState<T> = createGetInitialState(getInitialState);
 
-        this.get = (reduxStore: Object): MapState<T> =>
+        static get = (reduxStore: Object): MapState<T> =>
           reduxStore[prefix] && reduxStore[prefix][safeDataName];
 
-        this.getWithArgs = (reduxStore, ...args) => {
+        static getWithArgs = (reduxStore, ...args) => {
           const argsKey = convertArgsToString(...args);
-          const state = this.get(reduxStore);
+          const state = Getters.get(reduxStore);
           if (!state || !state.hasOwnProperty(argsKey)) {
-            return _getInitialStateForKey();
+            return Getters._getInitialStateForKey();
           }
           return state[argsKey];
         };
 
-        this.getData = (reduxStore, ...args) => this.getWithArgs(reduxStore, ...args).data;
+        static getData = (reduxStore, ...args) => Getters.getWithArgs(reduxStore, ...args).data;
 
-        this.getMeta = (reduxStore, ...args) => this.getWithArgs(reduxStore, ...args).meta;
+        static getMeta = (reduxStore, ...args) => Getters.getWithArgs(reduxStore, ...args).meta;
 
-        this.getIsLoading = (reduxStore: Object, ...args) => {
-          const meta = this.getMeta(reduxStore, ...args);
+        static getIsLoading = (reduxStore: Object, ...args) => {
+          const meta = Getters.getMeta(reduxStore, ...args);
           return meta.loading;
         };
-      };
+    }
 
-      const Actions = new function() {
-        const _queryOrCreateBoilerplate = (...args) => {
+    class Actions {
+        static _queryOrCreateBoilerplate = (...args) => {
           const stringHash = convertArgsToString(...args);
           if (!mapArgsToGenerated[stringHash]) {
             // Need to generate everything for this. Luckily we have a generator
@@ -85,30 +85,30 @@ const createFactoryMap = (injectReducer: Function) => {
         };
 
         // Links to argument-less actions generated by the factory.
-        const _forwardActionForSubreducer = (actionName: string, { forwardArgs = false }: * = {}) => (
+        static _forwardActionForSubreducer = (actionName: string, { forwardArgs = false }: * = {}) => (
           ...args: Array<mixed>
         ) => async dispatch => {
-          const actions = _queryOrCreateBoilerplate(...args).actions;
+          const actions = Actions._queryOrCreateBoilerplate(...args).actions;
           const action = actions[actionName];
           if (forwardArgs) {
             return dispatch(action(...args)); // Assumed to be loading arguments.
           }
           return dispatch(action());
         };
 
-        this.load = _forwardActionForSubreducer('load', { forwardArgs: true });
+        static load = Actions._forwardActionForSubreducer('load', { forwardArgs: true });
 
-        this.reset = _forwardActionForSubreducer('reset');
+        static reset = Actions._forwardActionForSubreducer('reset');
 
-        this.clearErrors = _forwardActionForSubreducer('clearErrors');
-      }
+        static clearErrors = Actions._forwardActionForSubreducer('clearErrors');
+    }
 
-      return {
-        actions: Actions,
-        getters: Getters,
-      };
+    return {
+      actions: Actions,
+      getters: Getters,
     };
   };
+};
 
 export default createFactoryMap;
 

src/factoryMap.js

@@ -12,7 +12,7 @@ function configureRags(store: *, createRootReducer: *) {
   injectReducer = makeReducerInjector(store, createRootReducer);
   ragFactory = createFactory(injectReducer);
   ragFactoryMap = createFactoryMap(injectReducer);
-};
+}
 
 export {
   combineAsyncReducers,