update current challenge on map click

This commit is contained in:
Berkeley Martinez
2016-05-10 21:25:12 -07:00
parent 1eb6390b85
commit 5d95a98b64
4 changed files with 19 additions and 18 deletions

View File

@@ -1,21 +1,24 @@
import React, { PropTypes } from 'react';
import { Link } from 'react-router';
import { connect } from 'react-redux';
import FA from 'react-fontawesome';
import PureComponent from 'react-pure-render/component';
import { Panel } from 'react-bootstrap';
import classnames from 'classnames';
import { updateCurrentChallenge } from '../../redux/actions';
export default class Block extends PureComponent {
const dispatchActions = { updateCurrentChallenge };
export class Block extends PureComponent {
static displayName = 'Block';
static propTypes = {
title: PropTypes.string,
time: PropTypes.string,
challenges: PropTypes.array,
setChallenge: PropTypes.func
updateCurrentChallenge: PropTypes.func
};
renderChallenges(challenges, setChallenge) {
renderChallenges(challenges, updateCurrentChallenge) {
if (!Array.isArray(challenges) || !challenges.length) {
return <div>No Challenges Found</div>;
}
@@ -50,7 +53,7 @@ export default class Block extends PureComponent {
key={ title }>
<Link to={ `/challenges/${dashedName}` }>
<span
onClick={ () => setChallenge(challenge) }>
onClick={ () => updateCurrentChallenge(challenge) }>
{ title }
<span className='sr-only'>complete</span>
{
@@ -66,7 +69,7 @@ export default class Block extends PureComponent {
}
render() {
const { title, time, challenges, setChallenge } = this.props;
const { title, time, challenges, updateCurrentChallenge } = this.props;
return (
<Panel
bsClass='map-accordion-panel-nested'
@@ -80,8 +83,10 @@ export default class Block extends PureComponent {
}
id={ title }
key={ title }>
{ this.renderChallenges(challenges, setChallenge) }
{ this.renderChallenges(challenges, updateCurrentChallenge) }
</Panel>
);
}
}
export default connect(null, dispatchActions)(Block);

View File

@@ -18,7 +18,7 @@ export default class ShowMap extends PureComponent {
updateFilter: PropTypes.func
};
renderSuperBlocks(superBlocks, setChallenge) {
renderSuperBlocks(superBlocks, updateCurrentChallenge) {
if (!Array.isArray(superBlocks) || !superBlocks.length) {
return <div>No Super Blocks</div>;
}
@@ -26,7 +26,7 @@ export default class ShowMap extends PureComponent {
return (
<SuperBlock
key={ superBlock.title }
setChallenge={ setChallenge }
updateCurrentChallenge={ updateCurrentChallenge }
{ ...superBlock }/>
);
});
@@ -34,7 +34,7 @@ export default class ShowMap extends PureComponent {
render() {
const {
setChallenge,
updateCurrentChallenge,
superBlocks,
updateFilter,
clearFilter,
@@ -77,7 +77,7 @@ export default class ShowMap extends PureComponent {
</div>
<div
className='map-accordion'>
{ this.renderSuperBlocks(superBlocks, setChallenge) }
{ this.renderSuperBlocks(superBlocks, updateCurrentChallenge) }
<FullStack />
<CodingPrep />
</div>

View File

@@ -9,15 +9,13 @@ import Map from './Map.jsx';
import {
clearFilter,
updateFilter,
updateCurrentChallenge,
fetchChallenges
} from '../../redux/actions';
const bindableActions = {
clearFilter,
fetchChallenges,
updateFilter,
updateCurrentChallenge
updateFilter
};
const superBlocksSelector = createSelector(
@@ -72,8 +70,7 @@ export class ShowMap extends PureComponent {
clearFilter: PropTypes.func,
filter: PropTypes.string,
superBlocks: PropTypes.array,
updateFilter: PropTypes.func,
updateCurrentChallenge: PropTypes.func
updateFilter: PropTypes.func
};
render() {

View File

@@ -1,7 +1,6 @@
import { handleActions } from 'redux-actions';
import types from './types';
import { setChallenge, fetchChallengeCompleted } from '../../../redux/types';
const initialState = {
challenge: '',
@@ -23,11 +22,11 @@ function buildSeed({ challengeSeed = [] } = {}) {
export default handleActions(
{
[fetchChallengeCompleted]: (state, { payload = '' }) => ({
[types.fetchChallengeCompleted]: (state, { payload = '' }) => ({
...state,
challenge: payload
}),
[setChallenge]: (state, { payload: challenge }) => ({
[types.updateCurrentChallenge]: (state, { payload: challenge }) => ({
...state,
challenge: challenge.dashedName,
content: buildSeed(challenge)