Add staff page (WIP)

public/locales/fr/speakers.json

@@ -13,7 +13,7 @@
         "id": 1,
         "name": "Fred Plais",
         "company": "Platform.sh",
-        "companyLogo": "/images/speakers/platformsh.svg",
+        "companyLogo": "/images/logo/platformsh.svg",
         "companyUrl": "https://platform.sh/",
         "linkedin": "",
         "role": "CEO",
@@ -36,7 +36,7 @@
         "id": 2,
         "name": "Ivan Chepurnyi",
         "company": "EcomDev B.V.",
-        "companyLogo": "/images/speakers/ecomdevbv.gif",
+        "companyLogo": "/images/logo/ecomdevbv.gif",
         "companyUrl": "https://ivanchepurnyi.github.io/",
         "linkedin": "https://www.linkedin.com/in/ivanchepurnyi/",
         "role": "Magento Performance Expert",
@@ -59,7 +59,7 @@
         "id": 3,
         "name": "Adrien Illy",
         "company": "Agence Dn'D",
-        "companyLogo": "/images/speakers/dnd.svg",
+        "companyLogo": "/images/logo/dnd.svg",
         "companyUrl": "https://www.dnd.fr/",
         "linkedin": "https://fr.linkedin.com/in/illyadrien",
         "role": "Tech Expert",
@@ -82,7 +82,7 @@
         "id": 4,
         "name": "Hervé Guétin",
         "company": "Agence Dn'D",
-        "companyLogo": "/images/speakers/dnd.svg",
+        "companyLogo": "/images/logo/dnd.svg",
         "companyUrl": "https://www.dnd.fr/",
         "linkedin": "https://www.linkedin.com/in/herveguetin/",
         "role": "Tech Expert",

public/locales/fr/staff.json

@@ -0,0 +1,121 @@
+{
+  "title": "Les organisateurs",
+  "subtitle": "Qui se cache derrière Meet Magento France 2025 ?",
+  "images": [
+    "/images/media/staff2.jpeg",
+    "/images/media/staff1.jpeg"
+  ],
+  "description": "L’édition française de Meet Magento 2025 est un événement communautaire né d’une idée et d’une collaboration entre Dn’D, Hyvä, Opengento et PH2M. Ces entreprises, toutes engagées dans l’écosystème Magento et Adobe Commerce, ont uni leurs forces pour organiser cet événement unique, avec le soutien d’Adobe France, le support de plusieurs acteurs de la communauté et l’approbation de la Magento Association.\n\nCe salon, inédit en France, sera l’occasion de rassembler des experts, des marchands et des professionnels du secteur pour une journée d’échanges, de retours d’expérience et de démonstrations sur les solutions Magento et Adobe Commerce. Découvrez les acteurs qui œuvrent ensemble pour faire de cette rencontre un moment clé du commerce digital.",
+  "members": [
+    {
+      "name": "Camille Bénard",
+      "company": "Agence Dn'D",
+      "companyLogo": "/images/logo/dnd.svg",
+      "companyUrl": "https://www.dnd.fr/",
+      "linkedin": "https://www.linkedin.com/in/camille-b%C3%A9nard",
+      "role": "Responsable Communication et Marketing",
+      "image": "/images/staff/camille_benard.png",
+      "biography": ""
+    },
+    {
+      "name": "Julien Didier",
+      "company": "Agence Dn'D",
+      "companyLogo": "/images/logo/dnd.svg",
+      "companyUrl": "https://www.dnd.fr/",
+      "linkedin": "https://www.linkedin.com/in/julien-didier-%F0%9F%85%93%F0%9F%85%9D%F0%9F%85%93-0306278",
+      "role": "Président & Co-fondateur",
+      "image": "/images/staff/julien_didier.png",
+      "biography": ""
+    },
+    {
+      "name": "Thien-Lan Weber",
+      "company": "Hyvä",
+      "companyLogo": "/images/logo/hyva.svg",
+      "companyUrl": "https://www.hyva.io/",
+      "linkedin": "https://www.linkedin.com/in/thienlan",
+      "role": "VP Strategy & Marketing",
+      "image": "/images/staff/thien-lan_weber.png",
+      "biography": ""
+    },
+    {
+      "name": "Frédéric Martinez",
+      "company": "PH2M",
+      "companyLogo": "/images/logo/ph2m.svg",
+      "companyUrl": "https://www.ph2m.com/",
+      "linkedin": "https://www.linkedin.com/in/fr%C3%A9d%C3%A9ric-martinez-922aa319",
+      "role": "CEO & Founder",
+      "image": "/images/staff/frederic_martinez.png",
+      "biography": ""
+    },
+    {
+      "name": "Marion Sainty",
+      "company": "Blackbird",
+      "companyLogo": "/images/logo/blackbird.svg",
+      "companyUrl": "https://black.bird.eu/",
+      "linkedin": "https://www.linkedin.com/in/marion-sainty",
+      "role": "Développement commercial et digital",
+      "image": "/images/staff/marion_sainty.png",
+      "biography": ""
+    },
+    {
+      "name": "Cannelle Lemnos",
+      "company": "Ati4 Group",
+      "companyLogo": "/images/logo/ati4group.svg",
+      "companyUrl": "https://ati4group.com/",
+      "linkedin": "https://www.linkedin.com/in/cannelle-lemnos-consultante-communication",
+      "role": "Chargée de communication",
+      "image": "/images/staff/cannelle_lemnos.jpeg",
+      "biography": ""
+    },
+    {
+      "name": "Patricia Poncy",
+      "company": "Platform.sh",
+      "companyLogo": "/images/logo/platformsh.svg",
+      "companyUrl": "https://platform.sh/",
+      "linkedin": "https://www.linkedin.com/in/patriciaponcy",
+      "role": "Agency Partner Manager Western EU",
+      "image": "/images/staff/patricia_poncy.png",
+      "biography": ""
+    },
+    {
+      "name": "Thomas Klein",
+      "company": "Opengento",
+      "companyLogo": "/images/logo/opengento.svg",
+      "companyUrl": "https://opengento.fr/",
+      "linkedin": "https://www.linkedin.com/in/thomas-klein/",
+      "role": "Chargée de communication",
+      "image": "/images/staff/thomas_klein.jpeg",
+      "biography": ""
+    },
+    {
+      "name": "Ceyhun Kaplan",
+      "company": "Blackbird",
+      "companyLogo": "/images/logo/blackbird.svg",
+      "companyUrl": "https://black.bird.eu/",
+      "linkedin": "https://www.linkedin.com/in/kaplanceyhun",
+      "role": "Directeur associé",
+      "image": "/images/staff/ceyhun_kaplan.png",
+      "biography": ""
+    },
+    {
+      "name": "Elodie Guiroux",
+      "company": "Platform.sh",
+      "companyLogo": "/images/logo/platformsh.svg",
+      "companyUrl": "https://platform.sh/",
+      "linkedin": "https://www.linkedin.com/in/elodie-guiroux/",
+      "role": "Events Marketing Manager",
+      "image": "/images/staff/elodie_guiroux.jpeg",
+      "biography": ""
+    },
+    {
+      "name": "Olivier Haesen",
+      "company": "Ati4 Group",
+      "companyLogo": "/images/logo/ati4group.svg",
+      "companyUrl": "https://ati4group.com/",
+      "linkedin": "https://www.linkedin.com/in/olivierhaesen",
+      "role": "Directeur Commercial",
+      "image": "/images/staff/olivier_haesen.png",
+      "biography": ""
+    }
+  ]
+}

