From 3828a0ebe03110599e993b01a35a012dc9b6d4ea Mon Sep 17 00:00:00 2001
From: amineouladakdim <ouladakdim.amine@gmail.com>
Date: Tue, 17 Sep 2024 14:31:12 +0200
Subject: [PATCH 01/10] Aggrandissement PDF

---
 .../activities/content/views/DocumentView.tsx |  9 ++++--
 .../activities/content/views/ImageView.tsx    |  2 +-
 src/components/lightbox/Lightbox.tsx          | 31 ++++++++++++++++---
 3 files changed, 35 insertions(+), 7 deletions(-)

diff --git a/src/components/activities/content/views/DocumentView.tsx b/src/components/activities/content/views/DocumentView.tsx
index 64523bc94..8bfabfd17 100644
--- a/src/components/activities/content/views/DocumentView.tsx
+++ b/src/components/activities/content/views/DocumentView.tsx
@@ -1,12 +1,17 @@
 import React from 'react';
-
+import { LightBox } from 'src/components/lightbox/Lightbox';
 import type { ViewProps } from '../content.types';
 import PdfDisplay from '../editors/DocumentEditor/PdfDisplay';
 
 export const DocumentView = ({ value = '' }: ViewProps) => {
   return (
     <div style={{ width: '100%', display: 'flex', flexDirection: 'column', justifyContent: 'center', alignContent: 'center', alignItems: 'center' }}>
-      <PdfDisplay url={value} />
+
+      <LightBox url={value} isImage={false}>
+        <PdfDisplay url={value} />
+      </LightBox>
+
+
     </div>
   );
 };
