Fix(challenges): completed marked at render

Mark challenge completed using derived data in a selector
instead of manipulating the data on user load

common/app/redux/actions.js

@@ -95,10 +95,6 @@ export const updateUserLang = createAction(
   (username, lang) => ({ username, lang })
 );
 export const updateAppLang = createAction(types.updateAppLang);
-// updateCompletedChallenges(username: String) => Action
-export const updateCompletedChallenges = createAction(
-  types.updateCompletedChallenges
-);
 
 // used when server needs client to redirect
 export const delayedRedirect = createAction(types.delayedRedirect);

common/app/redux/entities-reducer.js

@@ -1,6 +1,6 @@
 import types from './types';
 
-const { updateUserPoints, updateCompletedChallenges } = types;
+const { updateUserPoints } = types;
 const initialState = {
   superBlock: {},
   block: {},
@@ -15,22 +15,6 @@ export default function entities(state = initialState, action) {
     type,
     payload: { email, username, points, flag, languageTag } = {}
   } = action;
-  if (type === updateCompletedChallenges) {
-    const username = action.payload;
-    const completedChallengeMap = state.user[username].challengeMap || {};
-    return {
-      ...state,
-      challenge: Object.keys(state.challenge)
-        .reduce((map, key) => {
-          const challenge = state.challenge[key];
-          map[key] = {
-            ...challenge,
-            isCompleted: !!completedChallengeMap[challenge.id]
-          };
-          return map;
-        }, {})
-    };
-  }
   if (action.meta && action.meta.entities) {
     return {
       ...state,

common/app/redux/fetch-user-saga.js

@@ -3,7 +3,6 @@ import types from './types';
 import {
   addUser,
   updateThisUser,
-  updateCompletedChallenges,
   createErrorObservable,
   showSignIn,
   updateTheme,
@@ -24,7 +23,6 @@ export default function getUserSaga(action$, getState, { services }) {
           const isNightMode = user.theme === 'night';
           return Observable.of(
             addUser(entities),
-            updateCompletedChallenges(result),
             updateThisUser(result),
             isNightMode ? updateTheme(user.theme) : null,
             isNightMode ? addThemeToBody(user.theme) : null

common/app/redux/types.js

@@ -12,7 +12,6 @@ export default createTypes([
   'updateUserFlag',
   'updateUserEmail',
   'updateUserLang',
-  'updateCompletedChallenges',
   'showSignIn',
   'loadCurrentChallenge',
   'updateMyCurrentChallenge',

common/app/routes/challenges/components/map/Challenge.jsx

@@ -8,24 +8,35 @@ import debug from 'debug';
 
 import { updateCurrentChallenge } from '../../redux/actions';
 import { makePanelHiddenSelector } from '../../redux/selectors';
+import { userSelector } from '../../../../redux/selectors';
 import { closeMapDrawer } from '../../../../redux/actions';
 
 const bindableActions = { closeMapDrawer, updateCurrentChallenge };
 const makeMapStateToProps = () => createSelector(
+  userSelector,
   (_, props) => props.dashedName,
   state => state.entities.challenge,
   makePanelHiddenSelector(),
-  (dashedName, challengeMap, isHidden) => {
+  (
+    { user: { challengeMap: userChallengeMap } },
+    dashedName,
+    challengeMap,
+    isHidden
+  ) => {
     const challenge = challengeMap[dashedName] || {};
+    let isCompleted = false;
+    if (userChallengeMap) {
+      isCompleted = !!userChallengeMap[challenge.id];
+    }
     return {
       dashedName,
       challenge,
       isHidden,
+      isCompleted,
       title: challenge.title,
       block: challenge.block,
       isLocked: challenge.isLocked,
       isRequired: challenge.isRequired,
-      isCompleted: challenge.isCompleted,
       isComingSoon: challenge.isComingSoon,
       isDev: debug.enabled('fcc:*')
     };