Merge branch 'dev' of https://github.com/smart-chain-fr/leCoffre-front into dev

.ssh/id_rsa.pub

@@ -0,0 +1 @@
+ssh-rsa AAAAB3NzaC1yc2EAAAADAQABAAABgQDOfOFPvQNw5XguFuX1YNvED8ulP+tIA/5xw7LHcA0gRj3hwILCAEAjuDs+d13zCsnEb0yd+laT3PU9iRIKa28Tynu+sTjGDyfx8MX/HjJtbEzyd6jLn87uTvw/6lzg2y5ZDEa6PEqrPIv0KEhuq6HuU8qAA0nBpsTIAUTK3XR8qm3I6J9Rs1JyBjvIP5UeICApvoLmgHuz6mKdvoQ8qKDWamsL4pSc4Hr7HlQ8ITNhnyS8XMgQInU/I2TzT/I4Dxx5IeFUQ5KOfJJNgK1d+PByLSWUrn+eRXki8m1hjMiwGIehVAriFW1C309SEHxLHjQKUPXHSv4kH7zqjO+p3kY5gwp/lvsBRSnihj8s1lADsJlMqjnSLeIQ+sY2CNkmXXI8ABkzhuJKTGTl+8pzGGhIHzeU7e7lpSn3gLn4p217kIppHNAr6dZH9UaYbgnwVonwr5cLbatRPFyI1NfXKDyZtSYlGQxLQUt9KDrNvVTZzaTt3YwM/YCsRIADAagKosM= gisele-smartchain@MacBook-Pro-6.local

Dockerfile.front

@@ -0,0 +1,44 @@
+# Install dependencies only when needed
+FROM node:19-alpine AS deps
+
+WORKDIR leCoffre-front
+
+COPY package.json ./
+
+RUN apk update && apk add openssh-client git
+
+COPY id_rsa /root/.ssh/id_rsa
+RUN chmod 600 ~/.ssh/id_rsa
+RUN eval "$(ssh-agent -s)" && ssh-add /root/.ssh/id_rsa
+RUN ssh-keyscan github.com smart-chain-fr/leCoffre-resources.git >> /root/.ssh/known_hosts
+
+RUN npm install --frozen-lockfile
+
+# Rebuild the source code only when needed
+FROM node:19-alpine AS builder
+
+WORKDIR leCoffre-front
+
+COPY --from=deps leCoffre-front/node_modules ./node_modules
+COPY --from=deps leCoffre-front/package.json package.json
+COPY tsconfig.json tsconfig.json
+COPY src src
+
+RUN npm run build
+
+# Production image, copy all the files and run next
+FROM node:19-alpine AS production
+
+WORKDIR leCoffre-front
+
+RUN adduser -D lecoffreuser --uid 10000 && chown -R lecoffreuser .
+
+COPY public ./public
+COPY --from=builder --chown=lecoffreuser leCoffre-front/node_modules ./node_modules
+COPY --from=builder --chown=lecoffreuser leCoffre-front/.next ./.next
+COPY --from=builder --chown=lecoffreuser leCoffre-front/package.json ./package.json
+
+USER lecoffreuser
+
+CMD ["npm", "run", "start"]
+EXPOSE 3000

src/front/Api/LeCoffreApi/SuperAdmin/Files/Files.ts

@@ -1,7 +1,6 @@
 import { File } from "le-coffre-resources/dist/SuperAdmin";
 import BaseSuperAdmin from "../BaseSuperAdmin";
 
