diff --git a/src/shared/components/TrackHomePages/HowToCompetePage/FAQ/index.jsx b/src/shared/components/TrackHomePages/HowToCompetePage/FAQ/index.jsx index ebbb86785c..07580a36a7 100644 --- a/src/shared/components/TrackHomePages/HowToCompetePage/FAQ/index.jsx +++ b/src/shared/components/TrackHomePages/HowToCompetePage/FAQ/index.jsx @@ -8,7 +8,7 @@ import './styles.scss'; import QAComponent from '../QAComponent'; -const FAQ = ({ data }) => ( +const FAQ = ({ data, hashLink }) => (
{ data.AQs.map((question, index) => ( @@ -16,6 +16,7 @@ const FAQ = ({ data }) => ( data={question.fields} key={question.fields.title} isLastItem={(index + 1) === data.AQs.length ? 'last-item' : ''} + isActive={hashLink === question.fields.title} /> )) } @@ -25,6 +26,7 @@ const FAQ = ({ data }) => ( FAQ.propTypes = { data: PT.shape().isRequired, + hashLink: PT.string.isRequired, }; export default FAQ; diff --git a/src/shared/components/TrackHomePages/HowToCompetePage/QAComponent/index.jsx b/src/shared/components/TrackHomePages/HowToCompetePage/QAComponent/index.jsx index eb20000f45..a4ce5c1482 100644 --- a/src/shared/components/TrackHomePages/HowToCompetePage/QAComponent/index.jsx +++ b/src/shared/components/TrackHomePages/HowToCompetePage/QAComponent/index.jsx @@ -14,7 +14,7 @@ class QAComponent extends React.Component { constructor(props) { super(props); this.state = { - isActive: false, + isActive: props.isActive, }; } @@ -30,7 +30,7 @@ class QAComponent extends React.Component { const { isActive } = this.state; const className = `container ${isLastItem}`; return ( -
+
{ +const HowToCompetePage = ({ howToCompete, location }) => { + const hashLink = decodeURIComponent(location.hash.substring(1)); const data = howToCompete; let faq = {}; let howToExtras = {}; @@ -96,7 +97,10 @@ Step by Step

Extras

- +

@@ -105,7 +109,10 @@ FAQ
Here are a few answers to our most common questions
- +

@@ -117,6 +124,7 @@ Here are a few answers to our most common questions HowToCompetePage.propTypes = { howToCompete: PT.shape().isRequired, + location: PT.shape().isRequired, }; export default HowToCompetePage; diff --git a/src/shared/containers/TrackHomePages/HowToCompetePage.jsx b/src/shared/containers/TrackHomePages/HowToCompetePage.jsx index 565098dc13..15187fab45 100644 --- a/src/shared/containers/TrackHomePages/HowToCompetePage.jsx +++ b/src/shared/containers/TrackHomePages/HowToCompetePage.jsx @@ -11,7 +11,7 @@ import LoadingIndicator from 'components/LoadingIndicator'; import Error404 from 'components/Error404'; import ContentfulLoader from '../ContentfulLoader'; -const HowToCompetePageContainer = ({ match }) => ( +const HowToCompetePageContainer = ({ match, location }) => ( ( render={() => ( )} renderPlaceholder={LoadingIndicator} @@ -49,6 +50,7 @@ HowToCompetePageContainer.propTypes = { track: PT.string, }), }).isRequired, + location: PT.shape().isRequired, }; export default withRouter(HowToCompetePageContainer);