diff --git a/common/app/redux/actions.js b/common/app/redux/actions.js
index 8fa279ad53..47569c12ef 100644
--- a/common/app/redux/actions.js
+++ b/common/app/redux/actions.js
@@ -129,6 +129,15 @@ export const toggleMapDrawer = createAction(
label: 'Map drawer toggled'
})
);
+export const closeMapDrawer = createAction(
+ types.closeMapDrawer,
+ null,
+ () => createEventMeta({
+ category: 'Nav',
+ action: 'clicked',
+ label: 'Map drawer closed'
+ })
+);
export const toggleMainChat = createAction(
types.toggleMainChat,
null,
diff --git a/common/app/redux/reducer.js b/common/app/redux/reducer.js
index 3458f747d3..b73b20cccf 100644
--- a/common/app/redux/reducer.js
+++ b/common/app/redux/reducer.js
@@ -51,6 +51,10 @@ export default handleActions(
isMapAlreadyLoaded: true,
isMapDrawerOpen: !state.isMapDrawerOpen
}),
+ [types.closeMapDrawer]: state => ({
+ ...state,
+ isMapDrawerOpen: false
+ }),
[types.toggleMainChat]: state => ({
...state,
isMainChatOpen: !state.isMainChatOpen
diff --git a/common/app/redux/types.js b/common/app/redux/types.js
index db5891992f..503130b93c 100644
--- a/common/app/redux/types.js
+++ b/common/app/redux/types.js
@@ -32,6 +32,7 @@ export default createTypes([
// drawers
'toggleMapDrawer',
+ 'closeMapDrawer',
'toggleWikiDrawer',
// chat
diff --git a/common/app/routes/challenges/components/map/Challenge.jsx b/common/app/routes/challenges/components/map/Challenge.jsx
index 1051ae8962..202bb70e69 100644
--- a/common/app/routes/challenges/components/map/Challenge.jsx
+++ b/common/app/routes/challenges/components/map/Challenge.jsx
@@ -8,8 +8,9 @@ import debug from 'debug';
import { updateCurrentChallenge } from '../../redux/actions';
import { makePanelHiddenSelector } from '../../redux/selectors';
+import { closeMapDrawer } from '../../../../redux/actions';
-const bindableActions = { updateCurrentChallenge };
+const bindableActions = { closeMapDrawer, updateCurrentChallenge };
const makeMapStateToProps = () => createSelector(
(_, props) => props.dashedName,
state => state.entities.challenge,
@@ -34,6 +35,7 @@ const makeMapStateToProps = () => createSelector(
export class Challenge extends PureComponent {
constructor(...args) {
super(...args);
+ this.handleChallengeClick = this.handleChallengeClick.bind(this);
}
static displayName = 'Challenge';
static propTypes = {
@@ -45,9 +47,15 @@ export class Challenge extends PureComponent {
isCompleted: PropTypes.bool,
isHidden: PropTypes.bool,
challenge: PropTypes.object,
- updateCurrentChallenge: PropTypes.func
+ updateCurrentChallenge: PropTypes.func.isRequired,
+ closeMapDrawer: PropTypes.func.isRequired
};
+ handleChallengeClick() {
+ this.props.closeMapDrawer();
+ this.props.updateCurrentChallenge(this.props.challenge);
+ }
+
renderCompleted(isCompleted, isLocked) {
if (isLocked || !isCompleted) {
return null;
@@ -100,9 +108,7 @@ export class Challenge extends PureComponent {
isCompleted,
isComingSoon,
isDev,
- isHidden,
- challenge,
- updateCurrentChallenge
+ isHidden
} = this.props;
if (isHidden) {
return null;
@@ -131,7 +137,7 @@ export class Challenge extends PureComponent {
key={ title }
>
- updateCurrentChallenge(challenge) }>
+
{ title }
{ this.renderCompleted(isCompleted, isLocked) }
{ this.renderRequired(isRequired) }