fix(Challenges): Add child container for challenges

Add a central point for the completion modal to open

common/app/routes/Challenges/Child-Container.jsx

@@ -0,0 +1,20 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+
+import CompletionModal from './Completion-Modal.jsx';
+import AppChildContainer from '../../Child-Container.jsx';
+
+const propTypes = {
+  children: PropTypes.node
+};
+
+export default function ChildContainer({ children, ...props }) {
+  return (
+    <AppChildContainer { ...props }>
+      { children }
+      <CompletionModal />
+    </AppChildContainer>
+  );
+}
+
+ChildContainer.propTypes = propTypes;

common/app/routes/Challenges/Show.jsx

@@ -5,7 +5,6 @@ import { createSelector } from 'reselect';
 
 import { challengeMetaSelector } from './redux';
 
-import CompletionModal from './Completion-Modal.jsx';
 import Classic from './views/classic';
 import Step from './views/step';
 import Project from './views/project';
@@ -108,12 +107,7 @@ export class Show extends PureComponent {
   render() {
     const { viewType } = this.props;
     const View = views[viewType] || Classic;
-    return (
-      <div>
-        <View />
-        <CompletionModal />
-      </div>
-    );
+    return  <View />;
   }
 }
 

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

@@ -7,12 +7,12 @@ import { addNS } from 'berkeleys-redux-utils';
 
 import ns from './ns.json';
 import Editor from './Editor.jsx';
+import ChildContainer from '../../Child-Container.jsx';
 import { showPreviewSelector, types } from '../../redux';
 import SidePanel from '../../Side-Panel.jsx';
 import Preview from '../../Preview.jsx';
 import _Map from '../../../../Map';
 import Panes from '../../../../Panes';
-import ChildContainer from '../../../../Child-Container.jsx';
 import { filesSelector } from '../../../../files';
 
 const createModernEditorToggleType = fileKey =>

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

@@ -1,11 +1,11 @@
 import React from 'react';
 import { addNS } from 'berkeleys-redux-utils';
 
+import ChildContainer from '../../Child-Container.jsx';
 import BackEnd from './Back-End.jsx';
 import { types } from '../../redux';
 import Panes from '../../../../Panes';
 import _Map from '../../../../Map';
-import ChildContainer from '../../../../Child-Container.jsx';
 
 const propTypes = {};
 

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

@@ -2,12 +2,12 @@ import React from 'react';
 import { addNS } from 'berkeleys-redux-utils';
 
 import Editor from './Editor.jsx';
+import ChildContainer from '../../Child-Container.jsx';
 import { types, showPreviewSelector } from '../../redux';
 import Preview from '../../Preview.jsx';
 import SidePanel from '../../Side-Panel.jsx';
 import Panes from '../../../../Panes';
 import _Map from '../../../../Map';
-import ChildContainer from '../../../../Child-Container.jsx';
 
 const propTypes = {};
 

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

@@ -3,10 +3,10 @@ import { addNS } from 'berkeleys-redux-utils';
 
 import ns from './ns.json';
 import Main from './Project.jsx';
+import ChildContainer from '../../Child-Container.jsx';
 import { types } from '../../redux';
 import Panes from '../../../../Panes';
 import _Map from '../../../../Map';
-import ChildContainer from '../../../../Child-Container.jsx';
 
 const propTypes = {};
 export const mapStateToPanes = addNS(

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

@@ -3,10 +3,10 @@ import { addNS } from 'berkeleys-redux-utils';
 
 import ns from './ns.json';
 import Main from './Quiz.jsx';
+import ChildContainer from '../../Child-Container.jsx';
 import { types } from '../../redux';
 import Panes from '../../../../Panes';
 import _Map from '../../../../Map';
-import ChildContainer from '../../../../Child-Container.jsx';
 
 const propTypes = {};
 export const mapStateToPanes = addNS(

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

@@ -3,10 +3,10 @@ import { addNS } from 'berkeleys-redux-utils';
 
 import ns from './ns.json';
 import Step from './Step.jsx';
+import ChildContainer from '../../Child-Container.jsx';
 import { types } from '../../redux';
 import Panes from '../../../../Panes';
 import _Map from '../../../../Map';
-import ChildContainer from '../../../../Child-Container.jsx';
 
 const propTypes = {};
 export const mapStateToPanes = addNS(