diff --git a/src/components/activities/content/views/ImageView.tsx b/src/components/activities/content/views/ImageView.tsx
index fa415d0bb..acc64a80a 100644
--- a/src/components/activities/content/views/ImageView.tsx
+++ b/src/components/activities/content/views/ImageView.tsx
@@ -11,7 +11,7 @@ export const ImageView = ({ value }: ViewProps) => {
       <KeepRatio ratio={2 / 3} maxWidth="600px">
         <div style={{ width: '100%', height: '100%', position: 'relative' }}>
           {value && (
-            <LightBox url={value}>
+            <LightBox url={value} isImage={true}>
               <Image layout="fill" objectFit="contain" src={value} unoptimized />
             </LightBox>
           )}
diff --git a/src/components/lightbox/Lightbox.tsx b/src/components/lightbox/Lightbox.tsx
index a6ebba5fd..f87c24072 100644
--- a/src/components/lightbox/Lightbox.tsx
+++ b/src/components/lightbox/Lightbox.tsx
@@ -1,16 +1,25 @@
 import Image from 'next/image';
-import * as React from 'react';
-
+import React, { useState } from 'react';
+import { Document, Page, pdfjs } from 'react-pdf';
 import { Modal } from '../Modal';
 
 type LightBoxProps = {
   url: string;
   children: JSX.Element;
+  isImage: boolean
 };
 
-export const LightBox = ({ url, children }: LightBoxProps) => {
+export const LightBox = ({ url, children, isImage }: LightBoxProps) => {
   const [isModalOpen, setIsModalOpen] = React.useState(false);
 
+  const options = {
+    cMapUrl: `https://unpkg.com/pdfjs-dist@${pdfjs.version}/cmaps/`,
+  };
+
+  const [numPages, setNumPages] = useState<number>(1);
+  function onDocumentLoadSuccess({ numPages }: { numPages: number }): void {
+    setNumPages(numPages);
+  }
   return (
     <>
       <div onClick={() => setIsModalOpen(true)} style={{ cursor: 'pointer' }}>
@@ -27,7 +36,21 @@ export const LightBox = ({ url, children }: LightBoxProps) => {
         ariaLabelledBy="lightBox-modal-title"
         ariaDescribedBy="lightBox-modal-description"
       >
-        <Image layout="responsive" objectFit="contain" width="100%" height="70%" alt="" unoptimized src={url} />
+        {isImage == false && (
+          <Document options={options} file={url} onLoadSuccess={onDocumentLoadSuccess} >
+            {Array.from(Array(numPages).keys()).map((v) => (
+              <div
+                key={v}
+                style={{
+                  marginTop: 10,
+                  marginBottom: 10,
+                }}
+              >
+                <Page width={380} scale={2.0} pageNumber={v + 1} />
+              </div>
+            ))}
+          </Document>)}
+        {isImage == true && (<Image layout="responsive" objectFit="contain" width="100%" height="70%" alt="" unoptimized src={url} />)}
       </Modal>
     </>
   );

From c8373b6d6f85eaffde7ef1d651388a6963449c4c Mon Sep 17 00:00:00 2001
From: amineouladakdim <ouladakdim.amine@gmail.com>
Date: Tue, 17 Sep 2024 15:40:51 +0200
Subject: [PATCH 02/10] =?UTF-8?q?Ajout=20de=20isImage=3D{true}=20dans=20le?=
 =?UTF-8?q?s=20diff=C3=A9rents=20ligthbox=20de=20l'application?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../activities/ActivityView/DefiActivityView.tsx       | 10 +++++-----
 .../activities/ActivityView/MascotteActivityView.tsx   |  2 +-
 .../activities/ActivityView/StoryActivityView.tsx      |  8 ++++----
 .../content/editors/ImageEditor/ImageModal.tsx         |  4 ++--
 src/pages/admin/newportal/contenulibre/2/index.tsx     |  2 +-
 src/pages/contenu-libre/2.tsx                          |  2 +-
 6 files changed, 14 insertions(+), 14 deletions(-)

diff --git a/src/components/activities/ActivityView/DefiActivityView.tsx b/src/components/activities/ActivityView/DefiActivityView.tsx
index 1e47e0314..28f25a733 100644
--- a/src/components/activities/ActivityView/DefiActivityView.tsx
+++ b/src/components/activities/ActivityView/DefiActivityView.tsx
@@ -19,10 +19,10 @@ export const DefiActivityView = ({ activity }: ActivityViewProps<DefiActivity>)
             {isCooking(activity)
               ? activity.data.name
               : isEco(activity)
-              ? ECO_ACTIONS[activity.data.type]
-              : isLanguage(activity)
-              ? getLanguageTheme(activity.data)
-              : null}
+                ? ECO_ACTIONS[activity.data.type]
+                : isLanguage(activity)
+                  ? getLanguageTheme(activity.data)
+                  : null}
           </h3>
         </div>
         {isCooking(activity) && (
@@ -30,7 +30,7 @@ export const DefiActivityView = ({ activity }: ActivityViewProps<DefiActivity>)
             {activity.data.image && (
               <Grid item xs={12} md={4}>
                 <div style={{ width: '100%', height: '100%', minHeight: '200px', position: 'relative' }}>
-                  <LightBox url={activity.data.image}>
+                  <LightBox url={activity.data.image} isImage={true}>
                     <Image layout="fill" objectFit="contain" alt="image du plat" unoptimized src={activity.data.image} />
                   </LightBox>
                 </div>
diff --git a/src/components/activities/ActivityView/MascotteActivityView.tsx b/src/components/activities/ActivityView/MascotteActivityView.tsx
index 2bc0d8253..eaa402077 100644
--- a/src/components/activities/ActivityView/MascotteActivityView.tsx
+++ b/src/components/activities/ActivityView/MascotteActivityView.tsx
@@ -30,7 +30,7 @@ export const MascotteActivityView = ({ activity }: ActivityViewProps<MascotteAct
             </Grid>
             <Grid item xs={12} md={4}>
               <Box display="flex" justifyContent="center" m={4}>
-                <LightBox url={activity.data.mascotteImage}>
+                <LightBox url={activity.data.mascotteImage} isImage={true}>
                   <AvatarImg src={activity.data.mascotteImage} noLink />
                 </LightBox>
               </Box>
diff --git a/src/components/activities/ActivityView/StoryActivityView.tsx b/src/components/activities/ActivityView/StoryActivityView.tsx
index 5abbe058d..b3e40f03c 100644
--- a/src/components/activities/ActivityView/StoryActivityView.tsx
+++ b/src/components/activities/ActivityView/StoryActivityView.tsx
@@ -57,7 +57,7 @@ export const StoryActivityView = ({ activity }: ActivityViewProps<StoryActivity>
                       position: 'relative',
                     }}
                   >
-                    <LightBox url={activity.data.tale.imageStory}>
+                    <LightBox url={activity.data.tale.imageStory} isImage={true} >
                       <Image layout="fill" objectFit="contain" alt="image du plat" unoptimized src={activity.data.tale.imageStory} />
                     </LightBox>
                   </div>
@@ -112,7 +112,7 @@ export const StoryActivityView = ({ activity }: ActivityViewProps<StoryActivity>
                           >
                             {activity.data.odd.description}
                           </Typography>
-                          <LightBox url={activity.data.odd.imageUrl}>
+                          <LightBox url={activity.data.odd.imageUrl} isImage={true}>
                             <CardMedia
                               sx={{ borderRadius: '0.5rem', mt: 1 }}
                               component="img"
@@ -144,7 +144,7 @@ export const StoryActivityView = ({ activity }: ActivityViewProps<StoryActivity>
                           >
                             {activity.data.object.description}
                           </Typography>
-                          <LightBox url={activity.data.object.imageUrl}>
+                          <LightBox url={activity.data.object.imageUrl} isImage={true}>
                             <CardMedia
                               sx={{ borderRadius: '0.5rem', mt: 1 }}
                               component="img"
@@ -176,7 +176,7 @@ export const StoryActivityView = ({ activity }: ActivityViewProps<StoryActivity>
                           >
                             {activity.data.place.description}
                           </Typography>{' '}
-                          <LightBox url={activity.data.place.imageUrl}>
+                          <LightBox url={activity.data.place.imageUrl} isImage={true}>
                             <CardMedia
                               sx={{ borderRadius: '0.5rem', mt: 1 }}
                               component="img"
diff --git a/src/components/activities/content/editors/ImageEditor/ImageModal.tsx b/src/components/activities/content/editors/ImageEditor/ImageModal.tsx
index 0d1b49c1e..bd09ae753 100644
--- a/src/components/activities/content/editors/ImageEditor/ImageModal.tsx
+++ b/src/components/activities/content/editors/ImageEditor/ImageModal.tsx
@@ -32,7 +32,7 @@ export const ImageModal = ({
   imageUrl,
   setImageUrl,
   useCrop = false,
-  onDeleteEditor = () => {},
+  onDeleteEditor = () => { },
 }: ImageModalProps) => {
   const { enqueueSnackbar } = useSnackbar();
   const [tempImageUrl, setTempImageUrl] = React.useState(imageUrl);
@@ -264,7 +264,7 @@ export const ImageModal = ({
                   position: 'relative',
                 }}
               >
-                <LightBox url={preview.url}>
+                <LightBox url={preview.url} isImage={true}>
                   <Image layout="fill" objectFit="contain" src={preview.url} unoptimized />
                 </LightBox>
               </div>
diff --git a/src/pages/admin/newportal/contenulibre/2/index.tsx b/src/pages/admin/newportal/contenulibre/2/index.tsx
index f330278ee..aef1d1312 100644
--- a/src/pages/admin/newportal/contenulibre/2/index.tsx
+++ b/src/pages/admin/newportal/contenulibre/2/index.tsx
@@ -112,7 +112,7 @@ const ContenuLibre = () => {
                       position: 'relative',
                     }}
                   >
-                    <LightBox url={imageUrl}>
+                    <LightBox url={imageUrl} isImage={true}>
                       <Image layout="fill" objectFit="contain" src={imageUrl} unoptimized />
                     </LightBox>
                   </div>
diff --git a/src/pages/contenu-libre/2.tsx b/src/pages/contenu-libre/2.tsx
index b1db747be..4f851aa1b 100644
--- a/src/pages/contenu-libre/2.tsx
+++ b/src/pages/contenu-libre/2.tsx
@@ -124,7 +124,7 @@ const ContenuLibre = () => {
                       position: 'relative',
                     }}
                   >
-                    <LightBox url={imageUrl}>
+                    <LightBox url={imageUrl} isImage={true}>
                       <Image layout="fill" objectFit="contain" src={imageUrl} unoptimized />
                     </LightBox>
                   </div>

From 6f833247eb176b28773e1cdf37e7816315383605 Mon Sep 17 00:00:00 2001
From: amineouladakdim <ouladakdim.amine@gmail.com>
Date: Wed, 18 Sep 2024 10:07:49 +0200
Subject: [PATCH 03/10] Eslint fixed

---
 .../activities/ActivityView/DefiActivityView.tsx      | 11 +++++------
 .../activities/ActivityView/StoryActivityView.tsx     |  7 +++----
 .../content/editors/ImageEditor/ImageModal.tsx        |  9 ++++-----
 .../activities/content/views/DocumentView.tsx         |  6 ++----
 src/components/lightbox/Lightbox.tsx                  | 10 ++++++----
 5 files changed, 20 insertions(+), 23 deletions(-)

diff --git a/src/components/activities/ActivityView/DefiActivityView.tsx b/src/components/activities/ActivityView/DefiActivityView.tsx
index 28f25a733..141e9052c 100644
--- a/src/components/activities/ActivityView/DefiActivityView.tsx
+++ b/src/components/activities/ActivityView/DefiActivityView.tsx
@@ -1,8 +1,7 @@
+import { Grid } from '@mui/material';
 import Image from 'next/image';
 import React from 'react';
 
-import { Grid } from '@mui/material';
-
 import type { ActivityViewProps } from './activity-view.types';
 import { ECO_ACTIONS, getDefi, isCooking, isEco, isLanguage, getLanguageTheme } from 'src/activity-types/defi.constants';
 import type { DefiActivity } from 'src/activity-types/defi.types';
@@ -19,10 +18,10 @@ export const DefiActivityView = ({ activity }: ActivityViewProps<DefiActivity>)
             {isCooking(activity)
               ? activity.data.name
               : isEco(activity)
-                ? ECO_ACTIONS[activity.data.type]
-                : isLanguage(activity)
-                  ? getLanguageTheme(activity.data)
-                  : null}
+              ? ECO_ACTIONS[activity.data.type]
+              : isLanguage(activity)
+              ? getLanguageTheme(activity.data)
+              : null}
           </h3>
         </div>
         {isCooking(activity) && (
diff --git a/src/components/activities/ActivityView/StoryActivityView.tsx b/src/components/activities/ActivityView/StoryActivityView.tsx
index b3e40f03c..805c51697 100644
--- a/src/components/activities/ActivityView/StoryActivityView.tsx
+++ b/src/components/activities/ActivityView/StoryActivityView.tsx
@@ -1,12 +1,11 @@
-import Image from 'next/image';
-import React from 'react';
-
 import { Container } from '@mui/material';
 import Card from '@mui/material/Card';
 import CardMedia from '@mui/material/CardMedia';
 import Grid from '@mui/material/Grid';
 import Typography from '@mui/material/Typography';
 import { Box } from '@mui/system';
+import Image from 'next/image';
+import React from 'react';
 
 import StoriesDataCardView from './StoriesDataCardView';
 import type { ActivityViewProps } from './activity-view.types';
@@ -57,7 +56,7 @@ export const StoryActivityView = ({ activity }: ActivityViewProps<StoryActivity>
                       position: 'relative',
                     }}
                   >
-                    <LightBox url={activity.data.tale.imageStory} isImage={true} >
+                    <LightBox url={activity.data.tale.imageStory} isImage={true}>
                       <Image layout="fill" objectFit="contain" alt="image du plat" unoptimized src={activity.data.tale.imageStory} />
                     </LightBox>
                   </div>
diff --git a/src/components/activities/content/editors/ImageEditor/ImageModal.tsx b/src/components/activities/content/editors/ImageEditor/ImageModal.tsx
index bd09ae753..33dc18580 100644
--- a/src/components/activities/content/editors/ImageEditor/ImageModal.tsx
+++ b/src/components/activities/content/editors/ImageEditor/ImageModal.tsx
@@ -1,10 +1,9 @@
-import Image from 'next/image';
-import { useSnackbar } from 'notistack';
-import React from 'react';
-
 import CloudUploadIcon from '@mui/icons-material/CloudUpload';
 import { Button, Divider, TextField } from '@mui/material';
 import Alert from '@mui/material/Alert';
+import Image from 'next/image';
+import { useSnackbar } from 'notistack';
+import React from 'react';
 
 import type { ImgCroppieRef } from 'src/components/ImgCroppie';
 import { ImgCroppie } from 'src/components/ImgCroppie';
@@ -32,7 +31,7 @@ export const ImageModal = ({
   imageUrl,
   setImageUrl,
   useCrop = false,
-  onDeleteEditor = () => { },
+  onDeleteEditor = () => {},
 }: ImageModalProps) => {
   const { enqueueSnackbar } = useSnackbar();
   const [tempImageUrl, setTempImageUrl] = React.useState(imageUrl);
diff --git a/src/components/activities/content/views/DocumentView.tsx b/src/components/activities/content/views/DocumentView.tsx
index 8bfabfd17..1eebbce4f 100644
--- a/src/components/activities/content/views/DocumentView.tsx
+++ b/src/components/activities/content/views/DocumentView.tsx
@@ -1,17 +1,15 @@
 import React from 'react';
-import { LightBox } from 'src/components/lightbox/Lightbox';
+
 import type { ViewProps } from '../content.types';
 import PdfDisplay from '../editors/DocumentEditor/PdfDisplay';
+import { LightBox } from 'src/components/lightbox/Lightbox';
 
 export const DocumentView = ({ value = '' }: ViewProps) => {
   return (
     <div style={{ width: '100%', display: 'flex', flexDirection: 'column', justifyContent: 'center', alignContent: 'center', alignItems: 'center' }}>
-
       <LightBox url={value} isImage={false}>
         <PdfDisplay url={value} />
       </LightBox>
-
-
     </div>
   );
 };
diff --git a/src/components/lightbox/Lightbox.tsx b/src/components/lightbox/Lightbox.tsx
index f87c24072..57db2beb2 100644
--- a/src/components/lightbox/Lightbox.tsx
+++ b/src/components/lightbox/Lightbox.tsx
@@ -1,12 +1,13 @@
 import Image from 'next/image';
 import React, { useState } from 'react';
 import { Document, Page, pdfjs } from 'react-pdf';
+
 import { Modal } from '../Modal';
 
 type LightBoxProps = {
   url: string;
   children: JSX.Element;
-  isImage: boolean
+  isImage: boolean;
 };
 
 export const LightBox = ({ url, children, isImage }: LightBoxProps) => {
@@ -37,7 +38,7 @@ export const LightBox = ({ url, children, isImage }: LightBoxProps) => {
         ariaDescribedBy="lightBox-modal-description"
       >
         {isImage == false && (
-          <Document options={options} file={url} onLoadSuccess={onDocumentLoadSuccess} >
+          <Document options={options} file={url} onLoadSuccess={onDocumentLoadSuccess}>
             {Array.from(Array(numPages).keys()).map((v) => (
               <div
                 key={v}
@@ -49,8 +50,9 @@ export const LightBox = ({ url, children, isImage }: LightBoxProps) => {
                 <Page width={380} scale={2.0} pageNumber={v + 1} />
               </div>
             ))}
-          </Document>)}
-        {isImage == true && (<Image layout="responsive" objectFit="contain" width="100%" height="70%" alt="" unoptimized src={url} />)}
+          </Document>
+        )}
+        {isImage == true && <Image layout="responsive" objectFit="contain" width="100%" height="70%" alt="" unoptimized src={url} />}
       </Modal>
     </>
   );

From 1c5fd86f9a2671245fa7e1270333420e6ad0ba54 Mon Sep 17 00:00:00 2001
From: amineouladakdim <ouladakdim.amine@gmail.com>
Date: Wed, 18 Sep 2024 10:14:04 +0200
Subject: [PATCH 04/10] Organisation des imports pour eslint

---
 .../activities/ActivityView/DefiActivityView.tsx    | 13 ++++++-------
 .../activities/ActivityView/StoryActivityView.tsx   |  5 ++---
 .../content/editors/ImageEditor/ImageModal.tsx      |  7 +++----
 3 files changed, 11 insertions(+), 14 deletions(-)

diff --git a/src/components/activities/ActivityView/DefiActivityView.tsx b/src/components/activities/ActivityView/DefiActivityView.tsx
index 141e9052c..86e4a9dc1 100644
--- a/src/components/activities/ActivityView/DefiActivityView.tsx
+++ b/src/components/activities/ActivityView/DefiActivityView.tsx
@@ -1,7 +1,6 @@
-import { Grid } from '@mui/material';
-import Image from 'next/image';
 import React from 'react';
-
+import Image from 'next/image';
+import { Grid } from '@mui/material';
 import type { ActivityViewProps } from './activity-view.types';
 import { ECO_ACTIONS, getDefi, isCooking, isEco, isLanguage, getLanguageTheme } from 'src/activity-types/defi.constants';
 import type { DefiActivity } from 'src/activity-types/defi.types';
@@ -18,10 +17,10 @@ export const DefiActivityView = ({ activity }: ActivityViewProps<DefiActivity>)
             {isCooking(activity)
               ? activity.data.name
               : isEco(activity)
-              ? ECO_ACTIONS[activity.data.type]
-              : isLanguage(activity)
-              ? getLanguageTheme(activity.data)
-              : null}
+                ? ECO_ACTIONS[activity.data.type]
+                : isLanguage(activity)
+                  ? getLanguageTheme(activity.data)
+                  : null}
           </h3>
         </div>
         {isCooking(activity) && (
diff --git a/src/components/activities/ActivityView/StoryActivityView.tsx b/src/components/activities/ActivityView/StoryActivityView.tsx
index 805c51697..ce5df4ed5 100644
--- a/src/components/activities/ActivityView/StoryActivityView.tsx
+++ b/src/components/activities/ActivityView/StoryActivityView.tsx
@@ -1,12 +1,11 @@
+import Image from 'next/image';
+import React from 'react';
 import { Container } from '@mui/material';
 import Card from '@mui/material/Card';
 import CardMedia from '@mui/material/CardMedia';
 import Grid from '@mui/material/Grid';
 import Typography from '@mui/material/Typography';
 import { Box } from '@mui/system';
-import Image from 'next/image';
-import React from 'react';
-
 import StoriesDataCardView from './StoriesDataCardView';
 import type { ActivityViewProps } from './activity-view.types';
 import { isStory } from 'src/activity-types/anyActivity';
diff --git a/src/components/activities/content/editors/ImageEditor/ImageModal.tsx b/src/components/activities/content/editors/ImageEditor/ImageModal.tsx
index 33dc18580..d677f91e5 100644
--- a/src/components/activities/content/editors/ImageEditor/ImageModal.tsx
+++ b/src/components/activities/content/editors/ImageEditor/ImageModal.tsx
@@ -1,10 +1,9 @@
+import React from 'react';
+import Image from 'next/image';
 import CloudUploadIcon from '@mui/icons-material/CloudUpload';
 import { Button, Divider, TextField } from '@mui/material';
 import Alert from '@mui/material/Alert';
-import Image from 'next/image';
 import { useSnackbar } from 'notistack';
-import React from 'react';
-
 import type { ImgCroppieRef } from 'src/components/ImgCroppie';
 import { ImgCroppie } from 'src/components/ImgCroppie';
 import { KeepRatio } from 'src/components/KeepRatio';
@@ -31,7 +30,7 @@ export const ImageModal = ({
   imageUrl,
   setImageUrl,
   useCrop = false,
-  onDeleteEditor = () => {},
+  onDeleteEditor = () => { },
 }: ImageModalProps) => {
   const { enqueueSnackbar } = useSnackbar();
   const [tempImageUrl, setTempImageUrl] = React.useState(imageUrl);

From b5e1e3f09700e59e01137b1461506c424a7e68a2 Mon Sep 17 00:00:00 2001
From: amineouladakdim <ouladakdim.amine@gmail.com>
Date: Wed, 18 Sep 2024 10:19:30 +0200
Subject: [PATCH 05/10] Re Tentative de respect de eslint

---
 .../activities/ActivityView/DefiActivityView.tsx    | 13 +++++++------
 .../activities/ActivityView/StoryActivityView.tsx   |  5 +++--
 .../content/editors/ImageEditor/ImageModal.tsx      |  7 ++++---
 3 files changed, 14 insertions(+), 11 deletions(-)

diff --git a/src/components/activities/ActivityView/DefiActivityView.tsx b/src/components/activities/ActivityView/DefiActivityView.tsx
index 86e4a9dc1..141e9052c 100644
--- a/src/components/activities/ActivityView/DefiActivityView.tsx
+++ b/src/components/activities/ActivityView/DefiActivityView.tsx
@@ -1,6 +1,7 @@
-import React from 'react';
-import Image from 'next/image';
 import { Grid } from '@mui/material';
+import Image from 'next/image';
+import React from 'react';
+
 import type { ActivityViewProps } from './activity-view.types';
 import { ECO_ACTIONS, getDefi, isCooking, isEco, isLanguage, getLanguageTheme } from 'src/activity-types/defi.constants';
 import type { DefiActivity } from 'src/activity-types/defi.types';
@@ -17,10 +18,10 @@ export const DefiActivityView = ({ activity }: ActivityViewProps<DefiActivity>)
             {isCooking(activity)
               ? activity.data.name
               : isEco(activity)
-                ? ECO_ACTIONS[activity.data.type]
-                : isLanguage(activity)
-                  ? getLanguageTheme(activity.data)
-                  : null}
+              ? ECO_ACTIONS[activity.data.type]
+              : isLanguage(activity)
+              ? getLanguageTheme(activity.data)
+              : null}
           </h3>
         </div>
         {isCooking(activity) && (
diff --git a/src/components/activities/ActivityView/StoryActivityView.tsx b/src/components/activities/ActivityView/StoryActivityView.tsx
index ce5df4ed5..805c51697 100644
--- a/src/components/activities/ActivityView/StoryActivityView.tsx
+++ b/src/components/activities/ActivityView/StoryActivityView.tsx
@@ -1,11 +1,12 @@
-import Image from 'next/image';
-import React from 'react';
 import { Container } from '@mui/material';
 import Card from '@mui/material/Card';
 import CardMedia from '@mui/material/CardMedia';
 import Grid from '@mui/material/Grid';
 import Typography from '@mui/material/Typography';
 import { Box } from '@mui/system';
+import Image from 'next/image';
+import React from 'react';
+
 import StoriesDataCardView from './StoriesDataCardView';
 import type { ActivityViewProps } from './activity-view.types';
 import { isStory } from 'src/activity-types/anyActivity';
diff --git a/src/components/activities/content/editors/ImageEditor/ImageModal.tsx b/src/components/activities/content/editors/ImageEditor/ImageModal.tsx
index d677f91e5..33dc18580 100644
--- a/src/components/activities/content/editors/ImageEditor/ImageModal.tsx
+++ b/src/components/activities/content/editors/ImageEditor/ImageModal.tsx
@@ -1,9 +1,10 @@
-import React from 'react';
-import Image from 'next/image';
 import CloudUploadIcon from '@mui/icons-material/CloudUpload';
 import { Button, Divider, TextField } from '@mui/material';
 import Alert from '@mui/material/Alert';
+import Image from 'next/image';
 import { useSnackbar } from 'notistack';
+import React from 'react';
+
 import type { ImgCroppieRef } from 'src/components/ImgCroppie';
 import { ImgCroppie } from 'src/components/ImgCroppie';
 import { KeepRatio } from 'src/components/KeepRatio';
@@ -30,7 +31,7 @@ export const ImageModal = ({
   imageUrl,
   setImageUrl,
   useCrop = false,
-  onDeleteEditor = () => { },
+  onDeleteEditor = () => {},
 }: ImageModalProps) => {
   const { enqueueSnackbar } = useSnackbar();
   const [tempImageUrl, setTempImageUrl] = React.useState(imageUrl);

From c23650f6452860528091b7ebb4e7af265d82621e Mon Sep 17 00:00:00 2001
From: amineouladakdim <ouladakdim.amine@gmail.com>
Date: Wed, 18 Sep 2024 10:32:32 +0200
Subject: [PATCH 06/10] Encore eslint

---
 src/components/activities/ActivityView/DefiActivityView.tsx   | 2 +-
 src/components/activities/ActivityView/StoryActivityView.tsx  | 4 ++--
 .../activities/content/editors/ImageEditor/ImageModal.tsx     | 4 ++--
 3 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/components/activities/ActivityView/DefiActivityView.tsx b/src/components/activities/ActivityView/DefiActivityView.tsx
index 141e9052c..01861e21a 100644
--- a/src/components/activities/ActivityView/DefiActivityView.tsx
+++ b/src/components/activities/ActivityView/DefiActivityView.tsx
@@ -1,6 +1,6 @@
-import { Grid } from '@mui/material';
 import Image from 'next/image';
 import React from 'react';
+import { Grid } from '@mui/material';
 
 import type { ActivityViewProps } from './activity-view.types';
 import { ECO_ACTIONS, getDefi, isCooking, isEco, isLanguage, getLanguageTheme } from 'src/activity-types/defi.constants';
diff --git a/src/components/activities/ActivityView/StoryActivityView.tsx b/src/components/activities/ActivityView/StoryActivityView.tsx
index 805c51697..255ee5378 100644
--- a/src/components/activities/ActivityView/StoryActivityView.tsx
+++ b/src/components/activities/ActivityView/StoryActivityView.tsx
@@ -1,11 +1,11 @@
+import Image from 'next/image';
+import React from 'react';
 import { Container } from '@mui/material';
 import Card from '@mui/material/Card';
 import CardMedia from '@mui/material/CardMedia';
 import Grid from '@mui/material/Grid';
 import Typography from '@mui/material/Typography';
 import { Box } from '@mui/system';
-import Image from 'next/image';
-import React from 'react';
 
 import StoriesDataCardView from './StoriesDataCardView';
 import type { ActivityViewProps } from './activity-view.types';
diff --git a/src/components/activities/content/editors/ImageEditor/ImageModal.tsx b/src/components/activities/content/editors/ImageEditor/ImageModal.tsx
index 33dc18580..d074f2f98 100644
--- a/src/components/activities/content/editors/ImageEditor/ImageModal.tsx
+++ b/src/components/activities/content/editors/ImageEditor/ImageModal.tsx
@@ -1,9 +1,9 @@
+import Image from 'next/image';
+import React from 'react';
 import CloudUploadIcon from '@mui/icons-material/CloudUpload';
 import { Button, Divider, TextField } from '@mui/material';
 import Alert from '@mui/material/Alert';
-import Image from 'next/image';
 import { useSnackbar } from 'notistack';
-import React from 'react';
 
 import type { ImgCroppieRef } from 'src/components/ImgCroppie';
 import { ImgCroppie } from 'src/components/ImgCroppie';

From 28cce62f2588bcc2f2f3cee9688aca83d9a00bc9 Mon Sep 17 00:00:00 2001
From: amineouladakdim <ouladakdim.amine@gmail.com>
Date: Wed, 18 Sep 2024 10:38:01 +0200
Subject: [PATCH 07/10] try Eslint

---
 src/components/activities/ActivityView/DefiActivityView.tsx    | 1 +
 src/components/activities/ActivityView/StoryActivityView.tsx   | 1 +
 .../activities/content/editors/ImageEditor/ImageModal.tsx      | 3 ++-
 3 files changed, 4 insertions(+), 1 deletion(-)

diff --git a/src/components/activities/ActivityView/DefiActivityView.tsx b/src/components/activities/ActivityView/DefiActivityView.tsx
index 01861e21a..9bb894c70 100644
--- a/src/components/activities/ActivityView/DefiActivityView.tsx
+++ b/src/components/activities/ActivityView/DefiActivityView.tsx
@@ -1,5 +1,6 @@
 import Image from 'next/image';
 import React from 'react';
+
 import { Grid } from '@mui/material';
 
 import type { ActivityViewProps } from './activity-view.types';
diff --git a/src/components/activities/ActivityView/StoryActivityView.tsx b/src/components/activities/ActivityView/StoryActivityView.tsx
index 255ee5378..161f90d35 100644
--- a/src/components/activities/ActivityView/StoryActivityView.tsx
+++ b/src/components/activities/ActivityView/StoryActivityView.tsx
@@ -1,5 +1,6 @@
 import Image from 'next/image';
 import React from 'react';
+
 import { Container } from '@mui/material';
 import Card from '@mui/material/Card';
 import CardMedia from '@mui/material/CardMedia';
diff --git a/src/components/activities/content/editors/ImageEditor/ImageModal.tsx b/src/components/activities/content/editors/ImageEditor/ImageModal.tsx
index d074f2f98..b29241cf3 100644
--- a/src/components/activities/content/editors/ImageEditor/ImageModal.tsx
+++ b/src/components/activities/content/editors/ImageEditor/ImageModal.tsx
@@ -1,9 +1,10 @@
 import Image from 'next/image';
+import { useSnackbar } from 'notistack';
 import React from 'react';
+
 import CloudUploadIcon from '@mui/icons-material/CloudUpload';
 import { Button, Divider, TextField } from '@mui/material';
 import Alert from '@mui/material/Alert';
-import { useSnackbar } from 'notistack';
 
 import type { ImgCroppieRef } from 'src/components/ImgCroppie';
 import { ImgCroppie } from 'src/components/ImgCroppie';

From befdc288fec3ebe5e79f13a167dba588da6b92ac Mon Sep 17 00:00:00 2001
From: David Robert-Ansart <david.robertansart@gmail.com>
Date: Sun, 15 Dec 2024 21:05:29 +0100
Subject: [PATCH 08/10] Use isPDF prop instead

---
 .../activities/ActivityView/DefiActivityView.tsx         | 2 +-
 .../activities/ActivityView/MascotteActivityView.tsx     | 2 +-
 .../activities/ActivityView/StoryActivityView.tsx        | 8 ++++----
 .../content/editors/ImageEditor/ImageModal.tsx           | 2 +-
 src/components/activities/content/views/DocumentView.tsx | 2 +-
 src/components/activities/content/views/ImageView.tsx    | 2 +-
 src/components/lightbox/Lightbox.tsx                     | 9 +++++----
 src/pages/admin/newportal/contenulibre/2/index.tsx       | 2 +-
 src/pages/contenu-libre/2.tsx                            | 2 +-
 9 files changed, 16 insertions(+), 15 deletions(-)

diff --git a/src/components/activities/ActivityView/DefiActivityView.tsx b/src/components/activities/ActivityView/DefiActivityView.tsx
index 9bb894c70..1e47e0314 100644
--- a/src/components/activities/ActivityView/DefiActivityView.tsx
+++ b/src/components/activities/ActivityView/DefiActivityView.tsx
@@ -30,7 +30,7 @@ export const DefiActivityView = ({ activity }: ActivityViewProps<DefiActivity>)
             {activity.data.image && (
               <Grid item xs={12} md={4}>
                 <div style={{ width: '100%', height: '100%', minHeight: '200px', position: 'relative' }}>
-                  <LightBox url={activity.data.image} isImage={true}>
+                  <LightBox url={activity.data.image}>
                     <Image layout="fill" objectFit="contain" alt="image du plat" unoptimized src={activity.data.image} />
                   </LightBox>
                 </div>
diff --git a/src/components/activities/ActivityView/MascotteActivityView.tsx b/src/components/activities/ActivityView/MascotteActivityView.tsx
index eaa402077..2bc0d8253 100644
--- a/src/components/activities/ActivityView/MascotteActivityView.tsx
+++ b/src/components/activities/ActivityView/MascotteActivityView.tsx
@@ -30,7 +30,7 @@ export const MascotteActivityView = ({ activity }: ActivityViewProps<MascotteAct
             </Grid>
             <Grid item xs={12} md={4}>
               <Box display="flex" justifyContent="center" m={4}>
-                <LightBox url={activity.data.mascotteImage} isImage={true}>
+                <LightBox url={activity.data.mascotteImage}>
                   <AvatarImg src={activity.data.mascotteImage} noLink />
                 </LightBox>
               </Box>
diff --git a/src/components/activities/ActivityView/StoryActivityView.tsx b/src/components/activities/ActivityView/StoryActivityView.tsx
index 66d0ce99d..e34f6b64c 100644
--- a/src/components/activities/ActivityView/StoryActivityView.tsx
+++ b/src/components/activities/ActivityView/StoryActivityView.tsx
@@ -57,7 +57,7 @@ export const StoryActivityView = ({ activity }: ActivityViewProps<StoryActivity>
                       position: 'relative',
                     }}
                   >
-                    <LightBox url={activity.data.tale.imageStory} isImage={true}>
+                    <LightBox url={activity.data.tale.imageStory}>
                       <Image layout="fill" objectFit="contain" alt="image du plat" unoptimized src={activity.data.tale.imageStory} />
                     </LightBox>
                   </div>
@@ -112,7 +112,7 @@ export const StoryActivityView = ({ activity }: ActivityViewProps<StoryActivity>
                           >
                             {activity.data.odd.description}
                           </Typography>
-                          <LightBox url={activity.data.odd.imageUrl} isImage={true}>
+                          <LightBox url={activity.data.odd.imageUrl}>
                             <CardMedia
                               sx={{ borderRadius: '0.5rem', mt: 1 }}
                               component="img"
@@ -144,7 +144,7 @@ export const StoryActivityView = ({ activity }: ActivityViewProps<StoryActivity>
                           >
                             {activity.data.object.description}
                           </Typography>
-                          <LightBox url={activity.data.object.imageUrl} isImage={true}>
+                          <LightBox url={activity.data.object.imageUrl}>
                             <CardMedia
                               sx={{ borderRadius: '0.5rem', mt: 1 }}
                               component="img"
@@ -176,7 +176,7 @@ export const StoryActivityView = ({ activity }: ActivityViewProps<StoryActivity>
                           >
                             {activity.data.place.description}
                           </Typography>{' '}
-                          <LightBox url={activity.data.place.imageUrl} isImage={true}>
+                          <LightBox url={activity.data.place.imageUrl}>
                             <CardMedia
                               sx={{ borderRadius: '0.5rem', mt: 1 }}
                               component="img"
diff --git a/src/components/activities/content/editors/ImageEditor/ImageModal.tsx b/src/components/activities/content/editors/ImageEditor/ImageModal.tsx
index b29241cf3..0d1b49c1e 100644
--- a/src/components/activities/content/editors/ImageEditor/ImageModal.tsx
+++ b/src/components/activities/content/editors/ImageEditor/ImageModal.tsx
@@ -264,7 +264,7 @@ export const ImageModal = ({
                   position: 'relative',
                 }}
               >
-                <LightBox url={preview.url} isImage={true}>
+                <LightBox url={preview.url}>
                   <Image layout="fill" objectFit="contain" src={preview.url} unoptimized />
                 </LightBox>
               </div>
diff --git a/src/components/activities/content/views/DocumentView.tsx b/src/components/activities/content/views/DocumentView.tsx
index 1eebbce4f..7a70051dc 100644
--- a/src/components/activities/content/views/DocumentView.tsx
+++ b/src/components/activities/content/views/DocumentView.tsx
@@ -7,7 +7,7 @@ import { LightBox } from 'src/components/lightbox/Lightbox';
 export const DocumentView = ({ value = '' }: ViewProps) => {
   return (
     <div style={{ width: '100%', display: 'flex', flexDirection: 'column', justifyContent: 'center', alignContent: 'center', alignItems: 'center' }}>
-      <LightBox url={value} isImage={false}>
+      <LightBox url={value} isPDF>
         <PdfDisplay url={value} />
       </LightBox>
     </div>
diff --git a/src/components/activities/content/views/ImageView.tsx b/src/components/activities/content/views/ImageView.tsx
index acc64a80a..fa415d0bb 100644
--- a/src/components/activities/content/views/ImageView.tsx
+++ b/src/components/activities/content/views/ImageView.tsx
@@ -11,7 +11,7 @@ export const ImageView = ({ value }: ViewProps) => {
       <KeepRatio ratio={2 / 3} maxWidth="600px">
         <div style={{ width: '100%', height: '100%', position: 'relative' }}>
           {value && (
-            <LightBox url={value} isImage={true}>
+            <LightBox url={value}>
               <Image layout="fill" objectFit="contain" src={value} unoptimized />
             </LightBox>
           )}
diff --git a/src/components/lightbox/Lightbox.tsx b/src/components/lightbox/Lightbox.tsx
index 57db2beb2..47d0746c3 100644
--- a/src/components/lightbox/Lightbox.tsx
+++ b/src/components/lightbox/Lightbox.tsx
@@ -7,10 +7,10 @@ import { Modal } from '../Modal';
 type LightBoxProps = {
   url: string;
   children: JSX.Element;
-  isImage: boolean;
+  isPDF?: boolean;
 };
 
-export const LightBox = ({ url, children, isImage }: LightBoxProps) => {
+export const LightBox = ({ url, children, isPDF }: LightBoxProps) => {
   const [isModalOpen, setIsModalOpen] = React.useState(false);
 
   const options = {
@@ -37,7 +37,7 @@ export const LightBox = ({ url, children, isImage }: LightBoxProps) => {
         ariaLabelledBy="lightBox-modal-title"
         ariaDescribedBy="lightBox-modal-description"
       >
-        {isImage == false && (
+        {isPDF ? (
           <Document options={options} file={url} onLoadSuccess={onDocumentLoadSuccess}>
             {Array.from(Array(numPages).keys()).map((v) => (
               <div
@@ -51,8 +51,9 @@ export const LightBox = ({ url, children, isImage }: LightBoxProps) => {
               </div>
             ))}
           </Document>
+        ) : (
+          <Image layout="responsive" objectFit="contain" width="100%" height="70%" alt="" unoptimized src={url} />
         )}
-        {isImage == true && <Image layout="responsive" objectFit="contain" width="100%" height="70%" alt="" unoptimized src={url} />}
       </Modal>
     </>
   );
diff --git a/src/pages/admin/newportal/contenulibre/2/index.tsx b/src/pages/admin/newportal/contenulibre/2/index.tsx
index b8ab82645..6c1c69b2b 100644
--- a/src/pages/admin/newportal/contenulibre/2/index.tsx
+++ b/src/pages/admin/newportal/contenulibre/2/index.tsx
@@ -112,7 +112,7 @@ const ContenuLibre = () => {
                       position: 'relative',
                     }}
                   >
-                    <LightBox url={imageUrl} isImage={true}>
+                    <LightBox url={imageUrl}>
                       <Image layout="fill" objectFit="contain" src={imageUrl} unoptimized />
                     </LightBox>
                   </div>
diff --git a/src/pages/contenu-libre/2.tsx b/src/pages/contenu-libre/2.tsx
index 2ba89df16..1eeda6221 100644
--- a/src/pages/contenu-libre/2.tsx
+++ b/src/pages/contenu-libre/2.tsx
@@ -130,7 +130,7 @@ const ContenuLibre = () => {
                       position: 'relative',
                     }}
                   >
-                    <LightBox url={imageUrl} isImage={true}>
+                    <LightBox url={imageUrl}>
                       <Image layout="fill" objectFit="contain" src={imageUrl} unoptimized />
                     </LightBox>
                   </div>

From 31276962359e2f6f1aa0941e284ca3f67c687b14 Mon Sep 17 00:00:00 2001
From: David Robert-Ansart <david.robertansart@gmail.com>
Date: Sun, 15 Dec 2024 21:24:09 +0100
Subject: [PATCH 09/10] Fix docker compose and missing pdf value

---
 docker-compose-windows.yml           | 62 ++++++++++++++++------------
 docker-compose.yml                   |  2 +-
 src/components/lightbox/Lightbox.tsx |  2 +-
 src/pages/contenu-libre/2.tsx        |  2 +-
 src/pages/contenu-libre/3.tsx        |  2 +-
 5 files changed, 39 insertions(+), 31 deletions(-)

diff --git a/docker-compose-windows.yml b/docker-compose-windows.yml
index 0a501e7fd..6ea1bafff 100644
--- a/docker-compose-windows.yml
+++ b/docker-compose-windows.yml
@@ -1,27 +1,35 @@
-# services:
-#   mysql:
-#     image: mysql:8
-#     environment:
-#       - MYSQL_ROOT_PASSWORD=my-secret-pw
-#     healthcheck:
-#       test: [ 'CMD', 'mysqladmin', 'ping', '-h', 'localhost' ]
-#       timeout: 20s
-#       retries: 10
-#     ports:
-#       - '3306:3306'
-#       - '33060:33060'
-#     volumes:
-#       - ./.mysql-data:/var/lib/mysql
-#   minio:
-#     image: minio/minio
-#     ports:
-#       - '9000:9000'
-#       - '9090:9090'
-#     environment:
-#       - MINIO_ROOT_USER=minioadmin
-#       - MINIO_ROOT_PASSWORD=minioadmin
-#       - MINIO_ACCESS_KEY=minio
-#       - MINIO_SECRET_KEY=minio123
-#     volumes:
-#       - ./.minio-data:/data
-#     command: server --console-address ":9090" /data
+services:
+  mysql:
+    image: mysql:8
+    environment:
+      - MYSQL_ROOT_PASSWORD=my-secret-pw
+    healthcheck:
+      test: ['CMD', 'mysqladmin', 'ping', '-h', 'localhost']
+      timeout: 20s
+      retries: 10
+    ports:
+      - '3306:3306'
+      - '33060:33060'
+    volumes:
+      - ./.mysql-data:/var/lib/mysql
+  minio:
+    image: minio/minio
+    ports:
+      - '9000:9000'
+      - '9090:9090'
+    environment:
+      - MINIO_ROOT_USER=minioadmin
+      - MINIO_ROOT_PASSWORD=minioadmin
+      - MINIO_ACCESS_KEY=minio
+      - MINIO_SECRET_KEY=minio123
+    volumes:
+      - ./.minio-data:/data
+    command: server --console-address ":9090" /data
+  dynamodb:
+    command: '-jar DynamoDBLocal.jar -sharedDb -dbPath ./data'
+    image: 'amazon/dynamodb-local:latest'
+    ports:
+      - '8000:8000'
+    volumes:
+      - './.dynamodb:/home/dynamodblocal/data'
+    working_dir: /home/dynamodblocal
diff --git a/docker-compose.yml b/docker-compose.yml
index 09ff47bdb..ca71d4787 100644
--- a/docker-compose.yml
+++ b/docker-compose.yml
@@ -43,7 +43,7 @@ services:
       timeout: 20s
       retries: 10
     ports:
-      - '3307:3306'
+      - '3306:3306'
       - '33060:33060'
     volumes:
       - ./.mysql-data:/var/lib/mysql
diff --git a/src/components/lightbox/Lightbox.tsx b/src/components/lightbox/Lightbox.tsx
index 47d0746c3..0f4350975 100644
--- a/src/components/lightbox/Lightbox.tsx
+++ b/src/components/lightbox/Lightbox.tsx
@@ -47,7 +47,7 @@ export const LightBox = ({ url, children, isPDF }: LightBoxProps) => {
                   marginBottom: 10,
                 }}
               >
-                <Page width={380} scale={2.0} pageNumber={v + 1} />
+                <Page width={430} scale={2.0} pageNumber={v + 1} />
               </div>
             ))}
           </Document>
diff --git a/src/pages/contenu-libre/2.tsx b/src/pages/contenu-libre/2.tsx
index 1eeda6221..42bdebb0a 100644
--- a/src/pages/contenu-libre/2.tsx
+++ b/src/pages/contenu-libre/2.tsx
@@ -31,7 +31,7 @@ const ContenuLibre = () => {
 
   const data = (activity?.data as FreeContentData) || null;
   const errorSteps = React.useMemo(() => {
-    if (activity !== null && activity.content.filter((c) => c.value.length > 0 && c.value !== '<p></p>\n').length === 0) {
+    if (activity !== null && activity.content.filter((c) => c.value?.length > 0 && c.value !== '<p></p>\n').length === 0) {
       return [0];
     }
     return [];
diff --git a/src/pages/contenu-libre/3.tsx b/src/pages/contenu-libre/3.tsx
index 776cda9cf..f7e8902eb 100644
--- a/src/pages/contenu-libre/3.tsx
+++ b/src/pages/contenu-libre/3.tsx
@@ -30,7 +30,7 @@ const ContenuLibre = () => {
   const errorSteps = React.useMemo(() => {
     const errors: number[] = [];
     const data = (activity?.data as FreeContentData) || null;
-    if (activity !== null && activity.content.filter((c) => c.value.length > 0 && c.value !== '<p></p>\n').length === 0) {
+    if (activity !== null && activity.content.filter((c) => c.value?.length > 0 && c.value !== '<p></p>\n').length === 0) {
       errors.push(0);
     }
     if (data !== null && (!data.title || !data.resume)) {

From 65301a1bc9491c6708286bba7b3bc1bb88752246 Mon Sep 17 00:00:00 2001
From: David Robert-Ansart <david.robertansart@gmail.com>
Date: Sun, 15 Dec 2024 21:26:22 +0100
Subject: [PATCH 10/10] Fix content value missing

---
 src/pages/contenu-libre/2.tsx | 2 +-
 src/pages/contenu-libre/3.tsx | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/pages/contenu-libre/2.tsx b/src/pages/contenu-libre/2.tsx
index 42bdebb0a..b98a90b43 100644
--- a/src/pages/contenu-libre/2.tsx
+++ b/src/pages/contenu-libre/2.tsx
@@ -31,7 +31,7 @@ const ContenuLibre = () => {
 
   const data = (activity?.data as FreeContentData) || null;
   const errorSteps = React.useMemo(() => {
-    if (activity !== null && activity.content.filter((c) => c.value?.length > 0 && c.value !== '<p></p>\n').length === 0) {
+    if (activity !== null && activity.content.filter((c) => c.value && c.value.length > 0 && c.value !== '<p></p>\n').length === 0) {
       return [0];
     }
     return [];
diff --git a/src/pages/contenu-libre/3.tsx b/src/pages/contenu-libre/3.tsx
index f7e8902eb..b1d53264a 100644
--- a/src/pages/contenu-libre/3.tsx
+++ b/src/pages/contenu-libre/3.tsx
@@ -30,7 +30,7 @@ const ContenuLibre = () => {
   const errorSteps = React.useMemo(() => {
     const errors: number[] = [];
     const data = (activity?.data as FreeContentData) || null;
-    if (activity !== null && activity.content.filter((c) => c.value?.length > 0 && c.value !== '<p></p>\n').length === 0) {
+    if (activity !== null && activity.content.filter((c) => c.value && c.value.length > 0 && c.value !== '<p></p>\n').length === 0) {
       errors.push(0);
     }
     if (data !== null && (!data.title || !data.resume)) {