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);