diff --git a/docker-compose-windows.yml b/docker-compose-windows.yml
index 9369030d3..6ea1bafff 100644
--- a/docker-compose-windows.yml
+++ b/docker-compose-windows.yml
@@ -25,3 +25,11 @@ services:
     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/activities/content/views/DocumentView.tsx b/src/components/activities/content/views/DocumentView.tsx
index 64523bc94..7a70051dc 100644
--- a/src/components/activities/content/views/DocumentView.tsx
+++ b/src/components/activities/content/views/DocumentView.tsx
@@ -2,11 +2,14 @@ import React from 'react';
 
 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' }}>
-      <PdfDisplay url={value} />
+      <LightBox url={value} isPDF>
+        <PdfDisplay url={value} />
+      </LightBox>
     </div>
   );
 };
diff --git a/src/components/lightbox/Lightbox.tsx b/src/components/lightbox/Lightbox.tsx
index a6ebba5fd..0f4350975 100644
--- a/src/components/lightbox/Lightbox.tsx
+++ b/src/components/lightbox/Lightbox.tsx
@@ -1,16 +1,26 @@
 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;
+  isPDF?: boolean;
 };
 
-export const LightBox = ({ url, children }: LightBoxProps) => {
+export const LightBox = ({ url, children, isPDF }: 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 +37,23 @@ 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} />
+        {isPDF ? (
+          <Document options={options} file={url} onLoadSuccess={onDocumentLoadSuccess}>
+            {Array.from(Array(numPages).keys()).map((v) => (
+              <div
+                key={v}
+                style={{
+                  marginTop: 10,
+                  marginBottom: 10,
+                }}
+              >
+                <Page width={430} scale={2.0} pageNumber={v + 1} />
+              </div>
+            ))}
+          </Document>
+        ) : (
+          <Image layout="responsive" objectFit="contain" width="100%" height="70%" alt="" unoptimized src={url} />
+        )}
       </Modal>
     </>
   );
diff --git a/src/pages/contenu-libre/2.tsx b/src/pages/contenu-libre/2.tsx
index fcc4a687c..5582ca98b 100644
--- a/src/pages/contenu-libre/2.tsx
+++ b/src/pages/contenu-libre/2.tsx
@@ -30,7 +30,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 8117207b9..472f2dbfb 100644
--- a/src/pages/contenu-libre/3.tsx
+++ b/src/pages/contenu-libre/3.tsx
@@ -29,7 +29,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)) {