diff --git a/common/app/routes/Challenges/Show.jsx b/common/app/routes/Challenges/Show.jsx index 515e013db0..546a47385e 100644 --- a/common/app/routes/Challenges/Show.jsx +++ b/common/app/routes/Challenges/Show.jsx @@ -15,8 +15,8 @@ import Modern from './views/Modern'; import { fetchChallenge, - - challengeSelector + challengeSelector, + updateTitle } from '../../redux'; import { makeToast } from '../../Toasts/redux'; import { paramsSelector } from '../../Router/redux'; @@ -33,7 +33,8 @@ const views = { const mapDispatchToProps = { fetchChallenge, - makeToast + makeToast, + updateTitle }; const mapStateToProps = createSelector( @@ -42,12 +43,13 @@ const mapStateToProps = createSelector( paramsSelector, ( { dashedName, isTranslated }, - { viewType }, - params, + { viewType, title }, + params ) => ({ challenge: dashedName, isTranslated, params, + title, viewType }) ); @@ -64,6 +66,8 @@ const propTypes = { dashedName: PropTypes.string, lang: PropTypes.string.isRequired }), + title: PropTypes.string, + updateTitle: PropTypes.func.isRequired, viewType: PropTypes.string }; @@ -82,12 +86,16 @@ export class Show extends PureComponent { } componentDidMount() { + this.props.updateTitle(this.props.title); if (this.isNotTranslated(this.props)) { this.makeTranslateToast(); } } componentWillReceiveProps(nextProps) { + if (this.props.title !== nextProps.title) { + this.props.updateTitle(nextProps.title); + } const { params: { dashedName } } = nextProps; if ( this.props.params.dashedName !== dashedName &&