fix: correction de la sélection d'année de simulation

site/source/components/SelectSimulationYear.tsx

@@ -3,8 +3,9 @@ import { useDispatch } from 'react-redux'
 import { styled } from 'styled-components'
 
 import Banner from '@/components/Banner'
-import { Link as DesignSystemLink } from '@/design-system/typography/link'
+import { Link } from '@/design-system/typography/link'
 import { enregistreLaRéponse } from '@/store/actions/actions'
+import { getCurrentYear, getYearsBetween } from '@/utils/dates'
 
 import useYear from './utils/useYear'
 
@@ -14,41 +15,47 @@ const Bold = styled.span<{ $bold: boolean }>`
 
 export const SelectSimulationYear = () => {
 	const dispatch = useDispatch()
-	const choices = [2023, 2024]
-
-	const actualYear = useYear()
-
-	// return null // Waiting for next year.
+	const currentYear = getCurrentYear()
+	const choices = getYearsBetween(2023, currentYear)
+	const currentEngineYear = useYear()
 
 	return (
 		<Banner hideAfterFirstStep={false} icon={'📅'}>
 			<Trans i18nKey="pages.simulateurs.select-year.info">
 				Cette simulation concerne l'année{' '}
-				<Bold $bold={actualYear !== 2024}>{{ actualYear }}</Bold>.{' '}
+				<Bold $bold={currentEngineYear !== currentYear}>
+					{{ currentEngineYear }}
+				</Bold>
+				.{' '}
 			</Trans>
 			<>
 				{choices
-					.filter((year) => year !== actualYear)
+					.filter((year) => year !== currentEngineYear)
+					.reverse()
 					.map((year) => (
 						<span key={year}>
-							<DesignSystemLink
+							<StyledLink
 								onPress={() =>
 									dispatch(enregistreLaRéponse('date', `01/01/${year}`))
 								}
 							>
-								{actualYear === 2024 ? (
-									<Trans i18nKey="pages.simulateurs.select-year.access">
-										Accéder au simulateur {{ year }}
-									</Trans>
-								) : (
+								{year === currentYear ? (
 									<Trans i18nKey="pages.simulateurs.select-year.back">
 										Retourner au simulateur {{ year }}
 									</Trans>
+								) : (
+									<Trans i18nKey="pages.simulateurs.select-year.access">
+										Accéder au simulateur {{ year }}
+									</Trans>
 								)}
-							</DesignSystemLink>
+							</StyledLink>
 						</span>
 					))}
 			</>
 		</Banner>
 	)
 }
+
+const StyledLink = styled(Link)`
+	margin-right: ${({ theme }) => theme.spacings.xs};
+`

site/source/components/utils/useDate.tsx

@@ -0,0 +1,7 @@
+import { useEngine } from './EngineContext'
+
+export default function useDate() {
+	const date = useEngine().evaluate('date')
+
+	return date.nodeValue
+}

site/source/components/utils/useYear.ts

@@ -1,9 +1,7 @@
-import { useEngine } from './EngineContext'
+import useDate from './useDate'
 
 export default function useYear() {
-	const year = useEngine().evaluate('date')
+	const date = useDate()
 
-	return Number(
-		year.nodeValue?.toString().slice(-4) || new Date().getFullYear()
-	)
+	return Number(date?.toString().slice(-4) || new Date().getFullYear())
 }

site/source/locales/ui-en.yaml

@@ -1684,7 +1684,7 @@ pages:
     select-year:
       access: Access the simulator {{year}}
       back: Back to simulator {{year}}
-      info: "This simulation concerns the year <2>{{actualYear}}</2>. "
+      info: "This simulation concerns the year <2>{{currentEngineYear}}</2>. "
 payslip:
   disclaimer: "This payslip is the result of the simulation you made. It helps you
     to understand your pay slip: you can click on the links to understand how

site/source/locales/ui-fr.yaml

@@ -1792,7 +1792,7 @@ pages:
     select-year:
       access: Accéder au simulateur {{year}}
       back: Retourner au simulateur {{year}}
-      info: "Cette simulation concerne l'année <2>{{actualYear}}</2>. "
+      info: "Cette simulation concerne l'année <2>{{currentEngineYear}}</2>. "
 payslip:
   disclaimer: "Cette fiche de paie est issue de la simulation que vous avez faite.
     Elle vous aide à comprendre votre bulletin de paie : vous pouvez cliquer sur

site/source/utils/dates.ts

@@ -0,0 +1,13 @@
+export const getCurrentYear = () => {
+	return new Date().getFullYear()
+}
+
+export const getYearsBetween = (
+	startYear: number,
+	currentYear: number
+): number[] => {
+	return Array.from(
+		{ length: currentYear - startYear + 1 },
+		(_, i) => startYear + i
+	)
+}