66 lines
1.4 KiB
JavaScript
66 lines
1.4 KiB
JavaScript
import React, { PropTypes } from 'react';
|
|
import { compose } from 'redux';
|
|
import { contain } from 'redux-epic';
|
|
import { connect } from 'react-redux';
|
|
import { createSelector } from 'reselect';
|
|
import PureComponent from 'react-pure-render/component';
|
|
|
|
import Classic from './classic/Classic.jsx';
|
|
import Step from './step/Step.jsx';
|
|
import { fetchChallenge, fetchChallenges } from '../redux/actions';
|
|
import { challengeSelector } from '../redux/selectors';
|
|
|
|
const bindableActions = {
|
|
fetchChallenge,
|
|
fetchChallenges
|
|
};
|
|
|
|
const mapStateToProps = createSelector(
|
|
challengeSelector,
|
|
state => state.challengesApp.challenge,
|
|
({ isStep }, challenge) => ({ challenge, isStep })
|
|
);
|
|
|
|
const fetchOptions = {
|
|
fetchAction: 'fetchChallenge',
|
|
getActionArgs({ params: { dashedName } }) {
|
|
return [ dashedName ];
|
|
},
|
|
isPrimed({ challenge }) {
|
|
return !!challenge;
|
|
}
|
|
};
|
|
|
|
export class Challenges extends PureComponent {
|
|
static displayName = 'Challenges';
|
|
static propTypes = {
|
|
isStep: PropTypes.bool,
|
|
fetchChallenges: PropTypes.func
|
|
};
|
|
|
|
componentDidMount() {
|
|
this.props.fetchChallenges();
|
|
}
|
|
|
|
renderView(isStep) {
|
|
if (isStep) {
|
|
return <Step />;
|
|
}
|
|
return <Classic />;
|
|
}
|
|
|
|
render() {
|
|
const { isStep } = this.props;
|
|
return (
|
|
<div>
|
|
{ this.renderView(isStep) }
|
|
</div>
|
|
);
|
|
}
|
|
}
|
|
|
|
export default compose(
|
|
connect(mapStateToProps, bindableActions),
|
|
contain(fetchOptions)
|
|
)(Challenges);
|