diff --git a/common/app/routes/challenges/components/Show.jsx b/common/app/routes/challenges/components/Show.jsx index 3da7ee70d2..16e5948099 100644 --- a/common/app/routes/challenges/components/Show.jsx +++ b/common/app/routes/challenges/components/Show.jsx @@ -10,6 +10,11 @@ import Step from './step/Step.jsx'; import { fetchChallenge, fetchChallenges } from '../redux/actions'; import { challengeSelector } from '../redux/selectors'; +const views = { + step: Step, + classic: Classic +}; + const bindableActions = { fetchChallenge, fetchChallenges @@ -18,7 +23,10 @@ const bindableActions = { const mapStateToProps = createSelector( challengeSelector, state => state.challengesApp.challenge, - ({ isStep }, challenge) => ({ challenge, isStep }) + ({ viewType }, challenge) => ({ + challenge, + viewType + }) ); const fetchOptions = { @@ -42,18 +50,16 @@ export class Challenges extends PureComponent { this.props.fetchChallenges(); } - renderView(isStep) { - if (isStep) { - return ; - } - return ; + renderView(viewType) { + const View = views[viewType] || Classic; + return ; } render() { - const { isStep } = this.props; + const { viewType } = this.props; return (
- { this.renderView(isStep) } + { this.renderView(viewType) }
); } diff --git a/common/app/routes/challenges/redux/selectors.js b/common/app/routes/challenges/redux/selectors.js index b248c64e5b..9c989ed24a 100644 --- a/common/app/routes/challenges/redux/selectors.js +++ b/common/app/routes/challenges/redux/selectors.js @@ -1,6 +1,19 @@ -import { STEP, HTML } from '../../../utils/challengeTypes'; +import * as challengeTypes from '../../../utils/challengeTypes'; import { createSelector } from 'reselect'; +const viewTypes = { + [ challengeTypes.HTML ]: 'classic', + [ challengeTypes.JS ]: 'classic', + [ challengeTypes.BONFIRE ]: 'classic', + [ challengeTypes.ZIPLINE ]: 'project', + [ challengeTypes.BASEJUMP ]: 'project', + // might not be used anymore + [ challengeTypes.OLDVIDEO ]: 'video', + // formally hikes + [ challengeTypes.VIDEO ]: 'video', + [ challengeTypes.STEP ]: 'step' +}; + export const challengeSelector = createSelector( state => state.challengesApp.challenge, state => state.entities.challenge, @@ -11,9 +24,12 @@ export const challengeSelector = createSelector( const challenge = challengeMap[challengeName]; return { challenge: challenge, - showPreview: !!challenge && challenge.challengeType === HTML, - isStep: !!challenge && challenge.challengeType === STEP, - mode: !!challenge && challenge.challengeType === HTML ? + viewType: viewTypes[challenge.challengeType] || 'classic', + + showPreview: challenge && + challenge.challengeType === challengeTypes.HTML, + + mode: challenge && challenge.challengeType === challengeTypes.HTML ? 'text/html' : 'javascript' }; diff --git a/common/app/utils/challengeTypes.js b/common/app/utils/challengeTypes.js index bf61f6cad3..7f0835208b 100644 --- a/common/app/utils/challengeTypes.js +++ b/common/app/utils/challengeTypes.js @@ -1,8 +1,8 @@ export const HTML = '0'; export const JS = '1'; -export const VIDEO = '2'; +export const OLDVIDEO = '2'; export const ZIPLINE = '3'; export const BASEJUMP = '4'; export const BONFIRE = '5'; -export const HIKES = '6'; +export const VIDEO = '6'; export const STEP = '7';