feat(panes/nav): persist pane state across transitions; rename side panel to lesson

common/app/Panes/redux/index.js

@@ -10,7 +10,6 @@ import * as utils from './utils.js';
 import windowEpic from './window-epic.js';
 import dividerEpic from './divider-epic.js';
 import ns from '../ns.json';
-import { types as challengeTypes } from '../../routes/Challenges/redux';
 
 export const epics = [
   windowEpic,
@@ -58,11 +57,10 @@ const defaultState = {
   height: 600,
   width: 800,
   navHeight: 50,
-  isMapPaneHidden: false,
   panes: [],
   panesByName: {},
-  pressedDivider: null,
-  panesMap: {}
+  panesMap: {},
+  pressedDivider: null
 };
 export const getNS = state => state[ns];
 export const heightSelector = state => {
@@ -159,10 +157,6 @@ export default function createPanesAspects({ createPanesMap }) {
         [types.updateNavHeight]: (state, { payload: navHeight }) => ({
           ...state,
           navHeight
-        }),
-        [challengeTypes.toggleMap]: state => ({
-          ...state,
-          isMapPaneHidden: !state.isMapPaneHidden
         })
       }),
       defaultState
@@ -172,19 +166,24 @@ export default function createPanesAspects({ createPanesMap }) {
         const panesMap = action.meta.panesMap;
         const panes = _.map(panesMap, (name, type) => ({ name, type }));
         const numOfPanes = Object.keys(panes).length;
+        const panesByName = _.isEqual(state.panes, panes) && state.panesByName;
         return {
           ...state,
           panesMap,
           panes,
-          panesByName: panes.reduce((panes, { name }, index) => {
-            const dividerLeft = utils.getDividerLeft(numOfPanes, index);
-            panes[name] = {
-              name,
-              dividerLeft,
-              isHidden: name === 'Map' ? state.isMapPaneHidden : false
-            };
-            return panes;
-          }, {})
+          panesByName: panesByName
+            ? panesByName
+            : panes.reduce((panes, { name }, index) => {
+                const dividerLeft = utils.getDividerLeft(numOfPanes, index);
+                panes[name] = {
+                  name,
+                  dividerLeft,
+                  isHidden: false
+                };
+                return panes;
+              },
+            {}
+          )
         };
       }
       if (action.meta && action.meta.isPaneAction) {

common/app/routes/Challenges/views/Modern/Show.jsx

@@ -50,7 +50,7 @@ export const mapStateToPanes = addNS(
         return map;
       }, {
         [types.toggleMap]: 'Map',
-        [types.toggleSidePanel]: 'Side Panel'
+        [types.toggleSidePanel]: 'Lesson'
       });
 
       if (showPreview) {
@@ -63,7 +63,7 @@ export const mapStateToPanes = addNS(
 
 const nameToComponent = {
   Map: _Map,
-  'Side Panel': SidePanel,
+  Lesson: SidePanel,
   Preview: Preview
 };
 

common/app/routes/Challenges/views/quiz/Show.jsx

@@ -13,13 +13,13 @@ export const mapStateToPanes = addNS(
   ns,
   () => ({
     [types.toggleMap]: 'Map',
-    [types.toggleMain]: 'Main'
+    [types.toggleMain]: 'Lesson'
   })
 );
 
 const nameToComponent = {
   Map: _Map,
-  Main: Main
+  Lesson: Main
 };
 
 const renderPane = name => {

common/app/routes/Challenges/views/step/Show.jsx

@@ -13,13 +13,13 @@ export const mapStateToPanes = addNS(
   ns,
   () => ({
     [types.toggleMap]: 'Map',
-    [types.toggleStep]: 'Step'
+    [types.toggleStep]: 'Lesson'
   })
 );
 
 const nameToComponent = {
   Map: _Map,
-  Step: Step
+  Lesson: Step
 };
 
 const renderPane = name => {