From 0d8e28ba31d825c196317e936534e1e51992a783 Mon Sep 17 00:00:00 2001 From: Alex Soloviev Date: Wed, 3 Jul 2024 15:58:42 -0700 Subject: [PATCH 001/106] initial commit --- components/Layout/index.tsx | 33 ++++++++++++--------- components/StepperPage/index.tsx | 13 ++++++++ pages/stepper/index.tsx | 51 ++++++++++++++++++++++++++++++++ 3 files changed, 83 insertions(+), 14 deletions(-) create mode 100644 components/StepperPage/index.tsx create mode 100644 pages/stepper/index.tsx diff --git a/components/Layout/index.tsx b/components/Layout/index.tsx index d5561ff52..31258bd26 100644 --- a/components/Layout/index.tsx +++ b/components/Layout/index.tsx @@ -98,6 +98,7 @@ export const Layout: React.VFC<{ if ( router.pathname === '/questions' || + router.pathname === '/stepper' || router.pathname === '/results' || router.pathname === '/resultats' ) { @@ -147,20 +148,24 @@ export const Layout: React.VFC<{ logoAltText: tsln.logoAltText, }} /> -

- {title} -

-
- -
+ {router.pathname !== '/stepper' && ( +
+

+ {title} +

+
+ +
+
+ )} {children} diff --git a/components/StepperPage/index.tsx b/components/StepperPage/index.tsx new file mode 100644 index 000000000..b436b616f --- /dev/null +++ b/components/StepperPage/index.tsx @@ -0,0 +1,13 @@ +import React from 'react' + +const StepperPage: React.FC = () => { + return ( +
+

Hello World

+
+ ) +} + +export default StepperPage + +// Make a mock page where we have a bare bones stepper with hardcoded content that you can step through and see the content change diff --git a/pages/stepper/index.tsx b/pages/stepper/index.tsx new file mode 100644 index 000000000..6fa9ca7f0 --- /dev/null +++ b/pages/stepper/index.tsx @@ -0,0 +1,51 @@ +import { NextPage } from 'next' +import { QuestionsPage } from '../../components/QuestionsPage' +import { Layout } from '../../components/Layout' +import { useTranslation } from '../../components/Hooks' +import { WebTranslations } from '../../i18n/web' +import { useEffect } from 'react' +import Head from 'next/head' +import { useRouter } from 'next/router' +import StepperPage from '../../components/StepperPage' + +const Stepper: NextPage<{ adobeAnalyticsUrl: string }> = ({ + adobeAnalyticsUrl, +}) => { + const tsln = useTranslation() + const language = useRouter().locale + + useEffect(() => { + if (adobeAnalyticsUrl) { + window.adobeDataLayer = window.adobeDataLayer || [] + window.adobeDataLayer.push({ event: 'pageLoad' }) + } + }, []) // eslint-disable-line react-hooks/exhaustive-deps + + return ( + <> + + {adobeAnalyticsUrl ? + ) : ( + '' + )} + + ) +} + +export const getStaticProps = async () => { + return { + props: { + adobeAnalyticsUrl: process.env.ADOBE_ANALYTICS_URL, + }, + } +} + +export default Stepper From 8558356590a6669d96fe42393f6c7da02c58fb46 Mon Sep 17 00:00:00 2001 From: Alex Soloviev Date: Thu, 25 Jul 2024 11:02:21 -0700 Subject: [PATCH 002/106] new files --- components/Stepper/index.tsx | 54 ++++++++++++++++++++++++++++++++ components/StepperPage/index.tsx | 16 +++++++++- 2 files changed, 69 insertions(+), 1 deletion(-) create mode 100644 components/Stepper/index.tsx diff --git a/components/Stepper/index.tsx b/components/Stepper/index.tsx new file mode 100644 index 000000000..7965bbe35 --- /dev/null +++ b/components/Stepper/index.tsx @@ -0,0 +1,54 @@ +/* eslint-disable jsx-a11y/anchor-is-valid */ +// import PropTypes from "prop-types"; +import React from 'react' +import { Button } from '../Forms/Button' + +export function Stepper(props) { + return ( +
+
+

+
+ {props.name} +
+
+ {props.step}: {props.heading} +
+

+ {props.children} +
+ {props.previousProps && ( +
+
+ )} + {props.nextProps && ( +
+
+ )} +
+
+
+ ) +} + +Stepper.defaultProps = { + href: '#', +} diff --git a/components/StepperPage/index.tsx b/components/StepperPage/index.tsx index b436b616f..75adeb66f 100644 --- a/components/StepperPage/index.tsx +++ b/components/StepperPage/index.tsx @@ -1,9 +1,23 @@ import React from 'react' +import { Stepper } from '../Stepper' const StepperPage: React.FC = () => { return (
-

Hello World

+ console.log('Previous button clicked'), + }} + nextProps={{ + id: 'next', + onClick: () => console.log('Next button clicked'), + }} + />
) } From dc39caeddbda64f7812692adf3883368a64749d6 Mon Sep 17 00:00:00 2001 From: Alex Soloviev Date: Fri, 26 Jul 2024 12:21:56 -0700 Subject: [PATCH 003/106] dont pass children as props --- components/QuestionsPage/index.tsx | 4 +- components/Stepper/index.tsx | 4 +- components/StepperPage/index.tsx | 75 +++++++++++++++++++++++++++--- pages/stepper/index.tsx | 1 - utils/web/helpers/utils.ts | 2 +- 5 files changed, 74 insertions(+), 12 deletions(-) diff --git a/components/QuestionsPage/index.tsx b/components/QuestionsPage/index.tsx index a1ceccbe9..89a509401 100644 --- a/components/QuestionsPage/index.tsx +++ b/components/QuestionsPage/index.tsx @@ -96,7 +96,7 @@ export const QuestionsPage: React.VFC = ({}) => { tsln, allFieldConfigs ) - + console.log('keyStepMap', keyStepMap) const [cardsValid, setCardsValid] = useState( getStepValidity(keyStepMap, form, inputs) ) @@ -220,7 +220,7 @@ export const QuestionsPage: React.VFC = ({}) => { stepKeys.includes(field.key) ) - console.log('------ Generate Children ------') + // console.log('------ Generate Children ------') return fields.map((field: FormField) => { const [formError, alertError] = getErrorForField( field, diff --git a/components/Stepper/index.tsx b/components/Stepper/index.tsx index 7965bbe35..95a608ac8 100644 --- a/components/Stepper/index.tsx +++ b/components/Stepper/index.tsx @@ -21,7 +21,7 @@ export function Stepper(props) {
- {props.step}: {props.heading} + {`Step ${props.activeStep} of ${props.totalSteps}`}: {props.heading}
{props.children}
- {props.previousProps && ( + {props.previousProps && props.activeStep !== 1 && (