Fix pdf generation and parsing

Add merkle proof validation message bus
Add document verification page
2025-07-03 18:09:02 +02:00 · 2025-07-03 18:09:02 +02:00 · 2025-07-03 18:09:02 +02:00 · 2025-07-03 18:09:02 +02:00 · 2025-07-03 18:09:02 +02:00 · 2025-07-03 18:09:02 +02:00
27 changed files with 1768 additions and 213 deletions
--- a/package.json
+++ b/package.json
@ -32,6 +32,7 @@
 		"jwt-decode": "^3.1.2",
 		"le-coffre-resources": "file:../lecoffre-ressources",
 		"next": "^14.2.3",
+		"pdf-lib": "^1.17.1",
 		"prettier": "^2.8.7",
 		"react": "18.2.0",
 		"react-dom": "18.2.0",
--- a/src/common/Api/LeCoffreApi/sdk/FileService.ts
+++ b/src/common/Api/LeCoffreApi/sdk/FileService.ts
@ -2,6 +2,7 @@ import { v4 as uuidv4 } from 'uuid';

 import MessageBus from 'src/sdk/MessageBus';
 import User from 'src/sdk/User';
+import { FileData } from '../../../../front/Api/Entities/types';

 export default class FileService {

@ -9,7 +10,7 @@ export default class FileService {

  private constructor() { }

-  public static createFile(fileData: any, validatorId: string): Promise<any> {
+  public static createFile(fileData: FileData, validatorId: string): Promise<any> {
    const ownerId = User.getInstance().getPairingId()!;

    const processData: any = {
@ -81,7 +82,7 @@ export default class FileService {
    return this.messageBus.getFileByUid(uid);
  }

-  public static updateFile(process: any, newData: any): Promise<void> {
+  public static updateFile(process: any, newData: Partial<FileData> & { isDeleted?: string }): Promise<void> {
    return new Promise<void>((resolve: () => void, reject: (error: string) => void) => {
      this.messageBus.updateProcess(process.processId, { updated_at: new Date().toISOString(), ...newData }, [], null).then((processUpdated: any) => {
        const newStateId: string = processUpdated.diffs[0]?.state_id;
--- a/src/front/Api/Entities/index.ts
+++ b/src/front/Api/Entities/index.ts
@ -0,0 +1,2 @@
+export * from './types';
+export * from './rule'; 
--- a/src/front/Api/Entities/types.ts
+++ b/src/front/Api/Entities/types.ts
@ -0,0 +1,21 @@
+/**
+ * FileBlob interface representing a file's binary data and metadata
+ * Used for file transmission and storage in the application
+ */
+export interface FileBlob {
+  /** MIME type of the file (e.g., "application/pdf", "image/jpeg") */
+  type: string;
+  /** Binary data of the file as Uint8Array */
+  data: Uint8Array;
+}
+
+/**
+ * FileData interface representing a complete file object with blob and metadata
+ * Used when creating or updating files in the system
+ */
+export interface FileData {
+  /** The file blob containing type and binary data */
+  file_blob: FileBlob;
+  /** The name of the file */
+  file_name: string;
+} 
--- a/src/front/Components/DesignSystem/DepositOtherDocument/index.tsx
+++ b/src/front/Components/DesignSystem/DepositOtherDocument/index.tsx
@ -14,10 +14,12 @@ import classNames from "classnames";

 import Button, { EButtonstyletype, EButtonVariant } from "../Button";
 import Confirm from "../OldModal/Confirm";
-import Documents from "@Front/Api/LeCoffreApi/Customer/Documents/Documents";
-import Files from "@Front/Api/LeCoffreApi/Customer/Files/Files";
 import Alert from "../OldModal/Alert";

+import DocumentService from "src/common/Api/LeCoffreApi/sdk/DocumentService";
+import LoaderService from "src/common/Api/LeCoffreApi/sdk/Loader/LoaderService";
+import FileService from "src/common/Api/LeCoffreApi/sdk/FileService";
+
 type IProps = {
 	onChange?: (files: File[]) => void;
 	open: boolean;
@ -196,7 +198,7 @@ export default class DepositOtherDocument extends React.Component<IProps, IState
 		);
 	}

-	public override componentDidMount(): void {}
+	public override componentDidMount(): void { }

 	private onCloseAlertUpload() {
 		this.setState({ showFailedUploaded: null });
@ -206,18 +208,30 @@ export default class DepositOtherDocument extends React.Component<IProps, IState
 		this.setState({
 			isLoading: true,
 		});
-		const filesArray = this.state.currentFiles;

+		const filesArray = this.state.currentFiles;
 		if (!filesArray) return;
-		let documentCreated: Document = {} as Document;
+
+		LoaderService.getInstance().show();
+		let documentCreated: any;
 		try {
-			documentCreated = await Documents.getInstance().post({
-				folder: {
-					uid: this.props.folder_uid,
-				},
-				depositor: {
-					uid: this.props.customer_uid,
-				},
+			documentCreated = await new Promise<any>((resolve: (document: any) => void) => {
+				const documentTypeData: any = {
+					folder: {
+						uid: this.props.folder_uid,
+					},
+					depositor: {
+						uid: this.props.customer_uid,
+					}
+				};
+				const validatorId: string = '884cb36a346a79af8697559f16940141f068bdf1656f88fa0df0e9ecd7311fb8:0';
+
+				DocumentService.createDocument(documentTypeData, validatorId).then((processCreated: any) => {
+					if (processCreated) {
+						const document: any = processCreated.processData;
+						resolve(document);
+					}
+				});
 			});
 		} catch (e) {
 			this.setState({ showFailedDocument: "Le dossier est vérifié aucune modification n'est acceptée", isLoading: false });
@ -225,16 +239,46 @@ export default class DepositOtherDocument extends React.Component<IProps, IState
 		}

 		for (let i = 0; i < filesArray.length; i++) {
-			const formData = new FormData();
-			formData.append("file", filesArray[i]!.file, filesArray[i]!.fileName);
-			const query = JSON.stringify({ document: { uid: documentCreated.uid } });
-			formData.append("q", query);
-			try {
-				await Files.getInstance().post(formData);
-			} catch (e) {
-				this.setState({ showFailedUploaded: "Le fichier ne correspond pas aux critères demandés", isLoading: false });
-				return;
-			}
+			const file = filesArray[i]!.file;
+			await new Promise<void>((resolve: () => void) => {
+				const reader = new FileReader();
+				reader.onload = (event) => {
+					if (event.target?.result) {
+						const arrayBuffer = event.target.result as ArrayBuffer;
+						const uint8Array = new Uint8Array(arrayBuffer);
+
+						const fileBlob: any = {
+							type: file.type,
+							data: uint8Array
+						};
+
+						const fileData: any = {
+							file_blob: fileBlob,
+							file_name: file.name
+						};
+						const validatorId: string = '884cb36a346a79af8697559f16940141f068bdf1656f88fa0df0e9ecd7311fb8:0';
+
+						FileService.createFile(fileData, validatorId).then((processCreated: any) => {
+							const fileUid: string = processCreated.processData.uid;
+
+							DocumentService.getDocumentByUid(documentCreated.uid).then((process: any) => {
+								if (process) {
+									const document: any = process.processData;
+
+									let files: any[] = document.files;
+									if (!files) {
+										files = [];
+									}
+									files.push({ uid: fileUid });
+
+									DocumentService.updateDocument(process, { files: files, document_status: EDocumentStatus.DEPOSITED }).then(() => resolve());
+								}
+							});
+						});
+					}
+				};
+				reader.readAsArrayBuffer(file);
+			});
 		}

 		this.setState({
--- a/src/front/Components/DesignSystem/DragAndDrop/index.tsx
+++ b/src/front/Components/DesignSystem/DragAndDrop/index.tsx
@ -213,9 +213,9 @@ export default function DragAndDrop(props: IProps) {
 			</div>
 			{documentFiles.length > 0 && (
 				<div className={classes["documents"]}>
-					{documentFiles.map((documentFile) => (
+					{documentFiles.map((documentFile, index) => (
 						<DocumentFileElement
-							key={documentFile.id}
+							key={documentFile.uid || `${documentFile.id}-${index}`}
 							isLoading={documentFile.isLoading}
 							file={documentFile.file}
 							onRemove={() => handleRemove(documentFile)}
--- a/src/front/Components/LayoutTemplates/DefaultCustomerDashboard/index.tsx
+++ b/src/front/Components/LayoutTemplates/DefaultCustomerDashboard/index.tsx
@ -1,4 +1,3 @@
-import Folders from "@Front/Api/LeCoffreApi/Customer/Folders/Folders";
 import { IBlock } from "@Front/Components/DesignSystem/SearchBlockList/BlockList/Block";
 import Module from "@Front/Config/Module";
 import JwtService from "@Front/Services/JwtService/JwtService";
@ -14,7 +13,7 @@ type IProps = IPropsDashboardWithList & {};

 export default function DefaultCustomerDashboard(props: IProps) {
 	const router = useRouter();
-	const { folderUid } = router.query;
+	const { folderUid, profileUid } = router.query;
 	const [folders, setFolders] = useState<OfficeFolder[]>([]);

 	useEffect(() => {
@ -61,7 +60,9 @@ export default function DefaultCustomerDashboard(props: IProps) {
 		router.push(
 			Module.getInstance()
 				.get()
-				.modules.pages.ClientDashboard.props.path.replace("[folderUid]", folder.uid ?? ""),
+				.modules.pages.ClientDashboard.props.path
+				.replace("[folderUid]", folder.uid ?? "")
+				.replace("[profileUid]", profileUid as string ?? ""),
 		);
 	};
 	return <DefaultDashboardWithList {...props} onSelectedBlock={onSelectedBlock} blocks={getBlocks(folders)} headerConnected={false} />;
--- a/src/front/Components/Layouts/ClientDashboard/DepositDocumentComponent/index.tsx
+++ b/src/front/Components/Layouts/ClientDashboard/DepositDocumentComponent/index.tsx
@ -9,6 +9,8 @@ import Confirm from "@Front/Components/DesignSystem/OldModal/Confirm";

 import FileService from "src/common/Api/LeCoffreApi/sdk/FileService";
 import DocumentService from "src/common/Api/LeCoffreApi/sdk/DocumentService";
+import { FileBlob, FileData } from "@Front/Api/Entities/types";
+import WatermarkService from "@Front/Services/WatermarkService";

 type IProps = {
 	document: any;
@ -30,50 +32,101 @@ export default function DepositDocumentComponent(props: IProps) {
 	}, [document.files]);

 	const addFile = useCallback(
-		(file: File) => {
-			return new Promise<void>(
-				(resolve: () => void) => {
-					const reader = new FileReader();
-					reader.onload = (event) => {
-						if (event.target?.result) {
-							const arrayBuffer = event.target.result as ArrayBuffer;
-							const uint8Array = new Uint8Array(arrayBuffer);
+		async (file: File) => {
+			try {
+				// Add watermark to the file before processing
+				const watermarkedFile = await WatermarkService.getInstance().addWatermark(file);
 				
-							const fileBlob: any = {
-								type: file.type,
-								data: uint8Array
-							};
+				return new Promise<void>(
+					(resolve: () => void) => {
+						const reader = new FileReader();
+						reader.onload = (event) => {
+							if (event.target?.result) {
+								const arrayBuffer = event.target.result as ArrayBuffer;
+								const uint8Array = new Uint8Array(arrayBuffer);

-							const fileData: any = {
-								file_blob: fileBlob,
-								file_name: file.name
-							};
-							const validatorId: string = '884cb36a346a79af8697559f16940141f068bdf1656f88fa0df0e9ecd7311fb8:0';
+								const fileBlob: FileBlob = {
+									type: watermarkedFile.type,
+									data: uint8Array
+								};

-							FileService.createFile(fileData, validatorId).then((processCreated: any) => {
-								const fileUid: string = processCreated.processData.uid;
+								const fileData: FileData = {
+									file_blob: fileBlob,
+									file_name: watermarkedFile.name
+								};
+								const validatorId: string = '884cb36a346a79af8697559f16940141f068bdf1656f88fa0df0e9ecd7311fb8:0';

-								DocumentService.getDocumentByUid(document.uid!).then((process: any) => {
-									if (process) {
-										const document: any = process.processData;
+								FileService.createFile(fileData, validatorId).then((processCreated: any) => {
+									const fileUid: string = processCreated.processData.uid;

-										let files: any[] = document.files;
-										if (!files) {
-											files = [];
+									DocumentService.getDocumentByUid(document.uid!).then((process: any) => {
+										if (process) {
+											const document: any = process.processData;
+
+											let files: any[] = document.files;
+											if (!files) {
+												files = [];
+											}
+											files.push({ uid: fileUid });
+
+											DocumentService.updateDocument(process, { files: files, document_status: EDocumentStatus.DEPOSITED }).then(() => resolve());
 										}
-										files.push({ uid: fileUid });
-
-										DocumentService.updateDocument(process, { files: files, document_status: EDocumentStatus.DEPOSITED }).then(() => resolve());
-									}
+									});
 								});
-							});
-						}
-					};
-					reader.readAsArrayBuffer(file);
-				})
-				.then(onChange)
-				.then(() => ToasterService.getInstance().success({ title: "Succès !", description: "Fichier uploadé avec succès!" }))
-				.catch((error) => ToasterService.getInstance().error({ title: "Erreur !", description: error.message }));
+							}
+						};
+						reader.readAsArrayBuffer(watermarkedFile);
+					})
+					.then(onChange)
+					.then(() => ToasterService.getInstance().success({ title: "Succès !", description: "Fichier uploadé avec succès!" }))
+					.catch((error) => ToasterService.getInstance().error({ title: "Erreur !", description: error.message }));
+			} catch (error) {
+				console.error('Error processing file with watermark:', error);
+				// If watermarking fails, proceed with original file
+				return new Promise<void>(
+					(resolve: () => void) => {
+						const reader = new FileReader();
+						reader.onload = (event) => {
+							if (event.target?.result) {
+								const arrayBuffer = event.target.result as ArrayBuffer;
+								const uint8Array = new Uint8Array(arrayBuffer);
+
+								const fileBlob: FileBlob = {
+									type: file.type,
+									data: uint8Array
+								};
+
+								const fileData: FileData = {
+									file_blob: fileBlob,
+									file_name: file.name
+								};
+								const validatorId: string = '884cb36a346a79af8697559f16940141f068bdf1656f88fa0df0e9ecd7311fb8:0';
+
+								FileService.createFile(fileData, validatorId).then((processCreated: any) => {
+									const fileUid: string = processCreated.processData.uid;
+
+									DocumentService.getDocumentByUid(document.uid!).then((process: any) => {
+										if (process) {
+											const document: any = process.processData;
+
+											let files: any[] = document.files;
+											if (!files) {
+												files = [];
+											}
+											files.push({ uid: fileUid });
+
+											DocumentService.updateDocument(process, { files: files, document_status: EDocumentStatus.DEPOSITED }).then(() => resolve());
+										}
+									});
+								});
+							}
+						};
+						reader.readAsArrayBuffer(file);
+					})
+					.then(onChange)
+					.then(() => ToasterService.getInstance().success({ title: "Succès !", description: "Fichier uploadé avec succès!" }))
+					.catch((error) => ToasterService.getInstance().error({ title: "Erreur !", description: error.message }));
+			}
 		},
 		[document.uid, onChange],
 	);
@ -82,9 +135,9 @@ export default function DepositDocumentComponent(props: IProps) {
 		(fileUid: string) => {
 			return new Promise<void>(
 				(resolve: () => void) => {
-					FileService.getFileByUid(fileUid).then((process: any) => {
-						if (process) {
-							FileService.updateFile(process, { isDeleted: 'true' }).then(() => {
+					FileService.getFileByUid(fileUid).then((res: any) => {
+						if (res) {
+							FileService.updateFile(res.processId, { isDeleted: 'true' }).then(() => {
 								DocumentService.getDocumentByUid(document.uid!).then((process: any) => {
 									if (process) {
 										const document: any = process.processData;
@ -110,7 +163,8 @@ export default function DepositDocumentComponent(props: IProps) {
 	);

 	const onOpenModal = useCallback(async () => {
-		const refused_reason = document.document_history?.find((history: any) => history.document_status === "REFUSED")?.refused_reason;
+		if (document.document_status !== "REFUSED") return;
+		const refused_reason = document.refused_reason;
 		if (!refused_reason) return;
 		setRefusedReason(refused_reason);
 		setIsModalOpen(true);
--- a/src/front/Components/Layouts/ClientDashboard/ReceivedDocuments/index.tsx
+++ b/src/front/Components/Layouts/ClientDashboard/ReceivedDocuments/index.tsx
@ -1,5 +1,3 @@
-import DocumentsNotary from "@Front/Api/LeCoffreApi/Customer/DocumentsNotary/DocumentsNotary";
-import FilesNotary from "@Front/Api/LeCoffreApi/Customer/FilesNotary/Files";
 import Button, { EButtonSize, EButtonstyletype, EButtonVariant } from "@Front/Components/DesignSystem/Button";
 import IconButton from "@Front/Components/DesignSystem/IconButton";
 import Table from "@Front/Components/DesignSystem/Table";
@ -16,10 +14,14 @@ import { useRouter } from "next/router";
 import React, { useCallback, useEffect, useState } from "react";
 import classes from "./classes.module.scss";
 import Link from "next/link";
-import Folders from "@Front/Api/LeCoffreApi/Customer/Folders/Folders";
 import Customer from "le-coffre-resources/dist/Customer";
 import { DocumentNotary } from "le-coffre-resources/dist/Notary";

+import FolderService from "src/common/Api/LeCoffreApi/sdk/FolderService";
+import DocumentService from "src/common/Api/LeCoffreApi/sdk/DocumentService";
+import FileService from "src/common/Api/LeCoffreApi/sdk/FileService";
+import LoaderService from "src/common/Api/LeCoffreApi/sdk/Loader/LoaderService";
+
 const header: readonly IHead[] = [
 	{
 		key: "name",
@ -47,6 +49,26 @@ export default function ReceivedDocuments() {
 			jwt = JwtService.getInstance().decodeCustomerJwt();
 		}

+		// TODO: review
+		LoaderService.getInstance().show();
+		const folder: any = await new Promise<any>((resolve: (folder: any) => void) => {
+			FolderService.getFolderByUid(folderUid as string).then((process: any) => {
+				if (process) {
+					const folder: any = process.processData;
+					resolve(folder);
+				}
+			});
+		});
+
+		//const customer = folder?.customers?.find((customer) => customer.contact?.email === jwt?.email);
+		const customer = folder?.customers?.[0];
+		if (!customer) throw new Error("Customer not found");
+
+		setCustomer(customer);
+
+		return { folder, customer };
+
+		/*
 		const folder = await Folders.getInstance().getByUid(folderUid as string, {
 			q: {
 				office: true,
@ -76,32 +98,58 @@ export default function ReceivedDocuments() {
 		setCustomer(customer);

 		return { folder, customer };
+		*/
 	}, [folderUid]);

 	useEffect(() => {
 		fetchFolderAndCustomer();
+	}, [folderUid]); // Ne dépend que de folderUid
+
+	// Effet séparé pour charger les documents lorsque customer change
+	useEffect(() => {
 		const customerUid = customer?.uid;
 		if (!folderUid || !customerUid) return;
-		DocumentsNotary.getInstance()
-			.get({ where: { folder: { uid: folderUid }, customer: { uid: customerUid } }, include: { files: true } })
-			.then((documentsNotary) => setDocumentsNotary(documentsNotary));
-	}, [folderUid, customer, fetchFolderAndCustomer]);

-	const onDownload = useCallback((doc: DocumentNotary) => {
+		DocumentService.getDocuments().then(async (processes: any[]) => {
+			if (processes.length > 0) {
+				let documents: any[] = processes.map((process: any) => process.processData);
+
+				// FilterBy folder.uid & customer.uid
+				documents = documents.filter((document: any) => document.folder.uid === folderUid && document.customer && document.customer.uid === customerUid);
+
+				for (const document of documents) {
+					if (document.files && document.files.length > 0) {
+						const files: any[] = [];
+						for (const file of document.files) {
+							files.push((await FileService.getFileByUid(file.uid)).processData);
+						}
+						document.files = files;
+					}
+				}
+
+				setDocumentsNotary(documents);
+				LoaderService.getInstance().hide();
+			}
+		});
+	}, [folderUid, customer]);
+
+	const onDownload = useCallback((doc: any) => {
 		const file = doc.files?.[0];
-		if (!file || !file?.uid || !doc.uid) return;
+		if (!file) return;

-		return FilesNotary.getInstance()
-			.download(file.uid, doc.uid)
-			.then((blob) => {
-				const url = URL.createObjectURL(blob);
-				const a = document.createElement("a");
-				a.href = url;
-				a.download = file.file_name ?? "file";
-				a.click();
-				URL.revokeObjectURL(url);
-			})
-			.catch((e) => console.warn(e));
+		return new Promise<void>((resolve: () => void) => {
+			const blob = new Blob([file.file_blob.data], { type: file.file_blob.type });
+			const url = URL.createObjectURL(blob);
+			const a = document.createElement('a');
+			a.href = url;
+			a.download = file.file_name;
+			document.body.appendChild(a);
+			a.click();
+			document.body.removeChild(a);
+			URL.revokeObjectURL(url);
+
+			resolve();
+		}).catch((e) => console.warn(e));
 	}, []);

 	const onDownloadAll = useCallback(async () => {
@ -110,16 +158,14 @@ export default function ReceivedDocuments() {
 		const zip = new JSZip();
 		const folder = zip.folder("documents") || zip;

-		const downloadPromises = documentsNotary.map(async (doc) => {
+		documentsNotary.map((doc: any) => {
 			const file = doc.files?.[0];
-			if (file && file.uid && doc.uid) {
-				const blob = await FilesNotary.getInstance().download(file.uid, doc.uid);
+			if (file) {
+				const blob = new Blob([file.file_blob.data], { type: file.file_blob.type });
 				folder.file(file.file_name ?? "file", blob);
 			}
 		});

-		await Promise.all(downloadPromises);
-
 		zip.generateAsync({ type: "blob" })
 			.then((blob: any) => {
 				saveAs(blob, "documents.zip");
--- a/src/front/Components/Layouts/ClientDashboard/ViewDocumentsNotary/index.tsx
+++ b/src/front/Components/Layouts/ClientDashboard/ViewDocumentsNotary/index.tsx
@ -7,12 +7,16 @@ import { DocumentNotary } from "le-coffre-resources/dist/Notary";
 import Image from "next/image";
 import { NextRouter, useRouter } from "next/router";
 import React from "react";
+import { FileBlob } from "@Front/Api/Entities/types";

 import BasePage from "../../Base";
 import classes from "./classes.module.scss";
-import DocumentsNotary from "@Front/Api/LeCoffreApi/Customer/DocumentsNotary/DocumentsNotary";
+
 import DefaultTemplate from "@Front/Components/LayoutTemplates/DefaultTemplate";
-import FilesNotary from "@Front/Api/LeCoffreApi/Customer/FilesNotary/Files";
+
+import DocumentService from "src/common/Api/LeCoffreApi/sdk/DocumentService";
+import FileService from "src/common/Api/LeCoffreApi/sdk/FileService";
+import LoaderService from "src/common/Api/LeCoffreApi/sdk/Loader/LoaderService";

 type IProps = {};
 type IPropsClass = {
@ -25,7 +29,7 @@ type IState = {
 	isValidateModalVisible: boolean;
 	refuseText: string;
 	selectedFileIndex: number;
-	selectedFile: any;
+	selectedFile: { uid: string; file_name: string; file_blob: FileBlob } | null;
 	documentNotary: DocumentNotary | null;
 	fileBlob: Blob | null;
 	isLoading: boolean;
@ -123,16 +127,31 @@ class ViewDocumentsNotaryClass extends BasePage<IPropsClass, IState> {

 	override async componentDidMount() {
 		try {
-			const documentNotary = await DocumentsNotary.getInstance().getByUid(this.props.documentUid, {
-				files: true,
-				folder: true,
-				depositor: true,
+			LoaderService.getInstance().show();
+			const documentNotary: any = await new Promise<any>((resolve: (document: any) => void) => {
+				DocumentService.getDocumentByUid(this.props.documentUid).then(async (process: any) => {
+					if (process) {
+						const document: any = process.processData;
+
+						if (document.files && document.files.length > 0) {
+							const files: any[] = [];
+							for (const file of document.files) {
+								files.push((await FileService.getFileByUid(file.uid)).processData);
+							}
+							document.files = files;
+						}
+
+						resolve(document);
+					}
+				});
 			});
+			LoaderService.getInstance().hide();
+
 			this.setState(
 				{
 					documentNotary,
 					selectedFileIndex: 0,
-					selectedFile: documentNotary.files![0]!,
+					selectedFile: documentNotary.files![0] as any,
 					isLoading: false,
 				},
 				() => {
@ -149,8 +168,7 @@ class ViewDocumentsNotaryClass extends BasePage<IPropsClass, IState> {

 	private async getFilePreview(): Promise<void> {
 		try {
-			const fileBlob: Blob = await FilesNotary.getInstance().download(this.state.selectedFile?.uid as string, this.props.documentUid);
-
+			const fileBlob: Blob = new Blob([this.state.selectedFile.file_blob.data], { type: this.state.selectedFile.file_blob.type });
 			this.setState({
 				fileBlob,
 			});
--- a/src/front/Components/Layouts/ClientDashboard/index.tsx
+++ b/src/front/Components/Layouts/ClientDashboard/index.tsx
@ -1,5 +1,4 @@
 "use client";
-import Documents, { IGetDocumentsparams } from "@Front/Api/LeCoffreApi/Customer/Documents/Documents";

 import Typography, { ETypo, ETypoColor } from "@Front/Components/DesignSystem/Typography";

@ -10,7 +9,6 @@ import { DocumentNotary, OfficeFolder as OfficeFolderNotary } from "le-coffre-re
 import classes from "./classes.module.scss";
 import { useRouter } from "next/router";
 import JwtService, { ICustomerJwtPayload } from "@Front/Services/JwtService/JwtService";
-import Folders from "@Front/Api/LeCoffreApi/Customer/Folders/Folders";

 import Tag, { ETagColor } from "@Front/Components/DesignSystem/Tag";
 import DefaultCustomerDashboard from "@Front/Components/LayoutTemplates/DefaultCustomerDashboard";
@ -21,16 +19,19 @@ import Module from "@Front/Config/Module";
 import Separator, { ESeperatorColor, ESeperatorDirection } from "@Front/Components/DesignSystem/Separator";
 import NotificationBox from "@Front/Components/DesignSystem/NotificationBox";
 import ContactBox from "./ContactBox";
-import DocumentsNotary from "@Front/Api/LeCoffreApi/Customer/DocumentsNotary/DocumentsNotary";
 import { EDocumentNotaryStatus } from "le-coffre-resources/dist/Notary/DocumentNotary";
 import DepositOtherDocument from "@Front/Components/DesignSystem/DepositOtherDocument";

+import Modal from "@Front/Components/DesignSystem/Modal";
+import TextField from "@Front/Components/DesignSystem/Form/TextField";
+
 import AuthModal from "src/sdk/AuthModal";

 import FolderService from "src/common/Api/LeCoffreApi/sdk/FolderService";
 import DocumentService from "src/common/Api/LeCoffreApi/sdk/DocumentService";
 import DocumentTypeService from "src/common/Api/LeCoffreApi/sdk/DocumentTypeService";
 import FileService from "src/common/Api/LeCoffreApi/sdk/FileService";
+import LoaderService from "src/common/Api/LeCoffreApi/sdk/Loader/LoaderService";

 type IProps = {};

@ -46,6 +47,30 @@ export default function ClientDashboard(props: IProps) {
 	const [isAddDocumentModalVisible, setIsAddDocumentModalVisible] = useState<boolean>(false);

 	const [isAuthModalOpen, setIsAuthModalOpen] = useState(false);
+	const [isSmsModalOpen, setIsSmsModalOpen] = useState(false);
+	const [smsCode, setSmsCode] = useState("");
+	const [smsError, setSmsError] = useState("");
+
+	const verifySmsCode = useCallback(() => {
+		if (smsCode === "1234") {
+			setIsSmsModalOpen(false);
+		} else {
+			setSmsError("Code incorrect. Le code valide est 1234.");
+		}
+	}, [smsCode]);
+
+	useEffect(() => {
+		const handleKeyPress = (e: KeyboardEvent) => {
+			if (e.key === "Enter" && isSmsModalOpen) {
+				verifySmsCode();
+			}
+		};
+
+		window.addEventListener("keypress", handleKeyPress);
+		return () => {
+			window.removeEventListener("keypress", handleKeyPress);
+		};
+	}, [isSmsModalOpen, smsCode, verifySmsCode]);

 	const fetchFolderAndCustomer = useCallback(async () => {
 		let jwt: ICustomerJwtPayload | undefined;
@ -54,6 +79,7 @@ export default function ClientDashboard(props: IProps) {
 		}

 		// TODO: review
+		LoaderService.getInstance().show();
 		const { folder, customer } = await new Promise<any>((resolve) => {
 			FolderService.getFolderByUid(folderUid as string).then((process: any) => {
 				if (process) {
@ -72,6 +98,7 @@ export default function ClientDashboard(props: IProps) {
 		setFolder(folder);

 		setIsAuthModalOpen(true);
+		LoaderService.getInstance().hide();

 		return { folder, customer };

@ -111,52 +138,34 @@ export default function ClientDashboard(props: IProps) {

 	const fetchDocuments = useCallback(
 		async (customerUid: string | undefined) => {
-			/* TODO: review
-			const query: IGetDocumentsparams = {
-				where: { depositor: { uid: customerUid }, folder_uid: folderUid as string },
-				include: {
-					files: true,
-					document_history: true,
-					document_type: true,
-					depositor: true,
-					folder: {
-						include: {
-							customers: {
-								include: {
-									contact: true,
-								},
-							},
-						},
-					},
-				},
-			};
+			LoaderService.getInstance().show();
+			return new Promise<void>((resolve: () => void) => {
+				DocumentService.getDocuments().then(async (processes: any[]) => {
+					if (processes.length > 0) {
+						let documents: any[] = processes.map((process: any) => process.processData);

-			return Documents.getInstance()
-				.get(query)
-				.then((documents) => setDocuments(documents));
-				*/
+						// FilterBy folder.uid & depositor.uid
+						documents = documents.filter((document: any) => document.folder.uid === folderUid && document.depositor && document.depositor.uid === customerUid);

-			return DocumentService.getDocuments().then(async (processes: any[]) => {
-				if (processes.length > 0) {
-					let documents: any[] = processes.map((process: any) => process.processData);
-
-					// FilterBy folder_uid
-					documents = documents.filter((document: any) => document.folder.uid === folderUid && document.depositor);
-
-					for (const document of documents) {
-						document.document_type = (await DocumentTypeService.getDocumentTypeByUid(document.document_type.uid)).processData;
-
-						if (document.files && document.files.length > 0) {
-							const files: any[] = [];
-							for (const file of document.files) {
-								files.push((await FileService.getFileByUid(file.uid)).processData);
+						for (const document of documents) {
+							if (document.document_type) {
+								document.document_type = (await DocumentTypeService.getDocumentTypeByUid(document.document_type.uid)).processData;
 							}
-							document.files = files;
-						}
-					}

-					setDocuments(documents);
-				}
+							if (document.files && document.files.length > 0) {
+								const files: any[] = [];
+								for (const file of document.files) {
+									files.push((await FileService.getFileByUid(file.uid)).processData);
+								}
+								document.files = files;
+							}
+						}
+
+						setDocuments(documents);
+					}
+					LoaderService.getInstance().hide();
+					resolve();
+				});
 			});
 		},
 		[folderUid],
@ -170,12 +179,28 @@ export default function ClientDashboard(props: IProps) {
 		const customerUid = customer?.uid;
 		if (!folderUid || !customerUid) return;

-		/* TODO: review
-		DocumentsNotary.getInstance()
-			.get({ where: { folder: { uid: folderUid }, customer: { uid: customerUid } }, include: { files: true } })
-			.then((documentsNotary) => setDocumentsNotary(documentsNotary));
-			*/
+		LoaderService.getInstance().show();
+		DocumentService.getDocuments().then(async (processes: any[]) => {
+			if (processes.length > 0) {
+				let documents: any[] = processes.map((process: any) => process.processData);

+				// FilterBy folder.uid & customer.uid
+				documents = documents.filter((document: any) => document.folder.uid === folderUid && document.customer && document.customer.uid === customerUid);
+
+				for (const document of documents) {
+					if (document.files && document.files.length > 0) {
+						const files: any[] = [];
+						for (const file of document.files) {
+							files.push((await FileService.getFileByUid(file.uid)).processData);
+						}
+						document.files = files;
+					}
+				}
+
+				setDocumentsNotary(documents);
+				LoaderService.getInstance().hide();
+			}
+		});
 	}, [folderUid, customer?.uid]);

 	const documentsNotaryNotRead = useMemo(
@ -312,8 +337,52 @@ export default function ClientDashboard(props: IProps) {
 					isOpen={isAuthModalOpen}
 					onClose={() => {
 						setIsAuthModalOpen(false);
+						setIsSmsModalOpen(true);
 					}}
 				/>}
+
+				{isSmsModalOpen && (
+					<Modal
+						isOpen={isSmsModalOpen}
+						onClose={() => setIsSmsModalOpen(false)}
+						title="Vérification SMS"
+					>
+						<div className={classes["sms-modal-content"]}>
+							<Typography typo={ETypo.TEXT_MD_REGULAR} color={ETypoColor.TEXT_PRIMARY}>
+								Veuillez saisir le code à 4 chiffres que vous avez reçu par SMS
+							</Typography>
+
+							<TextField
+								name="smsCode"
+								placeholder="Code SMS à 4 chiffres"
+								value={smsCode}
+								onChange={(e) => {
+									const value = e.target.value;
+									// Only allow digits
+									if (value === "" || /^\d+$/.test(value)) {
+										setSmsCode(value);
+										setSmsError("");
+									}
+								}}
+							/>
+
+							{smsError && (
+								<Typography typo={ETypo.TEXT_SM_REGULAR} color={ETypoColor.TEXT_ACCENT}>
+									{smsError}
+								</Typography>
+							)}
+
+							<div style={{ marginTop: "20px" }}>
+								<Button
+									variant={EButtonVariant.PRIMARY}
+									onClick={verifySmsCode}
+								>
+									Vérifier
+								</Button>
+							</div>
+						</div>
+					</Modal>
+				)}
 			</div>
 		</DefaultCustomerDashboard>
 	);
--- a/src/front/Components/Layouts/Folder/AskDocuments/index.tsx
+++ b/src/front/Components/Layouts/Folder/AskDocuments/index.tsx
@ -18,6 +18,7 @@ import backgroundImage from "@Assets/images/background_refonte.svg";
 import FolderService from "src/common/Api/LeCoffreApi/sdk/FolderService";
 import DocumentService from "src/common/Api/LeCoffreApi/sdk/DocumentService";
 import LoaderService from "src/common/Api/LeCoffreApi/sdk/Loader/LoaderService";
+import { DocumentData } from "../FolderInformation/ClientView/DocumentTables/types";

 export default function AskDocuments() {
 	const router = useRouter();
@ -62,17 +63,21 @@ export default function AskDocuments() {
 				LoaderService.getInstance().show();
 				const documentAsked: [] = values["document_types"] as [];
 				for (let i = 0; i < documentAsked.length; i++) {
+					const documentTypeUid = documentAsked[i];
+					if (!documentTypeUid) continue;
+					
 					const documentData: any = {
 						folder: {
-							uid: folderUid,
+							uid: folderUid as string,
 						},
 						depositor: {
-							uid: customerUid,
+							uid: customerUid as string,
 						},
 						document_type: {
-							uid: documentAsked[i]
+							uid: documentTypeUid
 						},
-						document_status: EDocumentStatus.ASKED
+						document_status: EDocumentStatus.ASKED,
+						file_uid: null,
 					};
 					const validatorId: string = '884cb36a346a79af8697559f16940141f068bdf1656f88fa0df0e9ecd7311fb8:0';

--- a/src/front/Components/Layouts/Folder/DocumentVerification/classes.module.scss
+++ b/src/front/Components/Layouts/Folder/DocumentVerification/classes.module.scss
@ -0,0 +1,171 @@
+@import "@Themes/constants.scss";
+
+.root {
+	display: flex;
+	flex-direction: column;
+	gap: var(--spacing-2xl, 40px);
+	max-width: 800px;
+	margin: 0 auto;
+	padding: var(--spacing-xl, 32px);
+
+	.header {
+		display: flex;
+		flex-direction: column;
+		gap: var(--spacing-md, 16px);
+		text-align: center;
+	}
+
+	.content {
+		display: flex;
+		flex-direction: column;
+		gap: var(--spacing-2xl, 40px);
+
+		.drag-drop-container {
+			display: flex;
+			flex-direction: column;
+			gap: var(--spacing-xl, 32px);
+
+			@media (min-width: $screen-m) {
+				flex-direction: row;
+				gap: var(--spacing-lg, 24px);
+			}
+
+			.drag-drop-box {
+				flex: 1;
+				min-height: 200px;
+				display: flex;
+				flex-direction: column;
+				gap: var(--spacing-sm, 8px);
+				
+				// Force the DragAndDrop component to take full width and height
+				> div {
+					width: 100% !important;
+					height: 100% !important;
+					min-height: 200px !important;
+					display: flex !important;
+					flex-direction: column !important;
+					
+					// Override the fit-content width from DragAndDrop
+					&.root {
+						width: 100% !important;
+						height: 100% !important;
+						min-height: 200px !important;
+					}
+				}
+
+				.file-info {
+					padding: var(--spacing-sm, 8px) var(--spacing-md, 16px);
+					background-color: var(--color-success-50, #f0f9ff);
+					border: 1px solid var(--color-success-200, #bae6fd);
+					border-radius: var(--radius-md, 8px);
+					margin-top: var(--spacing-sm, 8px);
+				}
+			}
+		}
+
+		.warning {
+			text-align: center;
+			padding: var(--spacing-md, 16px);
+			background-color: var(--color-warning-50, #fffbeb);
+			border: 1px solid var(--color-warning-200, #fde68a);
+			border-radius: var(--radius-md, 8px);
+		}
+
+		.verification-result {
+			text-align: center;
+			padding: var(--spacing-lg, 24px);
+			border-radius: var(--radius-md, 8px);
+			border: 2px solid;
+			display: flex;
+			flex-direction: column;
+			gap: var(--spacing-md, 16px);
+
+			&.success {
+				background-color: var(--color-success-50, #f0fdf4);
+				border-color: var(--color-success-200, #bbf7d0);
+			}
+
+			&.error {
+				background-color: var(--color-error-50, #fef2f2);
+				border-color: var(--color-error-200, #fecaca);
+			}
+
+			.verification-details {
+				background-color: rgba(0, 0, 0, 0.05);
+				padding: var(--spacing-md, 16px);
+				border-radius: var(--radius-sm, 4px);
+				font-family: monospace;
+				white-space: pre-line;
+				text-align: left;
+				max-width: 100%;
+				overflow-x: auto;
+			}
+
+			.merkle-proof-section {
+				display: flex;
+				flex-direction: column;
+				align-items: center;
+				gap: var(--spacing-md, 16px);
+				padding: var(--spacing-lg, 24px);
+				background-color: rgba(0, 0, 0, 0.02);
+				border-radius: var(--radius-md, 8px);
+				border: 1px solid rgba(0, 0, 0, 0.1);
+			}
+		}
+
+		.qr-container {
+			display: flex;
+			flex-direction: column;
+			align-items: center;
+			gap: var(--spacing-sm, 8px);
+
+			.qr-code {
+				width: 150px;
+				height: 150px;
+				border: 2px solid var(--color-neutral-200, #e5e7eb);
+				border-radius: var(--radius-sm, 4px);
+				padding: var(--spacing-sm, 8px);
+				background-color: white;
+			}
+
+			.qr-description {
+				text-align: center;
+				max-width: 200px;
+			}
+		}
+
+		.qr-loading {
+			display: flex;
+			justify-content: center;
+			align-items: center;
+			width: 150px;
+			height: 150px;
+			border: 2px dashed var(--color-neutral-300, #d1d5db);
+			border-radius: var(--radius-sm, 4px);
+			background-color: var(--color-neutral-50, #f9fafb);
+		}
+
+		.qr-error {
+			display: flex;
+			justify-content: center;
+			align-items: center;
+			width: 150px;
+			height: 150px;
+			border: 2px solid var(--color-error-200, #fecaca);
+			border-radius: var(--radius-sm, 4px);
+			background-color: var(--color-error-50, #fef2f2);
+		}
+
+		.actions {
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			gap: var(--spacing-lg, 24px);
+
+			@media (max-width: $screen-s) {
+				flex-direction: column;
+				gap: var(--spacing-md, 16px);
+			}
+		}
+	}
+} 
--- a/src/front/Components/Layouts/Folder/DocumentVerification/index.tsx
+++ b/src/front/Components/Layouts/Folder/DocumentVerification/index.tsx
@ -0,0 +1,260 @@
+import Button, { EButtonSize, EButtonstyletype, EButtonVariant } from "@Front/Components/DesignSystem/Button";
+import DragAndDrop from "@Front/Components/DesignSystem/DragAndDrop";
+import Typography, { ETypo, ETypoColor } from "@Front/Components/DesignSystem/Typography";
+import Module from "@Front/Config/Module";
+import PdfService from "@Front/Services/PdfService";
+import { FileBlob } from "@Front/Api/Entities/types";
+import { ShieldCheckIcon } from "@heroicons/react/24/outline";
+import { useRouter } from "next/router";
+import React, { useState } from "react";
+import MessageBus from "src/sdk/MessageBus";
+
+import classes from "./classes.module.scss";
+import DocumentService from "src/common/Api/LeCoffreApi/sdk/DocumentService";
+import FileService from "src/common/Api/LeCoffreApi/sdk/FileService";
+
+type IProps = {
+	folderUid: string;
+};
+
+/**
+ * Convert a File object to FileBlob
+ * @param file - The File object to convert
+ * @returns Promise<FileBlob> - The converted FileBlob
+ */
+const convertFileToFileBlob = async (file: File): Promise<FileBlob> => {
+	return new Promise((resolve, reject) => {
+		const reader = new FileReader();
+		reader.onload = () => {
+			const arrayBuffer = reader.result as ArrayBuffer;
+			const uint8Array = new Uint8Array(arrayBuffer);
+			resolve({
+				type: file.type,
+				data: uint8Array
+			});
+		};
+		reader.onerror = () => reject(new Error('Failed to read file'));
+		reader.readAsArrayBuffer(file);
+	});
+};
+
+
+
+export default function DocumentVerification(props: IProps) {
+	const { folderUid } = props;
+	const router = useRouter();
+	
+	const [documentToVerify, setDocumentToVerify] = useState<File | null>(null);
+	const [validationCertificate, setValidationCertificate] = useState<File | null>(null);
+	const [isVerifying, setIsVerifying] = useState(false);
+	const [verificationResult, setVerificationResult] = useState<{
+		success: boolean;
+		message: string;
+		details?: string;
+		merkleProof?: string;
+	} | null>(null);
+
+	const handleDocumentToVerifyChange = (files: File[]) => {
+		if (files.length > 0 && files[0]) {
+			setDocumentToVerify(files[0]);
+		} else {
+			setDocumentToVerify(null);
+		}
+	};
+
+	const handleValidationCertificateChange = (files: File[]) => {
+		if (files.length > 0 && files[0]) {
+			setValidationCertificate(files[0]);
+		} else {
+			setValidationCertificate(null);
+		}
+	};
+
+	const handleVerifyDocuments = async () => {
+		if (!documentToVerify || !validationCertificate) {
+			console.error("Both documents are required for verification");
+			return;
+		}
+
+		setIsVerifying(true);
+		setVerificationResult(null);
+
+		const messageBus = MessageBus.getInstance();
+		
+		try {
+			// Here the things we need to verify:
+			// - we can produce the same hash from the document provided than what is in the validation certificate
+			// - the merkle proof is valid with that hash
+			// - the root of the merkle tree is a state id from a commited state in the process
+			// - that process is a file process linked to the right folder
+			// Step 1: Parse the validation certificate
+			const validationData = await PdfService.getInstance().parseCertificate(validationCertificate);
+
+			// Step 2: Convert File to FileBlob and hash the document using MessageBus
+			const fileBlob = await convertFileToFileBlob(documentToVerify);
+
+			await messageBus.isReady();
+			const documentHash = await messageBus.hashDocument(fileBlob, validationData.commitmentId);	
+			
+			// Step 3: Compare hashes
+			const hashesMatch = documentHash.toLowerCase() === validationData.documentHash.toLowerCase();
+
+			if (!hashesMatch) {
+				throw new Error('Hash du document invalide, le document fourni n\'est pas celui qui a été certifié');
+			}
+
+			// Step 4: Verify the merkle proof
+			const merkleProof = validationData.merkleProof;
+			const merkleProofValid = await messageBus.verifyMerkleProof(merkleProof, documentHash);
+
+			if (!merkleProofValid) {
+				throw new Error('Preuve de Merkle invalide, le document n\'a pas été certifié là où le certificat le prétend');
+			}
+
+			// Step 5: Verify that this file process depends on the right folder process
+			// First pin all the validated documents related to the folder
+			const documentProcesses = await DocumentService.getDocuments();
+
+			const documents = documentProcesses.filter((process: any) => 
+				process.processData.document_status === "VALIDATED" && 
+				process.processData.folder.uid === folderUid
+			);
+
+			if (!documents || documents.length === 0) {
+				throw new Error(`Aucune demande de document trouvé pour le dossier ${folderUid}`);
+			}
+
+			// Step 6: verify that the merkle proof match the last commited state for the file process
+			const stateId = JSON.parse(validationData.merkleProof)['root'];
+
+			let stateIdExists = false;
+			for (const doc of documents) {
+				const processData = doc.processData;
+
+				for (const file of processData.files) {
+					const fileUid = file.uid;
+					const fileProcess = await FileService.getFileByUid(fileUid);	
+					const lastUpdatedStateId = fileProcess.lastUpdatedFileState.state_id;
+
+					stateIdExists = lastUpdatedStateId === stateId; // we assume that last state is the validated document, that seems reasonable
+					if (stateIdExists) break;
+				}
+
+				if (stateIdExists) break;
+			}
+
+			if (!stateIdExists) {
+				throw new Error('La preuve fournie ne correspond à aucun document demandé pour ce dossier.');
+			}	
+
+			setVerificationResult({
+				success: true,
+				message: "✅ Vérification réussie ! Le document est authentique et intègre.",
+			});	
+		} catch (error) {
+			console.error("Verification failed:", error);
+			setVerificationResult({
+				success: false,
+				message: `❌ Erreur lors de la vérification: ${error}`,
+			});
+		} finally {
+			setIsVerifying(false);
+		}
+	};
+
+	const handleBackToFolder = () => {
+		const folderPath = Module.getInstance()
+			.get()
+			.modules.pages.Folder.pages.FolderInformation.props.path.replace("[folderUid]", folderUid);
+		router.push(folderPath);
+	};
+
+	const bothDocumentsPresent = documentToVerify && validationCertificate;
+
+	return (
+		<div className={classes["root"]}>
+			<div className={classes["header"]}>
+				<Typography typo={ETypo.TITLE_H2} color={ETypoColor.TEXT_PRIMARY}>
+					Vérification de Documents
+				</Typography>
+				<Typography typo={ETypo.TEXT_LG_REGULAR} color={ETypoColor.TEXT_SECONDARY}>
+					Vérifiez l'intégrité et l'authenticité de vos documents
+				</Typography>
+			</div>
+
+			<div className={classes["content"]}>
+				<div className={classes["drag-drop-container"]}>
+					<div className={classes["drag-drop-box"]}>
+						<DragAndDrop
+							title="Document à valider"
+							description="Glissez-déposez ou cliquez pour sélectionner le document que vous souhaitez vérifier"
+							onChange={handleDocumentToVerifyChange}
+						/>
+						{documentToVerify && (
+							<div className={classes["file-info"]}>
+								<Typography typo={ETypo.TEXT_SM_REGULAR} color={ETypoColor.COLOR_SUCCESS_500}>
+									✓ {documentToVerify.name}
+								</Typography>
+							</div>
+						)}
+					</div>
+
+					<div className={classes["drag-drop-box"]}>
+						<DragAndDrop
+							title="Certificat de validation"
+							description="Glissez-déposez ou cliquez pour sélectionner le certificat de validation correspondant"
+							onChange={handleValidationCertificateChange}
+						/>
+						{validationCertificate && (
+							<div className={classes["file-info"]}>
+								<Typography typo={ETypo.TEXT_SM_REGULAR} color={ETypoColor.COLOR_SUCCESS_500}>
+									✓ {validationCertificate.name}
+								</Typography>
+							</div>
+						)}
+					</div>
+				</div>
+
+				{!bothDocumentsPresent && (
+					<div className={classes["warning"]}>
+						<Typography typo={ETypo.TEXT_MD_REGULAR} color={ETypoColor.COLOR_WARNING_500}>
+							⚠️ Veuillez sélectionner les deux documents pour procéder à la vérification
+						</Typography>
+					</div>
+				)}
+
+				{verificationResult && (
+					<div className={`${classes["verification-result"]} ${classes[verificationResult.success ? "success" : "error"]}`}>
+						<Typography typo={ETypo.TEXT_LG_REGULAR} color={verificationResult.success ? ETypoColor.COLOR_SUCCESS_500 : ETypoColor.COLOR_ERROR_500}>
+							{verificationResult.message}
+						</Typography>
+					</div>
+				)}
+
+				<div className={classes["actions"]}>
+					<Button
+						variant={EButtonVariant.SECONDARY}
+						styletype={EButtonstyletype.TEXT}
+						size={EButtonSize.LG}
+						onClick={handleBackToFolder}
+						disabled={isVerifying}
+					>
+						Retour au dossier
+					</Button>
+					
+					<Button
+						variant={EButtonVariant.PRIMARY}
+						styletype={EButtonstyletype.CONTAINED}
+						size={EButtonSize.LG}
+						onClick={handleVerifyDocuments}
+						rightIcon={<ShieldCheckIcon />}
+						disabled={!bothDocumentsPresent || isVerifying}
+						isLoading={isVerifying}
+					>
+						{isVerifying ? "Vérification en cours..." : "Vérifier les documents"}
+					</Button>
+				</div>
+			</div>
+		</div>
+	);
+} 
--- a/src/front/Components/Layouts/Folder/FolderInformation/ClientView/ClientBox/index.tsx
+++ b/src/front/Components/Layouts/Folder/FolderInformation/ClientView/ClientBox/index.tsx
@ -43,8 +43,8 @@ export default function ClientBox(props: IProps) {
 				if (processes.length > 0) {
 					let documents: any[] = processes.map((process: any) => process.processData);

-					// FilterBy depositor_uid & folder_uid
-					documents = documents.filter((document: any) => document.depositor.uid === customerUid && document.folder.uid === folderUid);
+					// FilterBy folder.uid & depositor.uid
+					documents = documents.filter((document: any) => document.folder.uid === folderUid && document.depositor && document.depositor.uid === customerUid);

 					if (documents && documents.length > 0) {
 						closeDeleteModal();
--- a/src/front/Components/Layouts/Folder/FolderInformation/ClientView/DocumentTables/FilePreviewModal/index.tsx
+++ b/src/front/Components/Layouts/Folder/FolderInformation/ClientView/DocumentTables/FilePreviewModal/index.tsx
@ -1,8 +1,12 @@
 import Modal from "@Front/Components/DesignSystem/Modal";
 import React from "react";
+import { FileBlob } from "@Front/Api/Entities/types";

 type IProps = {
-	file: any;
+	file: {
+		uid: string;
+		file_blob: FileBlob;
+	};
 	url: string;
 	isOpen: boolean;
 	onClose?: () => void;
--- a/src/front/Components/Layouts/Folder/FolderInformation/ClientView/DocumentTables/index.tsx
+++ b/src/front/Components/Layouts/Folder/FolderInformation/ClientView/DocumentTables/index.tsx
@ -6,7 +6,7 @@ import Tag, { ETagColor, ETagVariant } from "@Front/Components/DesignSystem/Tag"
 import Typography, { ETypo, ETypoColor } from "@Front/Components/DesignSystem/Typography";
 import Module from "@Front/Config/Module";
 import useOpenable from "@Front/Hooks/useOpenable";
-import { ArrowDownTrayIcon, EyeIcon, TrashIcon } from "@heroicons/react/24/outline";
+import { ArrowDownTrayIcon, EyeIcon, TrashIcon, DocumentTextIcon } from "@heroicons/react/24/outline";
 import { useMediaQuery } from "@mui/material";
 import { EDocumentStatus } from "le-coffre-resources/dist/Customer/Document";
 import DocumentNotary, { EDocumentNotaryStatus } from "le-coffre-resources/dist/Notary/DocumentNotary";
@ -22,6 +22,9 @@ import DocumentService from "src/common/Api/LeCoffreApi/sdk/DocumentService";
 import DocumentTypeService from "src/common/Api/LeCoffreApi/sdk/DocumentTypeService";
 import FileService from "src/common/Api/LeCoffreApi/sdk/FileService";
 import LoaderService from "src/common/Api/LeCoffreApi/sdk/Loader/LoaderService";
+import FolderService from "src/common/Api/LeCoffreApi/sdk/FolderService";
+import PdfService, { CertificateData, Metadata } from "@Front/Services/PdfService";
+import MessageBus from "src/sdk/MessageBus";

 type IProps = {
 	customerUid: string;
@ -61,8 +64,16 @@ export default function DocumentTables(props: IProps) {
 					// FilterBy folder.uid & depositor.uid
 					documents = documents.filter((document: any) => document.folder.uid === folderUid && document.depositor && document.depositor.uid === customerUid);

+					console.log('[DocumentTables] fetchDocuments: all documents for this folder/customer:', documents.map(doc => ({
+						uid: doc.uid,
+						status: doc.document_status,
+						type: doc.document_type?.name
+					})));
+
 					for (const document of documents) {
-						document.document_type = (await DocumentTypeService.getDocumentTypeByUid(document.document_type.uid)).processData;
+						if (document.document_type) {
+							document.document_type = (await DocumentTypeService.getDocumentTypeByUid(document.document_type.uid)).processData;
+						}

 						if (document.files && document.files.length > 0) {
 							const files: any[] = [];
@ -174,6 +185,71 @@ export default function DocumentTables(props: IProps) {
 		}).catch((e) => console.warn(e));
 	}, []);

+	const onDownloadCertificate = useCallback(async (doc: any) => {
+		try {
+			console.log('[DocumentTables] onDownloadCertificate: doc', doc);
+			const certificateData: CertificateData = {
+				customer: {
+					firstName: doc.depositor.first_name || doc.depositor.firstName || "N/A",
+					lastName: doc.depositor.last_name || doc.depositor.lastName || "N/A",
+					postalAddress: doc.depositor.postal_address || doc.depositor.address || doc.depositor.postalAddress || "N/A",
+					email: doc.depositor.email || "N/A"
+				},
+				notary: {
+					name: "N/A"
+				},
+				folderUid: folderUid,
+				documentHash: "N/A",
+				metadata: {
+					fileName: "N/A",
+					isDeleted: false,
+					updatedAt: new Date(),
+					commitmentId: "N/A",
+					createdAt: new Date(),
+					documentUid: "N/A",
+					documentType: "N/A",
+					merkleProof: "N/A"
+				}
+			};
+
+			// Get the specific document that was clicked
+			const documentProcess = await DocumentService.getDocumentByUid(doc.uid);
+			if (!documentProcess) {
+				throw new Error('Document not found');
+			}
+
+			// Process only the files for this specific document
+			for (const file of documentProcess.processData.files) {
+				const fileProcess = await FileService.getFileByUid(file.uid);
+				console.log('[DocumentTables] onDownloadCertificate: fileProcess', fileProcess);
+				
+				const hash = fileProcess.lastUpdatedFileState.pcd_commitment.file_blob;
+				certificateData.documentHash = hash;
+
+				const proof = await MessageBus.getInstance().generateMerkleProof(fileProcess.lastUpdatedFileState, 'file_blob');
+				console.log('[DocumentTables] onDownloadCertificate: proof', proof);
+				
+				const metadata: Metadata = {
+					fileName: fileProcess.processData.file_name,
+					isDeleted: false,
+					updatedAt: new Date(fileProcess.processData.updated_at),
+					commitmentId: fileProcess.lastUpdatedFileState.commited_in,
+					createdAt: new Date(fileProcess.processData.created_at),
+					documentUid: doc.uid,
+					documentType: doc.document_type.name,
+					merkleProof: proof
+				};
+				certificateData.metadata = metadata;
+			}
+				
+			console.log('[DocumentTables] onDownloadCertificate: certificateData', certificateData);
+
+			await PdfService.getInstance().downloadCertificate(certificateData);
+		} catch (error) {
+			console.error('Error downloading certificate:', error);
+		}
+	}, [folderUid, customerUid]);
+
 	const askedDocuments: IRowProps[] = useMemo(
 		() =>
 			documents
@ -261,8 +337,8 @@ export default function DocumentTables(props: IProps) {
 	);

 	const validatedDocuments: IRowProps[] = useMemo(
-		() =>
-			documents
+		() => {
+			const validated = documents
 				.map((document) => {
 					if (document.document_status !== EDocumentStatus.VALIDATED) return null;
 					return {
@ -298,13 +374,17 @@ export default function DocumentTables(props: IProps) {
 										<IconButton icon={<EyeIcon />} />
 									</Link>
 									<IconButton onClick={() => onDownload(document)} icon={<ArrowDownTrayIcon />} />
+									<IconButton onClick={() => onDownloadCertificate(document)} icon={<DocumentTextIcon />} />
 								</div>
 							),
 						},
 					};
 				})
-				.filter((document) => document !== null) as IRowProps[],
-		[documents, folderUid, onDownload],
+				.filter((document) => document !== null) as IRowProps[];
+			
+			return validated;
+		},
+		[documents, folderUid, onDownload, onDownloadCertificate],
 	);

 	const refusedDocuments: IRowProps[] = useMemo(
@ -326,9 +406,13 @@ export default function DocumentTables(props: IProps) {
 							),
 						},
 						date: {
-							sx: { width: 107 },
+							sx: { width: 120 },
 							content: document.updated_at ? new Date(document.updated_at).toLocaleDateString() : "_",
 						},
+						file: {
+							sx: { width: 120 },
+							content: document.files?.[0]?.file_name ?? "_",
+						},
 						actions: { sx: { width: 76 }, content: "" },
 					};
 				})
--- a/src/front/Components/Layouts/Folder/FolderInformation/InformationSection/index.tsx
+++ b/src/front/Components/Layouts/Folder/FolderInformation/InformationSection/index.tsx
@ -5,11 +5,12 @@ import { IItem } from "@Front/Components/DesignSystem/Menu/MenuItem";
 import Tag, { ETagColor } from "@Front/Components/DesignSystem/Tag";
 import Typography, { ETypo, ETypoColor } from "@Front/Components/DesignSystem/Typography";
 import Module from "@Front/Config/Module";
-import { ArchiveBoxIcon, EllipsisHorizontalIcon, PaperAirplaneIcon, PencilSquareIcon, UsersIcon } from "@heroicons/react/24/outline";
+import { ArchiveBoxIcon, EllipsisHorizontalIcon, PaperAirplaneIcon, PencilSquareIcon, ShieldCheckIcon, UsersIcon } from "@heroicons/react/24/outline";
 import classNames from "classnames";
 import { OfficeFolder } from "le-coffre-resources/dist/Notary";
 import Link from "next/link";
 import { useMemo } from "react";
+import { useRouter } from "next/router";

 import { AnchorStatus } from "..";
 import classes from "./classes.module.scss";
@ -24,6 +25,7 @@ type IProps = {

 export default function InformationSection(props: IProps) {
 	const { folder, progress, onArchive, anchorStatus, isArchived } = props;
+	const router = useRouter();

 	const menuItemsDekstop = useMemo(() => {
 		let elements: IItem[] = [];
@ -43,6 +45,17 @@ export default function InformationSection(props: IProps) {
 			link: Module.getInstance()
 				.get()
 				.modules.pages.Folder.pages.EditInformations.props.path.replace("[folderUid]", folder?.uid ?? ""),
+			hasSeparator: true,
+		};
+		const verifyDocumentElement = {
+			icon: <ShieldCheckIcon />,
+			text: "Vérifier le document",
+			onClick: () => {
+				const verifyPath = Module.getInstance()
+					.get()
+					.modules.pages.Folder.pages.VerifyDocuments.props.path.replace("[folderUid]", folder?.uid ?? "");
+				router.push(verifyPath);
+			},
 			hasSeparator: false,
 		};

@ -52,8 +65,11 @@ export default function InformationSection(props: IProps) {
 			elements.push(modifyInformationsElement);
 		}

+		// Add verify document option
+		elements.push(verifyDocumentElement);
+
 		return elements;
-	}, [anchorStatus, folder?.uid]);
+	}, [anchorStatus, folder?.uid, router]);

 	const menuItemsMobile = useMemo(() => {
 		let elements: IItem[] = [];
@ -75,6 +91,17 @@ export default function InformationSection(props: IProps) {
 				.modules.pages.Folder.pages.EditInformations.props.path.replace("[folderUid]", folder?.uid ?? ""),
 			hasSeparator: true,
 		};
+		const verifyDocumentElement = {
+			icon: <ShieldCheckIcon />,
+			text: "Vérifier le document",
+			onClick: () => {
+				const verifyPath = Module.getInstance()
+					.get()
+					.modules.pages.Folder.pages.VerifyDocuments.props.path.replace("[folderUid]", folder?.uid ?? "");
+				router.push(verifyPath);
+			},
+			hasSeparator: true,
+		};

 		// If the folder is not anchored, we can modify the collaborators and the informations
 		if (anchorStatus === AnchorStatus.NOT_ANCHORED) {
@ -82,6 +109,9 @@ export default function InformationSection(props: IProps) {
 			elements.push(modifyInformationsElement);
 		}

+		// Add verify document option
+		elements.push(verifyDocumentElement);
+
 		elements.push({
 			icon: <PaperAirplaneIcon />,
 			text: "Envoyer des documents",
@ -101,7 +131,7 @@ export default function InformationSection(props: IProps) {
 		}

 		return elements;
-	}, [anchorStatus, folder?.uid, isArchived, onArchive]);
+	}, [anchorStatus, folder?.uid, isArchived, onArchive, router]);
 	return (
 		<section className={classes["root"]}>
 			<div className={classes["info-box1"]}>
--- a/src/front/Components/Layouts/Folder/ViewDocuments/index.tsx
+++ b/src/front/Components/Layouts/Folder/ViewDocuments/index.tsx
@ -6,7 +6,7 @@ import Confirm from "@Front/Components/DesignSystem/OldModal/Confirm";
 import Typography, { ETypo, ETypoColor } from "@Front/Components/DesignSystem/Typography";
 import DefaultNotaryDashboard from "@Front/Components/LayoutTemplates/DefaultNotaryDashboard";
 import Module from "@Front/Config/Module";
-import { Document, File } from "le-coffre-resources/dist/Notary";
+import { Document } from "le-coffre-resources/dist/Notary";
 import { EDocumentStatus } from "le-coffre-resources/dist/Notary/Document";
 import Image from "next/image";
 import { NextRouter, useRouter } from "next/router";
@ -19,6 +19,7 @@ import MessageBox from "@Front/Components/Elements/MessageBox";

 import DocumentService from "src/common/Api/LeCoffreApi/sdk/DocumentService";
 import FileService from "src/common/Api/LeCoffreApi/sdk/FileService";
+import { FileBlob } from "@Front/Api/Entities/types";

 type IProps = {};
 type IPropsClass = {
@ -32,7 +33,7 @@ type IState = {
 	isValidateModalVisible: boolean;
 	refuseText: string;
 	selectedFileIndex: number;
-	selectedFile: any; // File | null; TODO: review
+	selectedFile: { uid: string; file_name: string; file_blob: FileBlob } | null;
 	validatedPercentage: number;
 	document: Document | null;
 	fileBlob: Blob | null;
@ -237,6 +238,8 @@ class ViewDocumentsClass extends BasePage<IPropsClass, IState> {

 	private async getFilePreview(): Promise<void> {
 		try {
+			if (!this.state.selectedFile) return;
+			
 			const fileBlob: Blob = new Blob([this.state.selectedFile.file_blob.data], { type: this.state.selectedFile.file_blob.type });
 			this.setState({
 				fileBlob,
@ -247,7 +250,7 @@ class ViewDocumentsClass extends BasePage<IPropsClass, IState> {
 	}

 	private downloadFile() {
-		if (!this.state.fileBlob) return;
+		if (!this.state.fileBlob || !this.state.selectedFile) return;

 		const url = URL.createObjectURL(this.state.fileBlob);
 		const a = document.createElement('a');
--- a/src/front/Config/Module/development.json
+++ b/src/front/Config/Module/development.json
@ -160,6 +160,13 @@
 							"path": "/folders/select",
 							"labelKey": "select_folder"
 						}
+					},
+					"VerifyDocuments": {
+						"enabled": true,
+						"props": {
+							"path": "/folders/[folderUid]/verify-documents",
+							"labelKey": "verify_documents"
+						}
 					}
 				}
 			},
--- a/src/front/Config/Module/preprod.json
+++ b/src/front/Config/Module/preprod.json
@ -160,6 +160,13 @@
 							"path": "/folders/select",
 							"labelKey": "select_folder"
 						}
+					},
+					"VerifyDocuments": {
+						"enabled": true,
+						"props": {
+							"path": "/folders/[folderUid]/verify-documents",
+							"labelKey": "verify_documents"
+						}
 					}
 				}
 			},
--- a/src/front/Config/Module/production.json
+++ b/src/front/Config/Module/production.json
@ -160,6 +160,13 @@
 							"path": "/folders/select",
 							"labelKey": "select_folder"
 						}
+					},
+					"VerifyDocuments": {
+						"enabled": true,
+						"props": {
+							"path": "/folders/[folderUid]/verify-documents",
+							"labelKey": "verify_documents"
+						}
 					}
 				}
 			},
--- a/src/front/Config/Module/staging.json
+++ b/src/front/Config/Module/staging.json
@ -160,6 +160,13 @@
 							"path": "/folders/select",
 							"labelKey": "select_folder"
 						}
+					},
+					"VerifyDocuments": {
+						"enabled": true,
+						"props": {
+							"path": "/folders/[folderUid]/verify-documents",
+							"labelKey": "verify_documents"
+						}
 					}
 				}
 			},
--- a/src/front/Services/PdfService/index.ts
+++ b/src/front/Services/PdfService/index.ts
@ -0,0 +1,347 @@
+import { saveAs } from 'file-saver';
+import { PDFDocument, rgb, StandardFonts } from 'pdf-lib';
+
+const separator = '\x1f';
+
+export interface CustomerInfo {
+	firstName: string;
+	lastName: string;
+	postalAddress: string;
+	email: string;
+}
+
+export interface NotaryInfo {
+	name: string;
+	// Add more notary fields as needed
+}
+
+export interface Metadata {
+	fileName: string,
+	createdAt: Date,
+	isDeleted: boolean,
+	updatedAt: Date,	
+	commitmentId: string,
+	documentUid: string;
+	documentType: string;
+	merkleProof: string;
+}
+
+export interface CertificateData {
+	customer: CustomerInfo;
+	notary: NotaryInfo;
+	folderUid: string;
+	documentHash: string;
+	metadata: Metadata;
+}
+
+export default class PdfService {
+	private static instance: PdfService;
+
+	public static getInstance(): PdfService {
+		if (!PdfService.instance) {
+			PdfService.instance = new PdfService();
+		}
+		return PdfService.instance;
+	}
+
+	/**
+	 * Generate a certificate PDF for a document
+	 * @param certificateData - Data needed for the certificate
+	 * @returns Promise<Blob> - The generated PDF as a blob
+	 */
+	public async generateCertificate(certificateData: CertificateData): Promise<Blob> {
+		try {
+			const pdfDoc = await PDFDocument.create();
+			const page = pdfDoc.addPage([595, 842]); // A4 size
+			const { width, height } = page.getSize();
+
+			const helveticaFont = await pdfDoc.embedFont(StandardFonts.Helvetica);
+			const helveticaBoldFont = await pdfDoc.embedFont(StandardFonts.HelveticaBold);
+			const helveticaObliqueFont = await pdfDoc.embedFont(StandardFonts.HelveticaOblique);
+
+			let y = height - 40; // Start 40pt from the top
+			const leftMargin = 20;
+			const rightSectionX = 320;
+			const lineSpacing = 16;
+
+			// Notary Information Section (Top Left)
+			page.drawText('Notaire Validateur:', {
+				x: leftMargin,
+				y: y,
+				size: 12,
+				font: helveticaBoldFont,
+				color: rgb(0, 0, 0)
+			});
+			y -= lineSpacing;
+			page.drawText(certificateData.notary.name, {
+				x: leftMargin,
+				y: y,
+				size: 12,
+				font: helveticaFont,
+				color: rgb(0, 0, 0)
+			});
+
+			// Customer Information Section (Top Right)
+			let yRight = height - 40;
+			page.drawText('Fournisseur de Document:', {
+				x: rightSectionX,
+				y: yRight,
+				size: 12,
+				font: helveticaBoldFont,
+				color: rgb(0, 0, 0)
+			});
+			yRight -= lineSpacing;
+			page.drawText(`${certificateData.customer.firstName} ${certificateData.customer.lastName}`, {
+				x: rightSectionX,
+				y: yRight,
+				size: 12,
+				font: helveticaFont,
+				color: rgb(0, 0, 0)
+			});
+			yRight -= lineSpacing;
+			page.drawText(certificateData.customer.email, {
+				x: rightSectionX,
+				y: yRight,
+				size: 12,
+				font: helveticaFont,
+				color: rgb(0, 0, 0)
+			});
+			yRight -= lineSpacing;
+			page.drawText(certificateData.customer.postalAddress, {
+				x: rightSectionX,
+				y: yRight,
+				size: 12,
+				font: helveticaFont,
+				color: rgb(0, 0, 0)
+			});
+
+			// Centered Title
+			y -= 4 * lineSpacing; // Add more space between header and title
+			const titleText = 'Certificat de Validation de Document';
+			const titleWidth = helveticaBoldFont.widthOfTextAtSize(titleText, 20);
+			page.drawText(titleText, {
+				x: (width - titleWidth) / 2,
+				y: y,
+				size: 20,
+				font: helveticaBoldFont,
+				color: rgb(0, 0, 0)
+			});
+			y -= lineSpacing;
+
+			// Add a line separator
+			page.drawLine({
+				start: { x: leftMargin, y: y },
+				end: { x: width - leftMargin, y: y },
+				thickness: 0.5,
+				color: rgb(0, 0, 0)
+			});
+			y -= lineSpacing;
+
+			// Document Information Section
+			page.drawText('Informations du Document', {
+				x: leftMargin,
+				y: y,
+				size: 12,
+				font: helveticaBoldFont,
+				color: rgb(0, 0, 0)
+			});
+			y -= lineSpacing;
+			page.drawText(`UID du Dossier: ${certificateData.folderUid}`, {
+				x: leftMargin,
+				y: y,
+				size: 12,
+				font: helveticaFont,
+				color: rgb(0, 0, 0)
+			});
+			y -= lineSpacing;
+			page.drawText(`Type de Document: ${certificateData.metadata.documentType}`, {
+				x: leftMargin,
+				y: y,
+				size: 12,
+				font: helveticaFont,
+				color: rgb(0, 0, 0)
+			});
+			y -= lineSpacing;
+			page.drawText(`Nom du fichier: ${certificateData.metadata.fileName}`, {
+				x: leftMargin,
+				y: y,
+				size: 12,
+				font: helveticaFont,
+				color: rgb(0, 0, 0)
+			});
+			y -= lineSpacing;
+			page.drawText(`Créé le: ${certificateData.metadata.createdAt.toLocaleDateString('fr-FR')}`, {
+				x: leftMargin,
+				y: y,
+				size: 12,
+				font: helveticaFont,
+				color: rgb(0, 0, 0)
+			});
+			y -= lineSpacing;
+			page.drawText(`Dernière modification: ${certificateData.metadata.updatedAt.toLocaleDateString('fr-FR')}`, {
+				x: leftMargin,
+				y: y,
+				size: 12,
+				font: helveticaFont,
+				color: rgb(0, 0, 0)
+			});
+			y -= lineSpacing;
+
+			const keywords = [
+				certificateData.documentHash,
+				certificateData.metadata.commitmentId,
+				JSON.stringify(certificateData.metadata.merkleProof)
+			];
+			pdfDoc.setKeywords([keywords.join(separator)]);
+
+			// Add explanatory text about certificate usage
+			const explanatoryText = "Ce certificat doit être utilisé avec le document qu'il certifie pour être vérifié sur la page dédiée. Le document correspondant à ce certificat doit être téléchargé depuis LeCoffre et peut être conservé avec le certificat tant qu'il n'est pas modifié.";
+			const explanatoryLines = this.splitTextToFit(helveticaObliqueFont, explanatoryText, width - (2 * leftMargin), 11);
+			y -= (explanatoryLines.length * 12) + 40; // Space after verification data
+			explanatoryLines.forEach((line, index) => {
+				page.drawText(line, {
+					x: leftMargin,
+					y: y - (index * 14), // Slightly more spacing for readability
+					size: 11,
+					font: helveticaObliqueFont,
+					color: rgb(0.3, 0.3, 0.3) // Slightly grayed out to distinguish from main content
+				});
+			});
+
+			// Footer
+			const footerText1 = `Page 1 sur 1`;
+			const footerText2 = `Généré le ${new Date().toLocaleString('fr-FR')}`;
+			const footerWidth1 = helveticaObliqueFont.widthOfTextAtSize(footerText1, 10);
+			const footerWidth2 = helveticaObliqueFont.widthOfTextAtSize(footerText2, 10);
+			page.drawText(footerText1, {
+				x: (width - footerWidth1) / 2,
+				y: 35,
+				size: 10,
+				font: helveticaObliqueFont,
+				color: rgb(0, 0, 0)
+			});
+			page.drawText(footerText2, {
+				x: (width - footerWidth2) / 2,
+				y: 25,
+				size: 10,
+				font: helveticaObliqueFont,
+				color: rgb(0, 0, 0)
+			});
+
+			const pdfBytes = await pdfDoc.save();
+			return new Blob([pdfBytes], { type: 'application/pdf' });
+		} catch (error) {
+			console.error('Error generating certificate:', error);
+			throw new Error('Failed to generate certificate');
+		}
+	}
+
+	/**
+	 * Split text to fit within a specified width
+	 * @param font - PDF font instance
+	 * @param text - Text to split
+	 * @param maxWidth - Maximum width in points
+	 * @param fontSize - Font size
+	 * @returns Array of text lines
+	 */
+	private splitTextToFit(font: any, text: string, maxWidth: number, fontSize: number): string[] {
+		const lines: string[] = [];
+		let currentLine = '';
+		
+		// Split by characters (pdf-lib doesn't have word-level text measurement)
+		const chars = text.split('');
+		
+		for (const char of chars) {
+			const testLine = currentLine + char;
+			const testWidth = font.widthOfTextAtSize(testLine, fontSize);
+			
+			if (testWidth <= maxWidth) {
+				currentLine = testLine;
+			} else {
+				if (currentLine) {
+					lines.push(currentLine);
+					currentLine = char;
+				} else {
+					// If even a single character is too wide, force a break
+					lines.push(char);
+				}
+			}
+		}
+		
+		if (currentLine) {
+			lines.push(currentLine);
+		}
+		
+		return lines;
+	}
+
+	/**
+	 * Download a certificate PDF
+	 * @param certificateData - Data needed for the certificate
+	 * @param filename - Optional filename for the download
+	 */
+	public async downloadCertificate(certificateData: CertificateData, filename?: string): Promise<void> {
+		try {
+			const pdfBlob = await this.generateCertificate(certificateData);
+			const defaultFilename = `certificate_${certificateData.metadata.documentUid}_${new Date().toISOString().split('T')[0]}.pdf`;
+			saveAs(pdfBlob, filename || defaultFilename);
+		} catch (error) {
+			console.error('Error downloading certificate:', error);
+			throw error;
+		}
+	}
+
+	/**
+	 * Parse a PDF certificate and extract document information
+	 * @param pdfBlob - The PDF file as a blob
+	 * @returns Promise<{documentHash: string, documentUid: string, commitmentId: string, merkleProof?: string}> - Extracted information
+	 */
+	public async parseCertificate(certificateFile: File): Promise<{documentHash: string, commitmentId: string, merkleProof: any}> {
+		return new Promise((resolve, reject) => {
+			const fileReader = new FileReader();
+
+			console.log("certificateFile", certificateFile);
+			
+			fileReader.onload = async () => {
+				try {
+					// Read the metadata and get the validation data from the keywords
+					const pdfDoc = await PDFDocument.load(await certificateFile.arrayBuffer());
+					const keywords = pdfDoc.getKeywords()?.split(separator);
+
+					if (!keywords) {
+						throw new Error("No keywords found in certificate");
+					}
+
+					console.log(keywords);
+
+					if (keywords.length !== 3) {
+						throw new Error("Invalid keywords found in certificate");
+					}
+
+					const documentHash = keywords[0];
+					const commitmentId = keywords[1];
+					const merkleProof = keywords[2];
+
+					if (!documentHash || !commitmentId || !merkleProof) {
+						throw new Error("Invalid keywords found in certificate");
+					}
+
+					console.log("documentHash", documentHash);
+					console.log("commitmentId", commitmentId);
+					console.log("merkleProof", merkleProof);
+
+				
+					resolve({ documentHash, commitmentId, merkleProof });
+				} catch (error) {
+					reject(error);
+				}
+			};
+			
+			fileReader.onerror = () => {
+				reject(new Error('Failed to read PDF file'));
+			};	
+
+			fileReader.readAsArrayBuffer(certificateFile);
+		});
+	}
+}
--- a/src/front/Services/WatermarkService/index.ts
+++ b/src/front/Services/WatermarkService/index.ts
@ -0,0 +1,211 @@
+export default class WatermarkService {
+	private static instance: WatermarkService;
+
+	public static getInstance(): WatermarkService {
+		if (!WatermarkService.instance) {
+			WatermarkService.instance = new WatermarkService();
+		}
+		return WatermarkService.instance;
+	}
+
+	/**
+	 * Add a watermark to a file based on its type
+	 * @param file - The original file
+	 * @returns Promise<File> - The file with watermark added
+	 */
+	public async addWatermark(file: File): Promise<File> {
+		const fileType = file.type;
+		
+		try {
+			if (fileType.startsWith('image/')) {
+				return await this.addWatermarkToImage(file);
+			} else if (fileType === 'application/pdf') {
+				return await this.addWatermarkToPdf(file);
+			} else {
+				// For other file types, return the original file
+				console.log(`Watermark not supported for file type: ${fileType}`);
+				return file;
+			}
+		} catch (error) {
+			console.error('Error adding watermark:', error);
+			// Return original file if watermarking fails
+			return file;
+		}
+	}
+
+	/**
+	 * Add watermark to image files
+	 * @param file - Image file
+	 * @returns Promise<File> - Image with watermark
+	 */
+	private async addWatermarkToImage(file: File): Promise<File> {
+		return new Promise((resolve, reject) => {
+			const reader = new FileReader();
+			reader.onload = (event) => {
+				try {
+					const img = new Image();
+					img.onload = () => {
+						try {
+							// Create canvas
+							const canvas = document.createElement('canvas');
+							const ctx = canvas.getContext('2d');
+							
+							if (!ctx) {
+								reject(new Error('Could not get canvas context'));
+								return;
+							}
+							
+							// Set canvas size to image size
+							canvas.width = img.width;
+							canvas.height = img.height;
+							
+							// Draw original image
+							ctx.drawImage(img, 0, 0);
+							
+							// Add watermark
+							this.addImageWatermark(ctx, img.width, img.height);
+							
+							// Convert to blob
+							canvas.toBlob((blob) => {
+								if (blob) {
+									const watermarkedFile = new File([blob], file.name, { type: file.type });
+									resolve(watermarkedFile);
+								} else {
+									reject(new Error('Could not create blob from canvas'));
+								}
+							}, file.type);
+						} catch (error) {
+							reject(error);
+						}
+					};
+					img.onerror = reject;
+					img.src = event.target?.result as string;
+				} catch (error) {
+					reject(error);
+				}
+			};
+			reader.onerror = reject;
+			reader.readAsDataURL(file);
+		});
+	}
+
+	/**
+	 * Add watermark to PDF files
+	 * @param file - PDF file
+	 * @returns Promise<File> - PDF with watermark
+	 */
+	private async addWatermarkToPdf(file: File): Promise<File> {
+		return new Promise((resolve, reject) => {
+			const reader = new FileReader();
+			reader.onload = async (event) => {
+				try {
+					const arrayBuffer = event.target?.result as ArrayBuffer;
+					
+					// Import pdf-lib dynamically to avoid SSR issues
+					const { PDFDocument, rgb } = await import('pdf-lib');
+					
+					// Load the existing PDF
+					const pdfDoc = await PDFDocument.load(arrayBuffer);
+					
+					// Get all pages
+					const pages = pdfDoc.getPages();
+					
+					// Add watermark to each page
+					for (const page of pages) {
+						this.addPdfWatermark(page, rgb(0.8, 0.2, 0.2)); // Pale red color
+					}
+					
+					// Save the modified PDF
+					const pdfBytes = await pdfDoc.save();
+					const watermarkedFile = new File([pdfBytes], file.name, { type: file.type });
+					resolve(watermarkedFile);
+					
+				} catch (error) {
+					console.error('Error adding watermark to PDF:', error);
+					// If PDF watermarking fails, return original file
+					resolve(file);
+				}
+			};
+			reader.onerror = reject;
+			reader.readAsArrayBuffer(file);
+		});
+	}
+
+	/**
+	 * Add watermark to image using Canvas
+	 * @param ctx - Canvas 2D context
+	 * @param width - Image width
+	 * @param height - Image height
+	 */
+	private addImageWatermark(ctx: CanvasRenderingContext2D, width: number, height: number): void {
+		// Save current state
+		ctx.save();
+		
+		// Set watermark properties
+		ctx.fillStyle = 'rgba(128, 128, 128, 0.7)'; // Semi-transparent gray
+		ctx.font = '12px Arial';
+		ctx.textAlign = 'right';
+		ctx.textBaseline = 'bottom';
+		
+		// Position watermark in bottom-right corner
+		const text = 'Processed by LeCoffre';
+		const x = width - 10; // 10 pixels from right edge
+		const y = height - 10; // 10 pixels from bottom
+		
+		// Add watermark text
+		ctx.fillText(text, x, y);
+		
+		// Restore state
+		ctx.restore();
+	}
+
+	/**
+	 * Add watermark to PDF using pdf-lib
+	 * @param page - PDF page from pdf-lib
+	 * @param color - Color for the watermark
+	 */
+	private addPdfWatermark(page: any, color: any): void {
+		const { width, height } = page.getSize();
+		
+		// Calculate watermark position (bottom-right corner)
+		const text = 'Processed by LeCoffre';
+		const dateTime = new Date().toLocaleString('fr-FR', {
+			year: 'numeric',
+			month: '2-digit',
+			day: '2-digit',
+			hour: '2-digit',
+			minute: '2-digit'
+		});
+		
+		const fontSize = 10;
+		const lineHeight = 12; // Space between lines
+		
+		// Calculate text widths (approximate - pdf-lib doesn't have a direct method for this)
+		// Using a conservative estimate: ~6 points per character for 10pt font
+		const estimatedTextWidth1 = text.length * 6;
+		const estimatedTextWidth2 = dateTime.length * 6;
+		const maxTextWidth = Math.max(estimatedTextWidth1, estimatedTextWidth2);
+		
+		// Position watermark with proper margins (20 points from edges)
+		const x = width - maxTextWidth - 20; // 20 points from right edge
+		const y = 20; // 20 points from bottom
+		
+		// Add watermark text with transparency (first line)
+		page.drawText(text, {
+			x: x,
+			y: y + lineHeight, // Second line (top)
+			size: fontSize,
+			color: color,
+			opacity: 0.7
+		});
+		
+		// Add date/time with transparency (second line)
+		page.drawText(dateTime, {
+			x: x,
+			y: y, // First line (bottom)
+			size: fontSize,
+			color: color,
+			opacity: 0.7
+		});
+	}
+} 
--- a/src/pages/folders/[folderUid]/verify-documents.tsx
+++ b/src/pages/folders/[folderUid]/verify-documents.tsx
@ -0,0 +1,20 @@
+import { useRouter } from "next/router";
+import React from "react";
+
+import DefaultNotaryDashboard from "@Front/Components/LayoutTemplates/DefaultNotaryDashboard";
+import DocumentVerification from "@Front/Components/Layouts/Folder/DocumentVerification";
+
+export default function VerifyDocuments() {
+	const router = useRouter();
+	const { folderUid } = router.query;
+
+	if (!folderUid || Array.isArray(folderUid)) {
+		return null;
+	}
+
+	return (
+		<DefaultNotaryDashboard>
+			<DocumentVerification folderUid={folderUid} />
+		</DefaultNotaryDashboard>
+	);
+} 
--- a/src/sdk/MessageBus.ts
+++ b/src/sdk/MessageBus.ts
@ -6,6 +6,7 @@ import EventBus from './EventBus';
 import User from './User';

 import MapUtils from './MapUtils';
+import { FileBlob } from '../front/Api/Entities/types';

 export default class MessageBus {
  private static instance: MessageBus;
@ -113,61 +114,68 @@ export default class MessageBus {

          const publicDataDecoded: { [key: string]: any } = {};

-          for (let stateId = 0; stateId < process.states.length - 1; stateId++) {
-            const state = process.states[stateId];
-            if (!state) {
-              continue;
-            }
+          // We only care about the public data as they are in the last commited state
+          const processTip = process.states[process.states.length - 1].commited_in;
+          const lastCommitedState = process.states.findLast((state: any) => state.commited_in !== processTip);

-            const publicDataEncoded = state.public_data;
-            if (!publicDataEncoded) {
-              continue;
-            }
+          if (!lastCommitedState) {
+            continue;
+          }

-            for (const key of Object.keys(publicDataEncoded)) {
-              publicDataDecoded[key] = await this.getPublicData(publicDataEncoded[key]);
-            }
+          const publicDataEncoded = lastCommitedState.public_data;
+          if (!publicDataEncoded) {
+            continue;
+          }
+
+          for (const key of Object.keys(publicDataEncoded)) {
+            publicDataDecoded[key] = await this.getPublicData(publicDataEncoded[key]);
          }

          if (!(publicDataDecoded['uid'] && publicDataDecoded['uid'] === uid && publicDataDecoded['utype'] && publicDataDecoded['utype'] === 'file')) {
            continue;
          }

+          // We take the file in it's latest commited state
          let file: any;

-          for (let stateId = 0; stateId < process.states.length - 1; stateId++) {
-            const lastState = process.states[stateId];
-            if (!lastState) {
+          // Which is the last state that updated file_blob?
+          const lastUpdatedFileState = process.states.findLast((state: any) => state.pcd_commitment['file_blob']);
+
+          if (!lastUpdatedFileState) {
+            continue;
+          }
+
+          try {
+            const processData = await this.getData(processId, lastUpdatedFileState.state_id);
+            const isEmpty = Object.keys(processData).length === 0;
+            if (isEmpty) {
              continue;
            }

-            const lastStateId = lastState.state_id;
-            if (!lastStateId) {
+            const publicDataEncoded = lastUpdatedFileState.public_data;
+            if (!publicDataEncoded) {
              continue;
            }

-            try {
-              const processData = await this.getData(processId, lastStateId);
-              const isEmpty = Object.keys(processData).length === 0;
-              if (isEmpty) {
-                continue;
-              }

-              if (!file) {
-                file = {
-                  processId,
-                  lastStateId,
-                  processData,
-                };
-              } else {
-                for (const key of Object.keys(processData)) {
-                  file.processData[key] = processData[key];
-                }
-                file.lastStateId = lastStateId;
+            if (!file) {
+              file = {
+                processId,
+                lastUpdatedFileState,
+                processData,
+                publicDataDecoded,
+              };
+            } else {
+              for (const key of Object.keys(processData)) {
+                file.processData[key] = processData[key];
+              }
+              file.lastUpdatedFileState = lastUpdatedFileState;
+              for (const key of Object.keys(publicDataDecoded)) {
+                file.publicDataDecoded[key] = publicDataDecoded[key];
              }
-            } catch (error) {
-              console.error(error);
            }
+          } catch (error) {
+            console.error(error);
          }

          files.push(file);
@ -557,6 +565,119 @@ export default class MessageBus {
    });
  }

+  /**
+   * Hash a document file using SHA-256
+   * @param fileBlob - The file blob to hash
+   * @returns Promise<string> - The SHA-256 hash of the file
+   */
+  public hashDocument(fileBlob: FileBlob, commitedIn: string): Promise<string> {
+    return new Promise<string>((resolve: (hash: string) => void, reject: (error: string) => void) => {
+      this.checkToken().then(() => {
+        const messageId = `HASH_VALUE_${uuidv4()}`;
+
+        const unsubscribe = EventBus.getInstance().on('VALUE_HASHED', (responseId: string, hash: string) => {
+          if (responseId !== messageId) {
+            return;
+          }
+          unsubscribe();
+          resolve(hash);
+        });
+
+        const unsubscribeError = EventBus.getInstance().on('ERROR_VALUE_HASHED', (responseId: string, error: string) => {
+          if (responseId !== messageId) {
+            return;
+          }
+          unsubscribeError();
+          reject(error);
+        });
+
+        const user = User.getInstance();
+        const accessToken = user.getAccessToken()!;
+
+        const label = 'file_blob';
+
+        this.sendMessage({
+          type: 'HASH_VALUE',
+          accessToken,
+          commitedIn,
+          label,
+          fileBlob,
+          messageId
+        });
+      }).catch(reject);
+    });
+  }
+
+  public generateMerkleProof(processState: any, attributeName: string): Promise<any> {
+    return new Promise<any>((resolve: (proof: any) => void, reject: (error: string) => void) => {
+      this.checkToken().then(() => {
+        const messageId = `GET_MERKLE_PROOF_${uuidv4()}`;
+
+        const unsubscribe = EventBus.getInstance().on('MERKLE_PROOF_RETRIEVED', (responseId: string, proof: any) => {
+          if (responseId !== messageId) {
+            return;
+          }
+          unsubscribe();
+          resolve(proof);
+        });
+
+        const unsubscribeError = EventBus.getInstance().on('ERROR_MERKLE_PROOF_RETRIEVED', (responseId: string, error: string) => {
+          if (responseId !== messageId) {
+            return;
+          }
+          unsubscribeError();
+          reject(error);
+        });
+
+        const user = User.getInstance();
+        const accessToken = user.getAccessToken()!;
+
+        this.sendMessage({
+          type: 'GET_MERKLE_PROOF',
+          accessToken,
+          processState,
+          attributeName,
+          messageId
+        });
+      }).catch(reject);
+    });
+  }
+
+  public verifyMerkleProof(merkleProof: string, documentHash: string): Promise<boolean> {
+    return new Promise<boolean>((resolve: (isValid: boolean) => void, reject: (error: string) => void) => {
+      this.checkToken().then(() => {
+        const messageId = `VALIDATE_MERKLE_PROOF_${uuidv4()}`;
+
+        const unsubscribe = EventBus.getInstance().on('MERKLE_PROOF_VALIDATED', (responseId: string, isValid: boolean) => {
+          if (responseId !== messageId) {
+            return;
+          }
+          unsubscribe();
+          resolve(isValid);
+        });
+
+        const unsubscribeError = EventBus.getInstance().on('ERROR_MERKLE_PROOF_VALIDATED', (responseId: string, error: string) => {
+          if (responseId !== messageId) {
+            return;
+          }
+          unsubscribeError();
+          reject(error);
+        });
+
+        const user = User.getInstance();
+        const accessToken = user.getAccessToken()!;
+
+        this.sendMessage({
+          type: 'VALIDATE_MERKLE_PROOF',
+          accessToken,
+          merkleProof,
+          documentHash,
+          messageId
+        });
+      }).catch(reject);
+    });
+  }
+
  private validateToken(): Promise<boolean> {
    return new Promise<boolean>((resolve: (isValid: boolean) => void, reject: (error: string) => void) => {
      const messageId = `VALIDATE_TOKEN_${uuidv4()}`;
@ -647,7 +768,9 @@ export default class MessageBus {
      console.error('[MessageBus] sendMessage: iframe not found');
      return;
    }
-    console.log('[MessageBus] sendMessage:', message);
+    if (message.type === 'VALIDATE_MERKLE_PROOF') {
+      console.log('[MessageBus] sendMessage:', message);
+    }
    iframe.contentWindow?.postMessage(message, targetOrigin);
  }

@ -684,7 +807,7 @@ export default class MessageBus {
    }

    const message = event.data;
-    console.log('[MessageBus] handleMessage:', message);
+    // console.log('[MessageBus] handleMessage:', message);

    switch (message.type) {
      case 'LISTENING':
@ -746,6 +869,18 @@ export default class MessageBus {
        this.doHandleMessage(message.messageId, 'STATE_VALIDATED', message, (message: any) => message.validatedProcess);
        break;

+      case 'VALUE_HASHED': // HASH_VALUE
+        this.doHandleMessage(message.messageId, 'VALUE_HASHED', message, (message: any) => message.hash);
+        break;
+
+      case 'MERKLE_PROOF_RETRIEVED': // GET_MERKLE_PROOF
+        this.doHandleMessage(message.messageId, 'MERKLE_PROOF_RETRIEVED', message, (message: any) => message.proof);
+        break;
+
+      case 'MERKLE_PROOF_VALIDATED': // VALIDATE_MERKLE_PROOF
+        this.doHandleMessage(message.messageId, 'MERKLE_PROOF_VALIDATED', message, (message: any) => message.isValid);
+        break;
+
      case 'ERROR':
        console.error('Error:', message);
        this.errors[message.messageId] = message.error;
Author	SHA1	Message	Date
Sosthene	6f6d3e8de5	Fix pdf generation and parsing	2025-07-03 18:09:02 +02:00
Sosthene	c87ad8fed5	Add merkle proof validation message bus	2025-07-03 18:09:02 +02:00
Sosthene	56fe4fbcd3	Add document verification page	2025-07-03 18:09:02 +02:00
Sosthene	d94fd9e017	Refactor certificate generation	2025-07-03 18:09:02 +02:00
Sosthene	4f76d43f38	Add watermark when loading documents	2025-07-03 18:09:02 +02:00
Sosthene	7bfe3bcad2	Get merkle proof when generating certificate	2025-07-03 18:09:02 +02:00
Sosthene	c178b60d51	Add merkleProof to CertificateData	2025-07-03 18:09:02 +02:00
Sosthene	a450d80600	Add generateMerkleProof	2025-07-03 18:09:01 +02:00
Sosthene	095c4efba2	Add hashDocument to MessageBus	2025-07-03 18:09:01 +02:00
Sosthene	723322cc0a	Use FileBlob and FileData everywhere	2025-07-03 18:09:01 +02:00
Sosthene	d17f4aa8d9	Add FileBlob and FileData	2025-07-03 18:09:01 +02:00
Sosthene	7a137dbe2f	Add basic certificate	2025-07-03 18:09:01 +02:00
Anthony Janin	96ed1e50fa	Fix somes issues	2025-07-02 14:54:59 +02:00
Anthony Janin	e4c440d6df	Fix somes issues	2025-07-02 13:41:39 +02:00