🔖 Release 2.42.0 (#1423)

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: Clément <55186402+Clemog@users.noreply.github.com>
Co-authored-by: Benjamin Arias <12382534+bjlaa@users.noreply.github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Clément <clem.auger@hotmail.fr>
Co-authored-by: Paul Souche <paul@bettercallpaul.fr>
Co-authored-by: Bot Incubateur Ademe <153178900+incubateur-ademe-admin@users.noreply.github.com>

Author: 5 people

.husky/pre-push-default

@@ -4,5 +4,3 @@ yarn lint || exit 1
 
 # Run TypeScript type checks and exit if there are errors
 yarn lint:types || exit 1
-
-yarn test

package.json

@@ -1,7 +1,7 @@
 {
   "name": "nosgestesclimat-site-nextjs",
   "license": "MIT",
-  "version": "2.41.0",
+  "version": "2.42.0",
   "description": "The leading open source climate footprint calculator",
   "type": "module",
   "repository": {

src/app/[locale]/(narrow-layout)/(pages-statiques)/politique-de-confidentialite/policy_en.mdx

@@ -107,10 +107,6 @@ Data Subjects may communicate their Personal Data to ADEME through various means
 
 ## 5. Processing purposes and legal bases
 
-For temporary and specific partnerships (contests, prizes to be won), ADEME's partners receive only email and identification data to contact winners and provide them with their prizes
-
-
-## 6\. How long is personal data retained?
 The purposes of Personal Data Processing carried out by ADEME are based on the following legal bases: contractual execution, consent of Data Subjects, ADEME's legal and regulatory obligations, its legitimate interest or public interest mission.
 
 The purposes associated with each legal basis are listed below:

src/app/[locale]/(simulation)/(large-layout)/profil/_components/simulationBanner/_components/TutorialLink.tsx

@@ -6,6 +6,7 @@ import { profilClickTutoriel } from '@/constants/tracking/pages/profil'
 import ButtonLink from '@/design-system/buttons/ButtonLink'
 import { getLinkToTutoriel } from '@/helpers/navigation/simulateurPages'
 import { useLocale } from '@/hooks/useLocale'
+import { useSearchParams } from 'next/navigation'
 import { twMerge } from 'tailwind-merge'
 
 type Props = {
@@ -14,11 +15,12 @@ type Props = {
 
 export default function TutorialLink({ className }: Props) {
   const locale = useLocale()
+  const searchParams = useSearchParams()
 
   return (
     <ButtonLink
       color="text"
-      href={getLinkToTutoriel({ locale })}
+      href={getLinkToTutoriel({ locale, currentSearchParams: searchParams })}
       className={twMerge('flex w-full justify-center', className)}
       trackingEvent={profilClickTutoriel}>
       <GlassesIcon className="fill-primary-700 mr-2" />

src/app/[locale]/(simulation)/(large-layout-nosticky)/fin/page.tsx

@@ -38,7 +38,8 @@ export default function FinPage() {
   const { currentMetric } = useCurrentMetric()
 
   const isIframe = getIsIframe()
-  const { isIframeShareData, isFrenchRegion } = useIframe()
+
+  const { isFrenchRegion, isIframeShareData } = useIframe()
 
   useEffect(() => {
     const titleTags = document.querySelectorAll('head > title')

src/app/[locale]/_components/mainLayoutProviders/IframeOptionsContext.tsx

@@ -2,9 +2,9 @@
 
 import { getIsFrenchRegion } from '@/helpers/regions/getIsFrenchRegion'
 import { useTrackIframe } from '@/hooks/tracking/useTrackIframe'
-import { useIsClient } from '@/hooks/useIsClient'
 import { useUser } from '@/publicodes-state'
 import { getIsIframe } from '@/utils/getIsIframe'
+import { useSearchParams } from 'next/navigation'
 import { createContext, useEffect, useState } from 'react'
 
 export const IframeOptionsContext = createContext<{
@@ -14,110 +14,83 @@ export const IframeOptionsContext = createContext<{
   isIframeOnlySimulation?: boolean
   iframeLang?: string | null
   isFrenchRegion?: boolean
+  containerRef?: React.RefObject<HTMLDivElement | null>
 }>({})
 
-const nullDecode = (string: string) =>
-  string == null ? string : decodeURIComponent(string)
-
 export const IframeOptionsProvider = ({
   children,
 }: {
   children: (
     containerRef: React.RefObject<HTMLDivElement | null>
   ) => React.ReactNode
 }) => {
-  const isClient = useIsClient()
-  const isIframe = isClient && getIsIframe()
-
-  const [iframeIntegratorOptions, setIframeIntegratorOptions] = useState({
-    integratorLogo: null,
-    integratorName: null,
-    integratorActionUrl: null,
-    integratorYoutubeVideo: null,
-    integratorActionText: null,
-  })
+  const searchParams = useSearchParams()
+  const { user } = useUser()
+
+  // Detect iframe mode using window check
+  const isIframe = typeof window !== 'undefined' && getIsIframe()
+
   const [isIframeShareData, setIsIframeShareData] = useState(false)
   const [isIframeOnlySimulation, setIsIframeOnlySimulation] = useState(false)
   const [iframeLang, setIframeLang] = useState<string | null>(null)
   const [iframeRegion, setIframeRegion] = useState<string | null>(null)
 
   const containerRef = useTrackIframe(isIframe)
 
+  // Read iframe parameters from URL
   useEffect(() => {
-    if (isIframe) return
-
-    const urlParams = new URLSearchParams(window.location.search)
-
-    setIframeIntegratorOptions(
-      Object.fromEntries(
-        [
-          'integratorLogo',
-          'integratorName',
-          'integratorActionUrl',
-          'integratorYoutubeVideo',
-          'integratorActionText',
-        ].map((key) => [
-          key,
-          nullDecode(
-            new URLSearchParams(document.location.search).get(key) ?? ''
-          ),
-        ])
-      ) as any
-    )
+    if (!isIframe) return
 
     if (!isIframeShareData) {
-      setIsIframeShareData(Boolean(urlParams.get('shareData')))
+      setIsIframeShareData(Boolean(searchParams.get('shareData')))
     }
 
     if (!isIframeOnlySimulation) {
-      setIsIframeOnlySimulation(Boolean(urlParams.get('onlySimulation')))
+      setIsIframeOnlySimulation(Boolean(searchParams.get('onlySimulation')))
     }
 
     if (!iframeRegion) {
-      setIframeRegion(urlParams.get('region'))
+      setIframeRegion(searchParams.get('region'))
     }
 
     if (!iframeLang) {
-      setIframeLang(urlParams.get('lang'))
+      setIframeLang(searchParams.get('lang'))
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [isIframe])
+  }, [isIframe, searchParams])
 
+  // Add body classes for iframe styling
   useEffect(() => {
     if (isIframe) {
-      // Add class to body to modify the style of the page on iframe mode
       document.body.classList.add('iframe-mode')
     }
   }, [isIframe])
 
   useEffect(() => {
     if (isIframeOnlySimulation) {
-      // Add class to body that hides the header and the footer
       document.body.classList.add('iframeOnlySimulation')
     }
   }, [isIframeOnlySimulation])
 
-  const { user } = useUser()
-
   const regionCode = user?.region?.code
 
   const isFrenchRegion = getIsFrenchRegion({
-    isIframe,
+    isIframe: isIframe ?? false,
     iframeRegion: regionCode,
   })
 
   return (
     <IframeOptionsContext.Provider
       value={{
-        ...iframeIntegratorOptions,
         isIframeShareData,
         iframeRegion: regionCode,
         isIframe,
         isIframeOnlySimulation,
         iframeLang,
         isFrenchRegion,
+        containerRef,
       }}>
-      {children(containerRef)}
+      {children(containerRef ?? { current: null })}
     </IframeOptionsContext.Provider>
   )
 }

src/app/[locale]/blog/[category]/[article]/_components/ArticleDate.tsx

@@ -0,0 +1,36 @@
+import type { ArticleType } from '@/adapters/cmsClient'
+import Trans from '@/components/translation/trans/TransServer'
+import type { Locale } from '@/i18nConfig'
+
+type Props = {
+  article: ArticleType
+  locale: Locale
+}
+
+export default function ArticleDate({ article, locale }: Props) {
+  const createdAt = article.createdAt
+    ? new Date(article.createdAt).toLocaleDateString('fr')
+    : null
+  const updatedAt = article.updatedAt
+    ? new Date(article.updatedAt).toLocaleDateString('fr')
+    : null
+
+  return (
+    <>
+      <p className="mb-0">
+        <span className="text-primary-600">
+          <Trans locale={locale}>Publié le :</Trans>
+        </span>{' '}
+        {createdAt}
+      </p>
+      {updatedAt && updatedAt !== createdAt && (
+        <p className="mb-0">
+          <span className="text-primary-600">
+            <Trans locale={locale}>Dernière mise à jour :</Trans>
+          </span>{' '}
+          {updatedAt}
+        </p>
+      )}
+    </>
+  )
+}

src/app/[locale]/blog/[category]/[article]/page.tsx

@@ -13,6 +13,7 @@ import type { DefaultPageProps } from '@/types'
 import Image from 'next/image'
 import { redirect } from 'next/navigation'
 import ArticleBreadcrumbs from './_components/ArticleBreadcrumbs'
+import ArticleDate from './_components/ArticleDate'
 import ArticleJSONLD from './_components/ArticleJSONLD'
 import AuthorBlock from './_components/AuthorBlock'
 import OtherArticles from './_components/OtherArticles'
@@ -106,25 +107,16 @@ export default async function ArticlePage({
               </Badge>
             </div>
 
-            <div className="flex flex-row gap-3">
-              <p className="mb-0 text-lg">
+            <div className="flex flex-col flex-wrap gap-1">
+              <p className="mb-0">
                 <span className="text-primary-600">
                   <Trans locale={locale}>Temps de lecture :</Trans>
                 </span>{' '}
                 {Math.round(article.duration / 60)}{' '}
                 <Trans locale={locale}>minutes</Trans>
               </p>
 
-              <span className="text-lg text-gray-500">|</span>
-
-              <p className="mb-0 text-lg">
-                <span className="text-primary-600">
-                  <Trans locale={locale}>Publié le :</Trans>
-                </span>{' '}
-                {article.createdAt
-                  ? new Date(article.createdAt).toLocaleDateString('fr')
-                  : ''}
-              </p>
+              <ArticleDate article={article} locale={locale} />
             </div>
           </div>
 

src/helpers/iframe/preserveIframeParams.ts

@@ -0,0 +1,49 @@
+import type { ReadonlyURLSearchParams } from 'next/navigation'
+
+/**
+ * List of iframe-related parameters that should be preserved across navigation
+ */
+export const IFRAME_PARAMS = [
+  'iframe',
+  'shareData',
+  'onlySimulation',
+  'region',
+  'lang',
+  'integratorUrl',
+  'PR',
+] as const
+
+export function preserveIframeParams(
+  currentSearchParams: ReadonlyURLSearchParams,
+  newParams: Record<string, string | null | undefined> = {}
+): URLSearchParams {
+  const preservedParams = new URLSearchParams()
+
+  // Preserve existing iframe params
+  IFRAME_PARAMS.forEach((param) => {
+    const value = currentSearchParams.get(param)
+    if (value) {
+      preservedParams.set(param, value)
+    }
+  })
+
+  // Add/override with new params
+  Object.entries(newParams).forEach(([key, value]) => {
+    if (value !== null && value !== undefined) {
+      preservedParams.set(key, value)
+    }
+  })
+
+  return preservedParams
+}
+
+export function buildUrlWithPreservedParams(
+  pathname: string,
+  currentSearchParams: ReadonlyURLSearchParams,
+  newParams: Record<string, string | null | undefined> = {}
+): string {
+  const searchParams = preserveIframeParams(currentSearchParams, newParams)
+  const searchString = searchParams.toString()
+
+  return searchString ? `${pathname}?${searchString}` : pathname
+}

src/helpers/navigation/simulateurPages.ts

@@ -1,28 +1,57 @@
 import { SIMULATOR_PATH } from '@/constants/urls/paths'
+import { buildUrlWithPreservedParams } from '@/helpers/iframe/preserveIframeParams'
 import type { DottedName } from '@incubateur-ademe/nosgestesclimat'
+import type { ReadonlyURLSearchParams } from 'next/navigation'
 
 type Props = {
   question?: DottedName
   locale?: string
+  currentSearchParams?: ReadonlyURLSearchParams
 }
 
 type TutorielProps = {
   locale?: string
+  currentSearchParams?: ReadonlyURLSearchParams
 }
 
-export const getLinkToSimulateur = ({ question, locale }: Props = {}) => {
+export const getLinkToSimulateur = ({
+  question,
+  locale,
+  currentSearchParams,
+}: Props = {}) => {
   const basePath = locale ? `/${locale}` : ''
-  // If no question is provided, we return
+  const pathname = `${basePath}${SIMULATOR_PATH}`
+
+  // If no question is provided, we return the base path with preserved params
   if (!question) {
-    return `${basePath}${SIMULATOR_PATH}`
+    if (currentSearchParams) {
+      return buildUrlWithPreservedParams(pathname, currentSearchParams)
+    }
+    return pathname
+  }
+
+  // Build URL with question param and preserved iframe params
+  const questionParam = question.replaceAll(' . ', '.').replaceAll(' ', '_')
+
+  if (currentSearchParams) {
+    return buildUrlWithPreservedParams(pathname, currentSearchParams, {
+      question: questionParam,
+    })
   }
-  //
-  return `${basePath}${SIMULATOR_PATH}?question=${question
-    .replaceAll(' . ', '.')
-    .replaceAll(' ', '_')}`
+
+  return `${pathname}?question=${questionParam}`
 }
 
-export const getLinkToTutoriel = ({ locale }: TutorielProps = {}) => {
+export const getLinkToTutoriel = ({
+  locale,
+  currentSearchParams,
+}: TutorielProps = {}) => {
   const basePath = locale ? `/${locale}` : ''
-  return `${basePath}/tutoriel`
+  const pathname = `${basePath}/tutoriel`
+
+  if (currentSearchParams) {
+    return buildUrlWithPreservedParams(pathname, currentSearchParams)
+  }
+
+  return pathname
 }