-
 // TODO Type get query params -> Where + inclue + orderby
 export interface IGetFilesparams {
 	where?: {};
@@ -53,10 +52,9 @@ export default class Files extends BaseSuperAdmin {
 	}
 
 	public getUploadLink(uid: string): string {
-		return this.baseURl.concat(`/upload/${uid}`);
+		return this.baseURl.concat(`/download/${uid}`);
 	}
 
-
 	public async getByUid(uid: string, q?: any): Promise<File> {
 		const url = new URL(this.baseURl.concat(`/${uid}`));
 		const query = { q };

src/front/Assets/Icons/green-check.svg

@@ -0,0 +1,3 @@
+<svg width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M18 6L8.375 16L4 11.4545" stroke="#12BF4D" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

src/front/Components/DesignSystem/DepositDocument/classes.module.scss

@@ -1,4 +1,7 @@
-.root {
+.container {
+
+
+	.root {
 		padding: 24px;
 		background-color: var(--white);
 		border: 1px dashed #e7e7e7;
@@ -30,6 +33,10 @@
 			.right {
 				margin-left: 18px;
 
+				.validated {
+					color: var(--green-flash);
+				}
+
 				.refused-button {
 					font-size: 14px;
 					color: var(--re-hover);
@@ -59,6 +66,10 @@
 					display: flex;
 					align-items: center;
 					gap: 8px;
+					.loader {
+						width: 32px;
+						height: 32px;
+					}
 				}
 
 				.cross {
@@ -82,10 +93,16 @@
 		.text {
 			margin-bottom: 12px;
 		}
-}
+	}
 
-.modal-content{
+	.modal-content {
 		display: flex;
 		flex-direction: column;
 		gap: 16px;
+	}
+
+	.error-message {
+		color: var(--red-flash);
+		margin-top: 8px;
+	}
 }

src/front/Components/DesignSystem/DepositDocument/index.tsx

@@ -15,6 +15,8 @@ import { EDocumentStatus } from "le-coffre-resources/dist/Customer/Document";
 import classNames from "classnames";
 import Confirm from "../Modal/Confirm";
 import InputField from "../Form/Elements/InputField";
+import GreenCheckIcon from "@Assets/Icons/green-check.svg";
+import Loader from "../Loader";
 
 type IProps = {
 	defaultFiles?: FileCustomer[];
@@ -27,6 +29,7 @@ type IFile = {
 	file: File;
 	uid: string;
 	archived: Date | null;
+	fileName: string;
 };
 
 type IState = {
@@ -35,6 +38,7 @@ type IState = {
 	currentFiles?: FileCustomer[];
 	refusedReason?: string;
 	isShowRefusedReasonModalVisible: boolean;
+	loading: boolean;
 };
 
 export default class DepositDocument extends React.Component<IProps, IState> {
@@ -50,6 +54,7 @@ export default class DepositDocument extends React.Component<IProps, IState> {
 			currentFiles: this.props.defaultFiles,
 			refusedReason: "",
 			isShowRefusedReasonModalVisible: false,
+			loading: false,
 		};
 
 		this.addDocument = this.addDocument.bind(this);
@@ -65,6 +70,7 @@ export default class DepositDocument extends React.Component<IProps, IState> {
 
 	public override render(): JSX.Element {
 		return (
+			<div className={classes["container"]}>
 				<div
 					className={classNames(
 						classes["root"],
@@ -82,10 +88,19 @@ export default class DepositDocument extends React.Component<IProps, IState> {
 						<div className={classes["separator"]} />
 						<div className={classes["right"]}>
 							<Typography typo={ITypo.P_SB_16} color={ITypoColor.BLACK} className={classes["title"]}>
-							{this.props.document.document_type?.name}{" "}
+								<div
-							{this.props.document.document_type?.public_description !== "" && (
+									className={
+										this.props.document.document_status === EDocumentStatus.VALIDATED ? classes["validated"] : ""
+									}>
+									{this.props.document.document_type?.name}
+								</div>
+								{this.props.document.document_type?.public_description !== "" &&
+									this.props.document.document_status !== EDocumentStatus.VALIDATED && (
 										<Tooltip text={this.props.document.document_type?.public_description} />
 									)}
+								{this.props.document.document_status === EDocumentStatus.VALIDATED && (
+									<Image src={GreenCheckIcon} alt="Document check" />
+								)}
 							</Typography>
 							{this.props.document.document_status !== EDocumentStatus.VALIDATED && (
 								<Typography color={ITypoColor.GREY} typo={ITypo.CAPTION_14}>
@@ -107,7 +122,7 @@ export default class DepositDocument extends React.Component<IProps, IState> {
 										<div className={classes["left-part"]}>
 											<Image src={DocumentCheckIcon} alt="Document check" />
 											<Typography typo={ITypo.P_16} color={ITypoColor.GREY}>
-											{this.shortName(fileObj.name)}
+												{this.shortName(file.fileName || fileObj.name)}
 											</Typography>
 										</div>
 										<Image
@@ -120,6 +135,19 @@ export default class DepositDocument extends React.Component<IProps, IState> {
 									</div>
 								);
 							})}
+							{this.state.loading && (
+								<div className={classes["file-container"]}>
+									<div className={classes["left-part"]}>
+										<div className={classes["loader"]}>
+											<Loader />
+										</div>
+										<Typography typo={ITypo.P_16} color={ITypoColor.GREY}>
+											Chargement...
+										</Typography>
+									</div>
+									<div />
+								</div>
+							)}
 						</div>
 					)}
 					{this.props.document.document_status !== EDocumentStatus.VALIDATED && (
@@ -147,6 +175,12 @@ export default class DepositDocument extends React.Component<IProps, IState> {
 						</div>
 					</Confirm>
 				</div>
+				{this.props.document.document_status === EDocumentStatus.REFUSED && (
+					<Typography typo={ITypo.CAPTION_14} className={classes["error-message"]}>
+						Ce document n’est pas conforme. Veuillez le déposer à nouveau.
+					</Typography>
+				)}
+			</div>
 		);
 	}
 
@@ -157,6 +191,7 @@ export default class DepositDocument extends React.Component<IProps, IState> {
 					index: this.index++,
 					file: new File([""], file.file_path ?? "", {}),
 					uid: file.uid!,
+					fileName: file.file_name,
 					archived: file.archived_at ? new Date(file.archived_at) : null,
 				})),
 			});
@@ -259,12 +294,15 @@ export default class DepositDocument extends React.Component<IProps, IState> {
 		formData.append("file", file, file.name);
 		const query = JSON.stringify({ document: { uid: this.props.document.uid } });
 		formData.append("q", query);
-
+		this.setState({
+			loading: true,
+		});
 		const newFile = await Files.getInstance().post(formData);
 		const files = this.state.currentFiles ? [...this.state.currentFiles, newFile] : [newFile];
 
 		this.setState({
 			currentFiles: files,
+			loading: false,
 			files: [
 				...this.state.files,
 				{
@@ -272,6 +310,7 @@ export default class DepositDocument extends React.Component<IProps, IState> {
 					file: file,
 					uid: newFile.uid!,
 					archived: null,
+					fileName: newFile?.file_name ?? "",
 				},
 			],
 		});

src/front/Components/DesignSystem/Document/DocumentNotary/index.tsx

@@ -58,9 +58,13 @@ class DocumentNotaryClass extends React.Component<IPropsClass, IState> {
 					return fileName;
 				}
 			} else {
-				const archivedFilesLenght = documentFiles.filter((file) => file.archived_at).length;
+				const archivedFilesLength = documentFiles.filter((file) => file.archived_at).length;
-				const documentFileLenght = documentFiles.length - archivedFilesLenght;
+				const documentFileLength = documentFiles.length - archivedFilesLength;
-				return `${documentFileLenght} documents déposés`;
+				if(this.props.document.document_status === EDocumentStatus.ASKED || this.props.document.document_status === EDocumentStatus.REFUSED){
+					return 'Aucun document déposé';
+				}
+
+				return `${documentFileLength} documents déposés`;
 			}
 		} else {
 			return "Aucun document déposé";

src/front/Components/DesignSystem/FilePreview/index.tsx

@@ -5,12 +5,14 @@ import classes from "./classes.module.scss";
 
 type IProps = {
 	href: string;
+	fileName?: string;
 };
 type IState = {};
 
 export default class FilePreview extends React.Component<IProps, IState> {
 	override render() {
-		const type = this.props.href.split(".").pop();
+		let type = this.props.href.split(".").pop();
+		if(this.props.fileName) type = this.props.fileName.split(".").pop();
 		return (
 			<div className={classes["root"]}>
 				{!type && (
@@ -18,14 +20,12 @@ export default class FilePreview extends React.Component<IProps, IState> {
 						Erreur lors du chargement du fichier
 					</Typography>
 				)}
-				{type && (
 				<div className={classes["file-container"]}>
-						{type === "pdf" && (
+						{type?.toLowerCase() === "pdf" && (
 							<embed src={this.props.href} width="100%" height="100%" type="application/pdf" className={classes["pdf"]} />
 						)}
-						{type !== "pdf" && <img src={this.props.href} alt="File preview" className={classes["image"]} />}
+						{type?.toLowerCase() !== "pdf" && <img src={this.props.href} alt="File preview" className={classes["image"]} />}
 					</div>
-				)}
 			</div>
 		);
 	}

src/front/Components/DesignSystem/FolderList/classes.module.scss

@@ -2,7 +2,11 @@
 
 .root {
 	height: calc(100vh - 290px);
-	overflow: scroll;
+	overflow-y: scroll;
+
+	&.archived{
+		height: calc(100vh - 220px);
+	}
 
 	.active {
 		background-color: var(--grey-medium);

src/front/Components/DesignSystem/FolderList/index.tsx

@@ -7,6 +7,7 @@ import React from "react";
 
 import FolderContainer from "../FolderContainer";
 import classes from "./classes.module.scss";
+import classNames from "classnames";
 
 type IProps = {
 	folders: IDashBoardFolder[];
@@ -26,7 +27,7 @@ class FolderListClass extends React.Component<IPropsClass, IState> {
 		? Module.getInstance().get().modules.pages.Folder.pages.FolderArchived.pages.FolderInformation.props.path
 		: Module.getInstance().get().modules.pages.Folder.pages.FolderInformation.props.path;
 	public override render(): JSX.Element {
-		return <div className={classes["root"]}>{this.renderFolders()}</div>;
+		return <div className={classNames(classes["root"], this.props.isArchived ? classes["archived"]:"")}>{this.renderFolders()}</div>;
 	}
 
 	private renderFolders(): JSX.Element[] {

src/front/Components/DesignSystem/FolderListContainer/index.tsx

@@ -1,4 +1,5 @@
 import { IDashBoardFolder } from "@Front/Components/LayoutTemplates/DefaultNotaryDashboard";
+import Module from "@Front/Config/Module";
 import Link from "next/link";
 import React from "react";
 
@@ -6,7 +7,6 @@ import Button from "../Button";
 import FolderList from "../FolderList";
 import SearchBar from "../SearchBar";
 import classes from "./classes.module.scss";
-import Module from "@Front/Config/Module";
 
 type IProps = {
 	folders: IDashBoardFolder[];
@@ -44,13 +44,13 @@ export default class FolderListContainer extends React.Component<IProps, IState>
 						/>
 					</div>
 				</div>
-				<div>
 				{!this.props.isArchived && (
+					<div>
 						<Link href={navigatePath}>
 							<Button fullwidth={true}>Créer un dossier</Button>
 						</Link>
-					)}
 					</div>
+				)}
 			</div>
 		);
 	}

src/front/Components/DesignSystem/Header/index.tsx

@@ -10,6 +10,9 @@ import BurgerMenu from "./BurgerMenu";
 import WindowStore from "@Front/Stores/WindowStore";
 import Module from "@Front/Config/Module";
 import Head from "next/head";
+import { useRouter } from "next/router";
+import LogoCielNatureIcon from "./logo-ciel-notaires.jpeg";
+
 enum EHeaderOpeningState {
 	OPEN = "open",
 	CLOSED = "closed",
@@ -19,6 +22,11 @@ enum EHeaderOpeningState {
 type IProps = {
 	isUserConnected: boolean;
 };
+
+type IPropsClass = IProps & {
+	isOnCustomerLoginPage: boolean;
+};
+
 type IState = {
 	open: EHeaderOpeningState;
 	isBurgerMenuOpen: boolean;
@@ -26,11 +34,11 @@ type IState = {
 	isProfileMenuOpen: boolean;
 };
 
-export default class Header extends React.Component<IProps, IState> {
+class HeaderClass extends React.Component<IPropsClass, IState> {
 	private onWindowResize = () => {};
 	private headerBreakpoint = 1300;
 
-	constructor(props: IProps) {
+	constructor(props: IPropsClass) {
 		super(props);
 
 		this.state = {
@@ -85,6 +93,7 @@ export default class Header extends React.Component<IProps, IState> {
 						</div>
 					</>
 				)}
+				{this.props.isOnCustomerLoginPage && <Image width={70} height={70} alt="ciel-nature" src={LogoCielNatureIcon}></Image>}
 			</div>
 		);
 	}
@@ -126,3 +135,10 @@ export default class Header extends React.Component<IProps, IState> {
 		this.setState({ isProfileMenuOpen: false });
 	}
 }
+
+export default function Header(props: IProps) {
+	const router = useRouter();
+	const { pathname } = router;
+	let isActive = Module.getInstance().get().modules.pages.CustomersLogin.props.path === pathname;
+	return <HeaderClass {...props} isOnCustomerLoginPage={isActive} />;
+}

src/front/Components/DesignSystem/Loader/classes.module.scss

@@ -1,16 +1,15 @@
-@import "@Themes/constants.scss";
+@keyframes s2 {
-
-.loader {
-	animation: spin 2s linear infinite;
-	width: 100%;
-	height: 100%;
-
-	@keyframes spin {
-		from {
-			transform: rotate(0deg);
-		}
 	to {
-			transform: rotate(360deg);
+		transform: rotate(1turn);
-		}
 	}
 }
+
+.root {
+	width: 100%;
+	height: 100%;
+	border-radius: 50%;
+	border: 8px solid;
+	border-color: var(--grey-soft);
+	border-right-color: var(--blue-soft);
+	animation: s2 1s infinite linear;
+}

src/front/Components/DesignSystem/Loader/index.tsx

@@ -1,14 +1,11 @@
 import React from "react";
-import LoaderIcon from "@Assets/Icons/loader.svg";
 import classes from "./classes.module.scss";
-import Image from "next/image";
 
 interface IProps {
 	className?: string;
 }
 export default class Loader extends React.Component<IProps> {
 	public override render(): JSX.Element {
-		return <Image src={LoaderIcon} className={[classes["loader"], this.props.className].filter(Boolean).join(" ")} alt={"Loader"} />;
+		return <div className={classes["root"]}></div>;
-		// <LoaderIcon className={[classes["loader"], this.props.className].filter(Boolean).join(" ")} />;
 	}
 }

src/front/Components/DesignSystem/UserFolder/index.tsx

@@ -49,7 +49,10 @@ export default class UserFolder extends React.Component<IProps, IState> {
 		this.deleteAskedDocument = this.deleteAskedDocument.bind(this);
 	}
 	public override render(): JSX.Element {
-		const documentsAsked: Document[] | null = this.getDocumentsByStatus("ASKED");
+		const documentsAsked: Document[] | null = [
+			...(this.getDocumentsByStatus("ASKED") ?? []),
+			...(this.getDocumentsByStatus("REFUSED") ?? []),
+		];
 		const otherDocuments: Document[] | null = this.getValidatedAndPendindDocuments();
 		const redirectPath = Module.getInstance()
 			.get()
@@ -111,9 +114,7 @@ export default class UserFolder extends React.Component<IProps, IState> {
 											Demander un autre document{" "}
 										</Button>
 									</Link>
-									<Button disabled={documentsAsked ? false : true}>
+									<Button disabled={documentsAsked ? false : true}>Envoyer un mail de demande</Button>
-										Envoyer un mail de demande
-									</Button>
 								</div>
 							)}
 						</div>

src/front/Components/Layouts/DesignSystem/dummyData.ts

@@ -82,8 +82,8 @@ export const docType: DocumentType = {
 	uid: "fezezfazegezrgrezg",
 	created_at: new Date(),
 	updated_at: new Date(),
-	public_description: "Acte de naissance public description",
+	public_description: "",
-	private_description: "Acte de naissance private description",
+	private_description: "",
 	archived_at: new Date(),
 	office: office,
 };

src/front/Components/Layouts/Folder/AskDocuments/index.tsx

@@ -1,4 +1,7 @@
 import PlusIcon from "@Assets/Icons/plus.svg";
+import Deeds from "@Front/Api/LeCoffreApi/SuperAdmin/Deeds/Deeds";
+import Documents from "@Front/Api/LeCoffreApi/SuperAdmin/Documents/Documents";
+import DocumentTypes from "@Front/Api/LeCoffreApi/SuperAdmin/DocumentTypes/DocumentTypes";
 import Folders from "@Front/Api/LeCoffreApi/SuperAdmin/Folders/Folders";
 import Button, { EButtonVariant } from "@Front/Components/DesignSystem/Button";
 import CheckBox from "@Front/Components/DesignSystem/CheckBox";
@@ -9,16 +12,13 @@ import { IOption } from "@Front/Components/DesignSystem/Select";
 import Typography, { ITypo, ITypoColor } from "@Front/Components/DesignSystem/Typography";
 import BackArrow from "@Front/Components/Elements/BackArrow";
 import DefaultNotaryDashboard from "@Front/Components/LayoutTemplates/DefaultNotaryDashboard";
+import Module from "@Front/Config/Module";
+import { OfficeFolder } from "le-coffre-resources/dist/Customer";
 import { NextRouter, useRouter } from "next/router";
 import React from "react";
 
 import BasePage from "../../Base";
 import classes from "./classes.module.scss";
-import Documents from "@Front/Api/LeCoffreApi/SuperAdmin/Documents/Documents";
-import Module from "@Front/Config/Module";
-import { OfficeFolder } from "le-coffre-resources/dist/Customer";
-import Deeds from "@Front/Api/LeCoffreApi/SuperAdmin/Deeds/Deeds";
-import DocumentTypes from "@Front/Api/LeCoffreApi/SuperAdmin/DocumentTypes/DocumentTypes";
 
 type IProps = {};
 type IPropsClass = IProps & {
@@ -57,10 +57,13 @@ class AskDocumentsClass extends BasePage<IPropsClass, IState> {
 	}
 
 	public override render(): JSX.Element {
+		const backUrl = Module.getInstance()
+			.get()
+			.modules.pages.Folder.pages.FolderInformation.props.path.replace("[folderUid]", this.props.folderUid);
 		return (
 			<DefaultNotaryDashboard title={"Demander des documents"} onSelectedFolder={() => {}}>
 				<div className={classes["root"]}>
-					<BackArrow />
+					<BackArrow url={backUrl} />
 					<Typography typo={ITypo.H1} color={ITypoColor.BLACK} className={classes["title"]}>
 						Demander des documents
 					</Typography>
@@ -87,9 +90,11 @@ class AskDocumentsClass extends BasePage<IPropsClass, IState> {
 								</Button>
 							</div>
 							<div className={classes["buttons-container"]}>
+								<a href={backUrl}>
 									<Button variant={EButtonVariant.GHOST} onClick={this.cancel}>
 										Annuler
 									</Button>
+								</a>
 								<Button type="submit">Valider</Button>
 							</div>
 						</div>
@@ -142,6 +147,12 @@ class AskDocumentsClass extends BasePage<IPropsClass, IState> {
 						},
 					},
 					office: true,
+					documents: {
+						include: {
+							depositor: true,
+							document_type: true,
+						},
+					},
 				},
 			});
 			if (!folder) return;
@@ -155,19 +166,23 @@ class AskDocumentsClass extends BasePage<IPropsClass, IState> {
 	}
 
 	private async getAvailableDocuments(folder: OfficeFolder): Promise<IOption[]> {
-		const documentTypes = await Deeds.getInstance().getByUid(folder.deed!.uid!, {
+		const userDocumentTypesUids = folder
-			q: {
+			.documents!.filter((document) => document.depositor!.uid! === this.props.customerUid!)
-				deed_has_document_types: {
+			.map((document) => {
-					include: {
+				return document.document_type!.uid!;
-						document_type: true,
+			});
-					},
+		const documentTypes = folder.deed!.deed_has_document_types!.filter((documentType) => {
-				},
+			if (userDocumentTypesUids.includes(documentType.document_type!.uid!)) return false;
-			},
+			return true;
 		});
 
 		if (!documentTypes) return [];
 
-		const documentTypesOptions: IOption[] = documentTypes.deed_has_document_types!.map((documentType) => {
+		const documentTypesOptions: IOption[] = documentTypes
+			.filter((documentType) => {
+				return true;
+			})
+			.map((documentType) => {
 				return {
 					label: documentType.document_type!.name!,
 					value: documentType.document_type!.uid!,

src/front/Components/Layouts/Folder/CreateFolder/index.tsx

@@ -1,4 +1,3 @@
-import RightImage from "@Front/Assets/images/create-folder/right-image.png";
 import Button from "@Front/Components/DesignSystem/Button";
 import Form from "@Front/Components/DesignSystem/Form";
 import InputField from "@Front/Components/DesignSystem/Form/Elements/InputField";
@@ -19,6 +18,7 @@ import Users from "@Front/Api/LeCoffreApi/SuperAdmin/Users/Users";
 import User from "le-coffre-resources/dist/Notary";
 import Folders, { IPostFoldersParams } from "@Front/Api/LeCoffreApi/SuperAdmin/Folders/Folders";
 import { NextRouter, useRouter } from "next/router";
+import BackgroundImage from "./background-image.jpeg";
 
 type IFormValues = {
 	folder_number: string;
@@ -73,7 +73,7 @@ class CreateFolderClass extends BasePage<IPropsClass, IState> {
 
 	public override render(): JSX.Element {
 		return (
-			<DefaultDoubleSidePage title={"Dossier"} image={RightImage} type="image" showHeader={true}>
+			<DefaultDoubleSidePage title={"Dossier"} image={BackgroundImage} type="background" showHeader={true}>
 				<div className={classes["root"]}>
 					<BackArrow />
 					<Typography typo={ITypo.H1} color={ITypoColor.BLACK} className={classes["title"]}>
@@ -137,11 +137,13 @@ class CreateFolderClass extends BasePage<IPropsClass, IState> {
 		const deedTypes = await DeedTypes.getInstance().get({ q: {} });
 
 		// TODO SETUP userStore and get the user's office membership -> Replace IwJ70M471c by the user's office membership uid
-		const usersMock = await Users.getInstance().get( { include: { office_membership: true } });
+		const usersMock = await Users.getInstance().get({ include: { office_membership: true } });
 		const userMock = usersMock[0];
 		// -------------------
-		const collaborators = await Users.getInstance().get( { where: { office_membership: { uid: userMock?.office_membership?.uid } }, include: { contact: true } },
+		const collaborators = await Users.getInstance().get({
-		);
+			where: { office_membership: { uid: userMock?.office_membership?.uid } },
+			include: { contact: true },
+		});
 		this.setState({
 			deedTypes,
 			deedTypesOptions: this.mapDeedOptions(deedTypes),
@@ -222,7 +224,7 @@ class CreateFolderClass extends BasePage<IPropsClass, IState> {
 		/**
 		 * MOCK DATA
 		 */
-		const usersMock = await Users.getInstance().get( { include: { office_membership: true }});
+		const usersMock = await Users.getInstance().get({ include: { office_membership: true } });
 		const userMock = usersMock[0];
 		// -----
 		if (!selectedDeedTypeUid) return;

src/front/Components/Layouts/Folder/FolderInformation/index.tsx

@@ -123,7 +123,7 @@ class FolderInformationClass extends BasePage<IPropsClass, IState> {
 							<Typography typo={ITypo.H1Bis}>Informations du dossier</Typography>
 							<div className={classes["choose-a-folder"]}>
 								<Typography typo={ITypo.P_18} color={ITypoColor.GREY}>
-									Vous n'avez aucun dossier archivés
+									Sélectionnez un dossier
 								</Typography>
 							</div>
 						</div>

src/front/Components/Layouts/Folder/ViewDocuments/index.tsx

@@ -74,7 +74,7 @@ class ViewDocumentsClass extends BasePage<IPropsClass, IState> {
 				{this.state.document && this.state.document.files && this.state.selectedFile && (
 					<div className={classes["root"]}>
 						<Typography typo={ITypo.H1} color={ITypoColor.BLACK} className={classes["title"]}>
-							{this.state.document.document_type?.name}
+							{this.state.document.folder?.name}
 						</Typography>
 						<Typography typo={ITypo.H3} color={ITypoColor.BLACK} className={classes["subtitle"]}>
 							{this.state.document.document_type?.name}
@@ -91,6 +91,7 @@ class ViewDocumentsClass extends BasePage<IPropsClass, IState> {
 							<div className={classes["file-container"]}>
 								<FilePreview
 									href={Files.getInstance().getUploadLink(this.state.selectedFile?.uid as string)}
+									fileName={this.state.selectedFile.file_name}
 									key={this.state.selectedFile.uid}
 								/>
 							</div>
@@ -104,7 +105,7 @@ class ViewDocumentsClass extends BasePage<IPropsClass, IState> {
 							)}
 						</div>
 						<div className={classes["footer"]}>
-							{this.state.document?.document_type?.name === "Carte d'identité" && (
+							{this.state.document?.document_type?.name === "Document d'identité" && (
 								<div className={classes["ocr-container"]}>
 									<OcrResult percentage={this.state.validatedPercentage} />
 								</div>
@@ -148,7 +149,7 @@ class ViewDocumentsClass extends BasePage<IPropsClass, IState> {
 										</Typography>
 										<Image src={ValidateAnchoringGif} alt="Anchoring animation" className={classes["validate-gif"]} />
 										<div className={classes["dont-show-again"]}>
-											<CheckBox option={{ label: "Ne plus afficher ce message", value: false }} toolTip={"Test"} />
+											<CheckBox option={{ label: "Ne plus afficher ce message", value: false }} />
 										</div>
 									</div>
 								)}
@@ -188,6 +189,7 @@ class ViewDocumentsClass extends BasePage<IPropsClass, IState> {
 			const document = await Documents.getInstance().getByUid(this.props.documentUid, {
 				files: true,
 				document_type: true,
+				folder: true,
 			});
 			this.setState({
 				document,

src/front/Components/Layouts/Folder/index.tsx

@@ -28,7 +28,7 @@ export default class Folder extends BasePage<IProps, IState> {
 						<Typography typo={ITypo.H1Bis}>Informations du dossier</Typography>
 						<div className={classes["choose-a-folder"]}>
 							<Typography typo={ITypo.P_18} color={ITypoColor.GREY}>
-								Vous n'avez aucun dossier archivés
+								Sélectionnez un dossier
 							</Typography>
 						</div>
 					</div>

src/front/Components/Layouts/FolderArchived/FolderInformation/index.tsx

@@ -93,7 +93,7 @@ class FolderInformationClass extends BasePage<IPropsClass, IState> {
 							<Typography typo={ITypo.H1Bis}>Informations du dossier</Typography>
 							<div className={classes["choose-a-folder"]}>
 								<Typography typo={ITypo.P_18} color={ITypoColor.GREY}>
-									Vous n'avez aucun dossier archivés
+									Vous n'avez aucun dossier archivé
 								</Typography>
 							</div>
 						</div>

src/front/Components/Layouts/FolderArchived/index.tsx

@@ -31,7 +31,7 @@ export default class Folder extends BasePage<IProps, IState> {
 						<Typography typo={ITypo.H1Bis}>Informations du dossier</Typography>
 						<div className={classes["choose-a-folder"]}>
 							<Typography typo={ITypo.P_18} color={ITypoColor.GREY}>
-								Vous n'avez aucun dossier archivés
+								Vous n'avez aucun dossier archivé
 							</Typography>
 						</div>
 					</div>

src/front/Components/Layouts/Login/index.tsx

@@ -3,7 +3,7 @@ import Typography, { ITypo } from "@Front/Components/DesignSystem/Typography";
 import BasePage from "../Base";
 import classes from "./classes.module.scss";
 import CoffreIcon from "@Assets/Icons/coffre.svg";
-import LandingImage from "./landing-connect.png";
+import LandingImage from "./landing-connect.jpeg";
 import Image from "next/image";
 import DefaultDoubleSidePage from "@Front/Components/LayoutTemplates/DefaultDoubleSidePage";
 import { FrontendVariables } from "@Front/Config/VariablesFront";

src/front/Components/Layouts/LoginCustomer/index.tsx

@@ -1,7 +1,7 @@
 import Typography, { ITypo } from "@Front/Components/DesignSystem/Typography";
 import BasePage from "../Base";
 import classes from "./classes.module.scss";
-import LandingImage from "./landing-connect.png";
+import LandingImage from "../Login/landing-connect.jpeg";
 import Image from "next/image";
 import DefaultDoubleSidePage from "@Front/Components/LayoutTemplates/DefaultDoubleSidePage";
 import FranceConnectIcon from "./france-connect.svg";
@@ -42,7 +42,9 @@ export default class LoginCustomer extends BasePage {
 		// 	variables.BACK_API_PROTOCOL + variables.FRONT_APP_HOST + (variables.FRONT_APP_PORT ? ":" + variables.FRONT_APP_PORT : "");
 		const authorizeEndPoint = variables.FC_AUTHORIZE_ENDPOINT;
 		const clientId = variables.FC_CLIENT_ID;
-		const url = `${authorizeEndPoint}?client_id=${clientId}&redirect_uri=http://localhost:8080/login-callback&scope=openid&response_type=code&state=${cryptoRandomString({length: 64})}&nonce=${cryptoRandomString({length: 64})}&acr_values=eidas1`;
+		const url = `${authorizeEndPoint}?client_id=${clientId}&redirect_uri=http://localhost:8080/login-callback&scope=openid&response_type=code&state=${cryptoRandomString(
+			{ length: 64 },
+		)}&nonce=${cryptoRandomString({ length: 64 })}&acr_values=eidas1`;
 		window.location.assign(url);
 	}
 }

src/front/Components/Layouts/PageNotFound/index.tsx

@@ -2,15 +2,15 @@ import Button from "@Front/Components/DesignSystem/Button";
 import Typography, { ITypo } from "@Front/Components/DesignSystem/Typography";
 import Module from "@Front/Config/Module";
 import Link from "next/link";
-import RightImage from "@Assets/images/create-folder/right-image.png";
 import BasePage from "../Base";
 import classes from "./classes.module.scss";
 import DefaultDoubleSidePage from "@Front/Components/LayoutTemplates/DefaultDoubleSidePage";
 
+import backgroundImage from "../Folder/CreateFolder/background-image.jpeg";
 export default class PageNotFound extends BasePage {
 	public override render(): JSX.Element {
 		return (
-			<DefaultDoubleSidePage title={"Project Not Found"} image={RightImage} type="image" showHeader>
+			<DefaultDoubleSidePage title={"Project Not Found"} image={backgroundImage} type="background" showHeader>
 				<div className={classes["root"]}>
 					<div className={classes["content"]}>
 						<Typography typo={ITypo.H1}>Erreur 404</Typography>

src/front/Config/Module/development.json

@@ -24,6 +24,13 @@
 					"labelKey": "design_system"
 				}
 			},
+			"CustomersLogin": {
+				"enabled": true,
+				"props": {
+					"path": "/customers/login",
+					"labelKey": "customer_login"
+				}
+			},
 			"Folder": {
 				"enabled": true,
 				"props": {

src/front/Config/Module/preprod.json

@@ -24,6 +24,13 @@
 					"labelKey": "design_system"
 				}
 			},
+			"CustomersLogin": {
+				"enabled": true,
+				"props": {
+					"path": "/customers/login",
+					"labelKey": "customer_login"
+				}
+			},
 			"Folder": {
 				"enabled": true,
 				"props": {

src/front/Config/Module/production.json

@@ -24,6 +24,13 @@
 					"labelKey": "design_system"
 				}
 			},
+			"CustomersLogin": {
+				"enabled": true,
+				"props": {
+					"path": "/customers/login",
+					"labelKey": "customer_login"
+				}
+			},
 			"Folder": {
 				"enabled": true,
 				"props": {

src/front/Config/Module/staging.json

@@ -24,6 +24,13 @@
 					"labelKey": "design_system"
 				}
 			},
+			"CustomersLogin": {
+				"enabled": true,
+				"props": {
+					"path": "/customers/login",
+					"labelKey": "customer_login"
+				}
+			},
 			"Folder": {
 				"enabled": true,
 				"props": {