src/app/page.tsx

@@ -42,7 +42,7 @@ export default function Home() {
           </div>
           <div id="place">
             <ContentMedia
-              imageUrl="/images/etoile_business_center.jpeg"
+              imageUrl="/images/media/etoile_business_center.jpeg"
               imagePosition="left"
               imageWidth="40%"
             >

src/app/staff/page.tsx

@@ -0,0 +1,58 @@
+'use client';
+
+import Typography from "@/components/Typography/Typography";
+import ContentMedia from "@/components/ContentMedia/ContentMedia";
+import Container from "@/layouts/Container";
+import {useTranslation} from "react-i18next";
+import Image from "next/image";
+import React from "react";
+
+export default function Page() {
+  const { t } = useTranslation(['staff']);
+
+  const renderImages = () => {
+    const images = t('staff:images', { returnObjects: true });
+    if (Array.isArray(images)) {
+      return (
+        <div className="flex flex-col md:flex-row gap-4 mb-12">
+          {images.map((src, index) => (
+            <Image key={index}
+                   src={src}
+                   alt=""
+                   height={438}
+                   width={582}
+                   className="rounded-xl object-cover max-h-[438px]"
+            />
+          ))}
+        </div>
+      );
+    }
+  }
+
+  return (
+    <Container size="large" className="flex flex-col gap-8 my-8">
+      <ContentMedia>
+        <Typography
+          variant="h1"
+          color="dark"
+          weight="semibold"
+          className="mb-2"
+        >
+          {t('staff:title')}
+        </Typography>
+        <Typography
+          color="dark"
+          className="mb-8"
+        >
+          {t('staff:subtitle')}
+        </Typography>
+
+        {renderImages()}
+
+        <Typography color="dark" className="whitespace-pre-wrap">
+          {t('staff:description')}
+        </Typography>
+      </ContentMedia>
+    </Container>
+  );
+}