+
+
+ );
+ }
+
+ public override componentDidMount(): void {
+ if (this.props.defaultFiles) {
+ this.setState({
+ files: this.props.defaultFiles.map((file) => ({
+ index: this.index++,
+ file: new File([""], file.file_path ?? "", {}),
+ })),
+ });
+ }
+ }
+
+ private shortName(name: string): string {
+ const maxLength = 20;
+ if (name.length > maxLength) {
+ return name.substring(0, maxLength / 2) + "..." + name.substring(name.length - maxLength / 2, name.length);
+ }
+ return name;
+ }
+
+ private onDragOver(event: React.DragEvent
+
+ {this.state.files.length > 0 && (
+
+
+
+
+
+ {this.props.title}
+
+ Demandé par le notaire le {this.formatDate(this.props.dateAsked)}
+
+
+
+ {this.state.files.map((file) => {
+ const fileObj = file.file;
+ return (
+
+ )}
+
+
+
+ );
+ })}
+
+
+ {this.shortName(fileObj.name)}
+
+
+
+
+
+
+
+ );
+ }
+
+ private getDocumentsTitle() {
+ const documentFiles = this.props.document.files;
+ if (documentFiles) {
+ if (documentFiles.length === 1) {
+ const fileName = documentFiles[0]?.file_path?.split("/").pop();
+ if (fileName && fileName.length > 20) {
+ return `${fileName.substring(0, 7)}...${fileName.substring(fileName.length - 7, fileName.length)}`;
+ } else {
+ return fileName;
+ }
+ } else {
+ return `${documentFiles.length} documents déposés`;
+ }
+ } else {
+ return "Aucun document déposé";
+ }
+ }
+
+ private onClick() {
+ if (this.props.document.document_status !== EDocumentStatus.VALIDATED && this.props.document.document_status !== EDocumentStatus.DEPOSITED) return;
+ this.props.router.push(`/folders/${this.props.folderUid}/documents/${this.props.document.uid}`);
+ }
+
+ private renderIcon(): JSX.Element {
+ switch (this.props.document.document_status) {
+ case "VALIDATED":
+ return (
+
+ {this.props.document?.document_type?.name}
+ {this.getDocumentsTitle()}
+
+ {this.renderIcon()}
+
+
+ );
+ case EDocumentStatus.DEPOSITED:
+ return
+ {!type && (
+
+ Erreur lors du chargement du fichier
+
+ )}
+ {type && (
+
+ );
+ }
+}
diff --git a/src/front/Components/DesignSystem/FolderBoxInformation/classes.module.scss b/src/front/Components/DesignSystem/FolderBoxInformation/classes.module.scss
new file mode 100644
index 00000000..c22fa8de
--- /dev/null
+++ b/src/front/Components/DesignSystem/FolderBoxInformation/classes.module.scss
@@ -0,0 +1,55 @@
+@import "@Themes/constants.scss";
+
+.root {
+ background-color: var(--grey-soft);
+ padding: 24px;
+ width: 100%;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+
+ .content {
+ display: grid;
+ grid-template-columns: 1fr 1fr 1fr 1fr;
+ gap: 32px;
+ width: 100%;
+
+ .text-container {
+ display: flex;
+ flex-direction: column;
+ justify-content: space-between;
+
+ > :first-child {
+ margin-bottom: 12px;
+ }
+ }
+
+
+ @media (max-width: $screen-ls) {
+ grid-template-columns: 1fr 1fr;
+ }
+
+ @media (max-width: $screen-s) {
+ grid-template-columns: 1fr;
+ }
+
+ &.single-information {
+ grid-template-columns: 1fr;
+ }
+ }
+
+ .edit-icon-container {
+ cursor: pointer;
+ margin-left: 48px;
+ }
+
+ @media (max-width: $screen-s) {
+ flex-wrap: wrap;
+
+ .edit-icon-container {
+ margin-left: 0px;
+ margin-top: 24px;
+ }
+ }
+
+}
\ No newline at end of file
diff --git a/src/front/Components/DesignSystem/FolderBoxInformation/index.tsx b/src/front/Components/DesignSystem/FolderBoxInformation/index.tsx
new file mode 100644
index 00000000..27b61983
--- /dev/null
+++ b/src/front/Components/DesignSystem/FolderBoxInformation/index.tsx
@@ -0,0 +1,94 @@
+import PenICon from "@Assets/Icons/pen.svg";
+import { IDashBoardFolder } from "@Front/Components/LayoutTemplates/DefaultNotaryDashboard";
+import Module from "@Front/Config/Module";
+import classNames from "classnames";
+import Image from "next/image";
+import Link from "next/link";
+import React from "react";
+
+import Typography, { ITypo } from "../Typography";
+import classes from "./classes.module.scss";
+
+type IProps = {
+ folder: IDashBoardFolder;
+ type: EFolderBoxInformationType;
+ isArchived?: boolean;
+};
+
+export enum EFolderBoxInformationType {
+ INFORMATIONS = "informations",
+ DESCRIPTION = "description",
+ ARCHIVED_DESCRIPTION = "archivedDescription",
+}
+
+export default function FolderBoxInformation(props: IProps) {
+ const { isArchived = false, type } = props;
+ const editDescriptionPath = Module.getInstance()
+ .get()
+ .modules.pages.Folder.pages.EditDescription.props.path.replace("[folderUid]", props.folder.uid ?? "");
+ const editInformationsPath = Module.getInstance()
+ .get()
+ .modules.pages.Folder.pages.EditInformations.props.path.replace("[folderUid]", props.folder.uid ?? "");
+
+ const path = type === EFolderBoxInformationType.DESCRIPTION ? editDescriptionPath : editInformationsPath;
+ return (
+
+ {type === "pdf" && (
+
+ )}
+ {type !== "pdf" && 
}
+
+ )}
+
+
+ );
+
+ function renderContentByType(folder: IDashBoardFolder, type: EFolderBoxInformationType) {
+ switch (type) {
+ case EFolderBoxInformationType.DESCRIPTION:
+ return (
+ {renderContentByType(props.folder, type)}
+ {!isArchived && (
+
+
+ Note dossier
+ {folder.description ?? ""}
+
+ );
+ case EFolderBoxInformationType.ARCHIVED_DESCRIPTION:
+ return (
+
+ Note archive
+ {folder.archived_description ?? ""}
+
+ );
+ case EFolderBoxInformationType.INFORMATIONS:
+ return (
+ <>
+
+ Intitulé du dossier
+ {folder.name ?? ""}
+
+
+ Numéro de dossier
+ {folder.folder_number ?? ""}
+
+
+ Type d'acte
+ {folder.deed?.deed_type?.name ?? ""}
+
+
+ Ouverture du dossier
+ {formatDate(folder.created_at)}
+
+
+ );
+ }
+ }
+}
+
+function formatDate(date: Date | null): string {
+ if (!date) return "...";
+ if (!(date instanceof Date)) date = new Date(date);
+ return date.toLocaleDateString("fr-FR", {
+ year: "numeric",
+ month: "long",
+ day: "numeric",
+ });
+}
diff --git a/src/front/Components/DesignSystem/FolderContainer/classes.module.scss b/src/front/Components/DesignSystem/FolderContainer/classes.module.scss
new file mode 100644
index 00000000..989c0eca
--- /dev/null
+++ b/src/front/Components/DesignSystem/FolderContainer/classes.module.scss
@@ -0,0 +1,25 @@
+@import "@Themes/constants.scss";
+
+.root {
+ display: inline-flex;
+ justify-content: space-between;
+ align-items: center;
+ width: 100%;
+ padding: 24px;
+ border: 1px solid $grey-medium;
+ cursor: pointer;
+
+ &:hover {
+ background-color: $grey-medium;
+ }
+
+ .left-side {
+ display: inline-flex;
+ justify-content: space-between;
+ align-items: center;
+
+ .warning {
+ margin-left: 32px;
+ }
+ }
+}
diff --git a/src/front/Components/DesignSystem/FolderContainer/index.tsx b/src/front/Components/DesignSystem/FolderContainer/index.tsx
new file mode 100644
index 00000000..0dbdf597
--- /dev/null
+++ b/src/front/Components/DesignSystem/FolderContainer/index.tsx
@@ -0,0 +1,49 @@
+import ChevronIcon from "@Assets/Icons/chevron.svg";
+import { IDashBoardFolder } from "@Front/Components/LayoutTemplates/DefaultNotaryDashboard";
+import Image from "next/image";
+import React from "react";
+
+import Typography, { ITypo } from "../Typography";
+import WarningBadge from "../WarningBadge";
+import classes from "./classes.module.scss";
+import { EDocumentStatus } from "le-coffre-resources/dist/Customer/Document";
+
+type IProps = {
+ folder: IDashBoardFolder;
+ onSelectedFolder?: (folder: IDashBoardFolder) => void;
+};
+type IState = {};
+
+export default class FolderContainer extends React.Component
+
+ );
+ }
+
+ private countPendingDocuments(): number {
+ if (!this.props.folder.documents) return 0;
+ return this.props.folder.documents?.filter((document) => document.document_status === EDocumentStatus.DEPOSITED).length ?? 0;
+ }
+
+ private onSelectedFolder(): void {
+ this.props.onSelectedFolder && this.props.onSelectedFolder(this.props.folder);
+ }
+}
diff --git a/src/front/Components/DesignSystem/FolderList/classes.module.scss b/src/front/Components/DesignSystem/FolderList/classes.module.scss
new file mode 100644
index 00000000..8b1f302f
--- /dev/null
+++ b/src/front/Components/DesignSystem/FolderList/classes.module.scss
@@ -0,0 +1,7 @@
+@import "@Themes/constants.scss";
+
+.root {
+ .active {
+ background-color: var(--grey-medium);
+ }
+}
diff --git a/src/front/Components/DesignSystem/FolderList/index.tsx b/src/front/Components/DesignSystem/FolderList/index.tsx
new file mode 100644
index 00000000..7d67e2c7
--- /dev/null
+++ b/src/front/Components/DesignSystem/FolderList/index.tsx
@@ -0,0 +1,61 @@
+import { IDashBoardFolder } from "@Front/Components/LayoutTemplates/DefaultNotaryDashboard";
+import Link from "next/link";
+import { useRouter } from "next/router";
+import React from "react";
+
+import FolderContainer from "../FolderContainer";
+import classes from "./classes.module.scss";
+import Module from "@Front/Config/Module";
+import { EDocumentStatus } from "le-coffre-resources/dist/Customer/Document";
+
+type IProps = {
+ folders: IDashBoardFolder[];
+ isArchived: boolean;
+ onSelectedFolder?: (folder: IDashBoardFolder) => void;
+ onCloseLeftSide?: () => void;
+};
+
+type IPropsClass = IProps & {
+ selectedFolder: string;
+};
+
+type IState = {};
+
+class FolderListClass extends React.Component
+
+ {this.props.folder.folder_number.concat(" - ").concat(this.props.folder.name)}
+
+ {this.countPendingDocuments() > 0 && (
+
+
+
+ )}
+
+ {this.props.folders.sort((folder) => {
+ const pendingDocuments = (folder.documents ?? []).filter((document) => document.document_status === EDocumentStatus.DEPOSITED);
+ return pendingDocuments.length >= 1 ? -1 : 1;
+ }).sort((folder1, folder2) => {
+ return folder1.created_at! < folder2.created_at! ? -1 : 1;
+ }).sort((folder1, folder2) => {
+ return folder1.folder_number! < folder2.folder_number! ? -1 : 1;
+ }).map((folder) => {
+ return (
+
+ );
+ }
+}
+
+export default function FolderList(props: IProps) {
+ const router = useRouter();
+ let { folderUid } = router.query;
+ folderUid = folderUid as string;
+ return
+
+
+ );
+ })}
+ ;
+
+
+ );
+ }
+
+ private filterFolders(folders: IDashBoardFolder[]): IDashBoardFolder[] {
+ this.setState({ filteredFolders: folders });
+ return folders;
+ }
+}
diff --git a/src/front/Components/DesignSystem/Form/Elements/BaseField.tsx b/src/front/Components/DesignSystem/Form/Elements/BaseField.tsx
new file mode 100644
index 00000000..4c2f40e8
--- /dev/null
+++ b/src/front/Components/DesignSystem/Form/Elements/BaseField.tsx
@@ -0,0 +1,154 @@
+import { ChangeEvent, Component, createRef } from "react";
+
+import { FormContext, IFormContext } from "..";
+// elements
+import Validators, { IValidationTypes } from "../Validators/Validators";
+
+export type IError = {
+ message: string;
+ validator: string;
+ value: string | number | readonly string[];
+ args: any[];
+ isErrored?: (hasError: boolean) => void;
+};
+
+export type INewBasefieldProps = {
+ onChange?: (event: ChangeEvent
+
+
+
+
+ {!this.props.isArchived && (
+
+
+
+ )}
+
+ extends Component
+