Merge branch 'preprod' into update-model-version

incubateur-ademe · Jan 27, 2025 · 522f721 · 522f721
2 parents 7d4fee5 + c3e1183
commit 522f721
Show file tree

Hide file tree

Showing 9 changed files with 165 additions and 161 deletions.
diff --git a/src/app/_components/MainLayoutProviders.tsx b/src/app/_components/MainLayoutProviders.tsx
@@ -1,6 +1,7 @@
 'use client'
 
 import ErrorBoundary from '@/components/error/ErrorBoundary'
+import { STORAGE_KEY } from '@/constants/storage'
 import { UserProvider } from '@/publicodes-state'
 import type { RegionFromGeolocation } from '@/publicodes-state/types'
 import migrationInstructions from '@incubateur-ademe/nosgestesclimat/public/migration.json'
@@ -22,7 +23,7 @@ export default function MainLayoutProviders({
       <IframeOptionsProvider>
         <QueryClientProviderWrapper>
           <UserProvider
-            storageKey="nosgestesclimat::v3"
+            storageKey={STORAGE_KEY}
             migrationInstructions={migrationInstructions}
             initialRegion={initialRegion}>
             <PreventNavigationProvider>

diff --git a/src/components/layout/Footer.tsx b/src/components/layout/Footer.tsx
@@ -18,7 +18,6 @@ import {
   footerClickQuiSommesNous,
 } from '@/constants/tracking/layout'
 import InlineLink from '@/design-system/inputs/InlineLink'
-import Separator from '@/design-system/layout/Separator'
 import { useIframe } from '@/hooks/useIframe'
 import { useLocale } from '@/hooks/useLocale'
 import { trackEvent } from '@/utils/matomo/trackEvent'
@@ -47,172 +46,149 @@ export default function Footer({ className = '' }) {
   return (
     <footer
       className={twMerge(
-        'relative flex flex-col items-center gap-4 bg-gray-100 p-4 !pb-32 sm:p-8 md:mb-0',
+        'relative bg-gray-100 p-4 !pb-32 sm:p-8 md:mx-auto md:mb-0 md:max-w-6xl',
         className,
         shouldUseWhiteBackground ? 'bg-white' : ''
       )}>
-      <div className="flex w-full flex-col items-start gap-2 md:max-w-5xl md:flex-row md:gap-12">
-        <Logo onClick={() => trackEvent(footerClickLogo)} />
-
-        <div className="flex-1">
-          <div className="flex flex-col flex-wrap justify-start gap-x-5 gap-y-2 pt-4 sm:flex-row md:items-center">
-            <InlineLink
-              href="/a-propos"
-              onClick={() => trackEvent(footerClickQuiSommesNous)}
-              className="text-default no-underline hover:underline">
-              <strong>
-                <Trans>À propos</Trans>
-              </strong>
-            </InlineLink>
-
-            <InlineLink
-              href="/empreinte-eau"
-              className="text-default no-underline hover:underline">
-              <strong>
-                <Trans>Empreinte eau</Trans>
-              </strong>
-            </InlineLink>
-
-            <InlineLink
-              href="/blog"
-              onClick={() => trackEvent(footerClickBlog)}
-              className="text-default no-underline hover:underline">
-              <strong>
-                <Trans>Blog</Trans>
-              </strong>
-            </InlineLink>
-
-            <InlineLink
-              href="/nouveautes"
-              onClick={() => trackEvent(footerClickNouveautes)}
-              className="text-default no-underline hover:underline">
-              <strong>
-                <Trans>Nouveautés</Trans>
-              </strong>
-            </InlineLink>
-
-            <InlineLink
-              href="/documentation"
-              onClick={() => trackEvent(footerClickDocumentation)}
-              className="text-default no-underline hover:underline">
-              <strong>
-                <Trans>Documentation</Trans>
-              </strong>
-            </InlineLink>
-
-            <InlineLink
-              href="/questions-frequentes"
-              onClick={() => trackEvent(footerClickFAQ)}
-              className="text-default no-underline hover:underline">
-              <strong>
-                <Trans>FAQ</Trans>
-              </strong>
-            </InlineLink>
-
-            <InlineLink
-              href="/contact"
-              onClick={() => trackEvent(footerClickContact)}
-              className="text-default no-underline hover:underline">
-              <strong>
-                <Trans>Contact</Trans>
-              </strong>
-            </InlineLink>
+      <Logo className="mb-8" onClick={() => trackEvent(footerClickLogo)} />
+
+      <div className="mb-10 flex flex-col flex-wrap justify-start gap-x-16 gap-y-8 pt-4 md:flex-row lg:flex-nowrap">
+        <div className="flex flex-col gap-y-2">
+          <h3 className="mb-0 text-sm font-bold text-default">
+            <Trans>À propos</Trans>
+          </h3>
+          <InlineLink
+            href="/a-propos"
+            onClick={() => trackEvent(footerClickQuiSommesNous)}
+            className="text-sm text-default no-underline hover:underline">
+            <Trans>Qui sommes-nous</Trans>
+          </InlineLink>
+
+          <InlineLink
+            href="/plan-du-site"
+            onClick={() => trackEvent(footerClickPlanSite)}
+            className="text-sm text-default no-underline hover:underline">
+            <Trans>Plan du site</Trans>
+          </InlineLink>
+
+          <InlineLink
+            href="/contact"
+            onClick={() => trackEvent(footerClickContact)}
+            className="text-sm text-default no-underline hover:underline">
+            <Trans>Contact</Trans>
+          </InlineLink>
+
+          <InlineLink
+            href="/international"
+            onClick={() => trackEvent(footerClickInternational)}
+            className="text-sm text-default no-underline hover:underline">
+            <Trans>International</Trans>
+          </InlineLink>
+        </div>
 
-            <InlineLink
-              href="/plan-du-site"
-              onClick={() => trackEvent(footerClickPlanSite)}
-              className="font-bold text-default no-underline hover:underline">
-              <Trans>Plan du site</Trans>
-            </InlineLink>
+        <div className="flex flex-col gap-y-2">
+          <h3 className="mb-0 text-sm font-bold text-default">
+            <Trans>Diffusion</Trans>
+          </h3>
+          <InlineLink
+            href="/diffuser"
+            onClick={() => trackEvent(footerClickDiffusion)}
+            className="text-sm text-default no-underline hover:underline">
+            <Trans>Diffuser Nos Gestes Climat</Trans>
+          </InlineLink>
+
+          <InlineLink
+            href="/organisations"
+            onClick={() => trackEvent(footerClickOrganisations)}
+            className="text-sm text-default no-underline hover:underline">
+            <Trans>Organisations</Trans>
+          </InlineLink>
+
+          <InlineLink
+            href="/nos-relais"
+            onClick={() => trackEvent(footerClickAmbassadeurs)}
+            className="text-sm text-default no-underline hover:underline">
+            <Trans>Relais et partenaires</Trans>
+          </InlineLink>
+        </div>
 
-            {/* Hack in order to force Diffusion to be on a new line on desktop */}
-            <div className="hidden w-full lg:block" />
+        <div className="flex flex-col gap-y-2">
+          <h3 className="mb-0 text-sm font-bold text-default">
+            <Trans>Ressources</Trans>
+          </h3>
+
+          <InlineLink
+            href="/blog"
+            onClick={() => trackEvent(footerClickBlog)}
+            className="text-sm text-default no-underline hover:underline">
+            <Trans>Blog</Trans>
+          </InlineLink>
+
+          <InlineLink
+            href="/documentation"
+            onClick={() => trackEvent(footerClickDocumentation)}
+            className="text-sm text-default no-underline hover:underline">
+            <Trans>Documentation</Trans>
+          </InlineLink>
+
+          <InlineLink
+            href="/questions-frequentes"
+            onClick={() => trackEvent(footerClickFAQ)}
+            className="text-sm text-default no-underline hover:underline">
+            <Trans>FAQ</Trans>
+          </InlineLink>
+
+          <InlineLink
+            href="/nouveautes"
+            onClick={() => trackEvent(footerClickNouveautes)}
+            className="text-sm text-default no-underline hover:underline">
+            <Trans>Nouveautés</Trans>
+          </InlineLink>
+
+          <InlineLink
+            href="https://impactco2.fr"
+            target="_blank"
+            className="text-sm text-default no-underline hover:underline"
+            onClick={() => trackEvent(footerClickImpactco2)}>
+            Impact CO2
+          </InlineLink>
+        </div>
+      </div>
 
-            <InlineLink
-              href="/diffuser"
-              onClick={() => trackEvent(footerClickDiffusion)}
-              className="font-bold text-default no-underline hover:underline">
-              <Trans>Diffusion</Trans>
-            </InlineLink>
+      <div className="flex flex-wrap justify-between gap-8 md:flex-row md:flex-nowrap">
+        <div>
+          <div className="mt-6 flex flex-wrap items-start justify-between gap-10">
+            <LanguageSwitchButton />
+          </div>
 
-            <InlineLink
-              href="/organisations"
-              onClick={() => trackEvent(footerClickOrganisations)}
-              className="font-bold text-default no-underline hover:underline">
-              <Trans>Organisations</Trans>
+          <div className="mt-4 text-xs">
+            <InlineLink href="/accessibilite">
+              <Trans>Accessibilité : partiellement conforme</Trans>
             </InlineLink>
-
-            <InlineLink
-              href="/nos-relais"
-              onClick={() => trackEvent(footerClickAmbassadeurs)}
-              className="text-default no-underline hover:underline">
-              <strong>
-                <Trans>Nos relais</Trans>
-              </strong>
+            <span className="mx-1 hidden sm:inline"> | </span>
+            <br className="md:hidden" />
+            <InlineLink href="/mentions-legales">
+              <Trans>Mentions légales</Trans>
             </InlineLink>
-
-            <InlineLink
-              href="/international"
-              onClick={() => trackEvent(footerClickInternational)}
-              className="font-bold text-default no-underline hover:underline">
-              <Trans>International</Trans>
+            <span className="mx-1 hidden sm:inline"> | </span>
+            <br className="md:hidden" />
+            <InlineLink href="/politique-de-confidentialite">
+              <Trans>Politique de confidentialité</Trans>
             </InlineLink>
-
-            <InlineLink
-              href="https://impactco2.fr"
-              target="_blank"
-              className="font-bold text-default no-underline hover:underline"
-              onClick={() => trackEvent(footerClickImpactco2)}>
-              Impact CO2
+            <span className="mx-1 hidden sm:inline"> | </span>
+            <br className="md:hidden" />
+            <InlineLink href="/politique-des-cookies">
+              <Trans>Politique des cookies</Trans>
             </InlineLink>
           </div>
+        </div>
 
-          <Separator className="mb-0 mt-6 md:mt-4" />
-
-          <div className="flex flex-wrap justify-between gap-8 md:flex-row md:flex-nowrap">
-            <div>
-              <div className="mt-6 flex flex-wrap items-start justify-between gap-10">
-                <LanguageSwitchButton />
-              </div>
-
-              <div className="mt-4 text-xs">
-                <InlineLink
-                  href="/accessibilite"
-                  className="text-default no-underline hover:underline">
-                  <Trans>Accessibilité : partiellement conforme</Trans>
-                </InlineLink>
-                <span className="hidden sm:inline"> | </span>
-                <br className="md:hidden" />
-                <InlineLink
-                  href="/mentions-legales"
-                  className="text-default no-underline hover:underline">
-                  <Trans>Mentions légales</Trans>
-                </InlineLink>
-                <span className="hidden sm:inline"> | </span>
-                <br className="md:hidden" />
-                <InlineLink
-                  href="/politique-de-confidentialite"
-                  className="text-default no-underline hover:underline">
-                  <Trans>Politique de confidentialité</Trans>
-                </InlineLink>
-                <span className="hidden sm:inline"> | </span>
-                <br className="md:hidden" />
-                <InlineLink
-                  href="/politique-des-cookies"
-                  className="text-default no-underline hover:underline">
-                  <Trans>Politique des cookies</Trans>
-                </InlineLink>
-              </div>
-            </div>
-
-            <div className="flex gap-4 self-end pb-1">
-              <Marianne className="h-auto w-12 md:w-auto" />
-
-              <Link href="https://ademe.fr" target="_blank">
-                <Ademe className="h-auto w-10 md:w-auto" />
-              </Link>
-            </div>
-          </div>
+        <div className="flex gap-4 self-end pb-1">
+          <Marianne className="h-auto w-12 md:w-auto" />
+
+          <Link href="https://ademe.fr" target="_blank">
+            <Ademe className="h-auto w-10 md:w-auto" />
+          </Link>
         </div>
       </div>
     </footer>

diff --git a/src/constants/storage.ts b/src/constants/storage.ts
@@ -0,0 +1 @@
+export const STORAGE_KEY = 'nosgestesclimat::v3'
diff --git a/src/design-system/inputs/TextInputGroup.tsx b/src/design-system/inputs/TextInputGroup.tsx
@@ -2,10 +2,9 @@ import type {
   ChangeEventHandler,
   ForwardedRef,
   HTMLAttributes,
-  ReactNode} from 'react';
-import {
-  forwardRef,
+  ReactNode,
 } from 'react'
+import { forwardRef } from 'react'
 import { DebounceInput } from 'react-debounce-input'
 import { twMerge } from 'tailwind-merge'
 
@@ -14,7 +13,8 @@ type Props = {
   label?: string | ReactNode
   type?: string
   isInvalid?: boolean
-  error?: string
+  error?: string | ReactNode
+  successMessage?: ReactNode | string
   helperText?: string | ReactNode
   className?: string
   containerClassName?: string
@@ -35,6 +35,7 @@ export default forwardRef(function TextInputGroup(
     label,
     type = 'text',
     error,
+    successMessage,
     helperText,
     className,
     containerClassName,
@@ -102,6 +103,10 @@ export default forwardRef(function TextInputGroup(
           {error}
         </span>
       )}
+
+      {successMessage && (
+        <span className="mt-2 text-xs text-green-700">{successMessage}</span>
+      )}
     </div>
   )
 })
diff --git a/src/hooks/settings/useUpdateUserSettings.ts b/src/hooks/settings/useUpdateUserSettings.ts
@@ -18,7 +18,7 @@ export function useUpdateUserSettings({ email, userId }: Props) {
     mutationKey: ['updateUserSettings', email, userId],
     mutationFn: async ({ name, newsletterIds, email: emailParam }: FuncProps) =>
       axios.post(SERVER_URL + '/update-settings', {
-        email: email || emailParam,
+        email: emailParam || email,
         userId,
         name,
         newsletterIds,

diff --git a/src/locales/ui/ui-en.yaml b/src/locales/ui/ui-en.yaml
@@ -1551,4 +1551,11 @@ entries:
   En participant vous acceptez que vos résultats soient partagés anonymement avec cette organisation.: By taking part, you agree to your results being shared anonymously with this organisation.
   Il est question ici des modes "Organisations" et "Challenge tes amis". Cette section est générée via Metabase.: We are talking here about the "Organisations" and "Challenge your friends" modes. This section is generated via Metabase.
   Cette section statistique est générée via Metabase.: This statistical section is generated via Metabase.
+  Ressources: Resources
+  Qui sommes-nous: Who we are
+  Relais et partenaires: Relays and partners
+  Inscrivez-vous à notre infolettre: Subscribe to our newsletter
+  Bien noté ! Vous aurez prochainement de nos nouvelles.: Duly noted! You'll be hearing from us soon.
+  Super, vous êtes déjà inscrit !: Great, you're already registered!
+  Diffuser Nos Gestes Climat: Spreading Our Gestes Climat
   'Oups, une erreur est survenue lors de la copie du lien, voici le lien à copier / coller :': 'Oops, there was an error copying the link, here is the link to copy / paste :'
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1 @@
		export const STORAGE_KEY = 'nosgestesclimat::v3'