feat(mapUi): Create mapUi specific service

common/app/Map/redux/fetch-map-ui-epic.js

@@ -0,0 +1,46 @@
+import { ofType } from 'redux-epic';
+import debug from 'debug';
+
+import {
+  types as appTypes,
+  createErrorObservable
+} from '../../redux';
+import { types, fetchMapUiComplete } from './';
+import { langSelector } from '../../Router/redux';
+import { shapeChallenges } from '../../redux/utils';
+
+const isDev = debug.enabled('fcc:*');
+
+export default function fetchMapUiEpic(
+  actions,
+  { getState },
+  { services }
+) {
+  return actions::ofType(
+    appTypes.appMounted
+  )
+    .flatMapLatest(() => {
+      const lang = langSelector(getState());
+      const options = {
+        params: { lang },
+        service: 'map-ui'
+      };
+      return services.readService$(options)
+        .retry(3)
+        .map(({ entities, ...res }) => ({
+          entities: shapeChallenges(
+            entities,
+            isDev
+          ),
+          ...res
+        }))
+        .map(({ entities, result } = {}) => {
+          return fetchMapUiComplete(
+            entities,
+            result
+          );
+        })
+        .startWith({ type: types.fetchMapUi.start })
+        .catch(createErrorObservable);
+    });
+  }

common/app/Map/redux/index.js

@@ -1,25 +1,26 @@
 import {
   createAction,
+  createAsyncTypes,
   createTypes,
   handleActions
 } from 'berkeleys-redux-utils';
 import { createSelector } from 'reselect';
-import noop from 'lodash/noop';
-import capitalize from 'lodash/capitalize';
+import { capitalize, noop} from 'lodash';
 
 import * as utils from './utils.js';
 import ns from '../ns.json';
 import {
-  types as app,
   createEventMetaCreator
 } from '../../redux';
 
-export const epics = [];
+import fewtchMapUiEpic from './fetch-map-ui-epic';
+
+export const epics = [ fewtchMapUiEpic ];
 
 export const types = createTypes([
   'onRouteMap',
   'initMap',
-
+  createAsyncTypes('fetchMapUi'),
   'toggleThisPanel',
 
   'isAllCollapsed',
@@ -31,6 +32,12 @@ export const types = createTypes([
 
 export const initMap = createAction(types.initMap);
 
+export const fetchMapUiComplete = createAction(
+  types.fetchMapUi.complete,
+  (entities, result) => ({ entities, result }),
+  entities => ({ entities })
+);
+
 export const toggleThisPanel = createAction(types.toggleThisPanel);
 export const collapseAll = createAction(types.collapseAll);
 
@@ -100,7 +107,7 @@ export default handleActions(
         mapUi
       };
     },
-    [app.fetchChallenges.complete]: (state, { payload }) => {
+    [types.fetchMapUi.complete]: (state, { payload }) => {
       const { entities, result } = payload;
       return {
         ...state,

common/app/entities/index.js

@@ -1,4 +1,4 @@
-import { findIndex, invert, pick, property } from 'lodash';
+import { findIndex, invert, pick, property, merge } from 'lodash';
 import uuid from 'uuid/v4';
 import {
   composeReducers,
@@ -162,10 +162,7 @@ export default composeReducers(
           }
         };
       }
-      return {
-        ...state,
-        ...action.meta.entities
-      };
+      return merge(state, action.meta.entities);
     }
     return state;
   },

common/app/redux/fetch-challenges-epic.js

@@ -19,7 +19,7 @@ import { langSelector } from '../Router/redux';
 
 const isDev = debug.enabled('fcc:*');
 
-export function fetchChallengeEpic(actions, { getState }, { services }) {
+export default function fetchChallengeEpic(actions, { getState }, { services }) {
   return actions::ofType(challenge.onRouteChallenges)
     .filter(({ payload }) => !isChallengeLoaded(getState(), payload))
     .flatMapLatest(({ payload: params }) => {
@@ -84,4 +84,3 @@ export function fetchChallengesEpic(
     });
 }
 
-export default combineEpics(fetchChallengeEpic, fetchChallengesEpic);