Preprod (#200)

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

@@ -44,7 +44,7 @@ export const FormContext = React.createContext<IFormContext>({
 
 export default class Form extends React.Component<IProps, IState> {
 	protected fields: IFields = {};
-	private formRef: React.RefObject<HTMLFormElement>;
+	public formRef: React.RefObject<HTMLFormElement>;
 
 	constructor(props: IProps) {
 		super(props);

src/front/Components/Layouts/ClientDashboard/DepositDocumentComponent/index.tsx

@@ -59,7 +59,7 @@ export default function DepositDocumentComponent(props: IProps) {
 		if (!refused_reason) return;
 		setRefusedReason(refused_reason);
 		setIsModalOpen(true);
-	}, []);
+	}, [document.document_history]);
 
 	const closeModal = useCallback(() => {
 		setIsModalOpen(false);

src/front/Components/Layouts/ClientDashboard/ReceivedDocuments/index.tsx

@@ -85,7 +85,7 @@ export default function ReceivedDocuments() {
 		DocumentsNotary.getInstance()
 			.get({ where: { folder: { uid: folderUid }, customer: { uid: customerUid } }, include: { files: true } })
 			.then((documentsNotary) => setDocumentsNotary(documentsNotary));
-	}, [folderUid, customer]);
+	}, [folderUid, customer, fetchFolderAndCustomer]);
 
 	const onDownload = useCallback((doc: DocumentNotary) => {
 		const file = doc.files?.[0];

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

@@ -144,7 +144,7 @@ export default function ClientDashboard(props: IProps) {
 				})}
 			/>
 		);
-	}, [customer, folderUid, isAddDocumentModalVisible, onCloseModalAddDocument]);
+	}, [customer, folderUid, isAddDocumentModalVisible, onCloseModalAddDocument, folder]);
 
 	return (
 		<DefaultCustomerDashboard>

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

@@ -2,6 +2,7 @@ import Deeds from "@Front/Api/LeCoffreApi/Notary/Deeds/Deeds";
 import DocumentTypes from "@Front/Api/LeCoffreApi/Notary/DocumentTypes/DocumentTypes";
 import { IOption } from "@Front/Components/DesignSystem/Dropdown/DropdownMenu/DropdownOption";
 import AutocompleteMultiSelectField from "@Front/Components/DesignSystem/Form/AutocompleteMultiSelectField";
+import { IOption as IFormOption } from "@Front/Components/DesignSystem/Form/SelectFieldOld";
 import TextAreaField from "@Front/Components/DesignSystem/Form/TextareaField";
 import TextField from "@Front/Components/DesignSystem/Form/TextField";
 import Modal from "@Front/Components/DesignSystem/Modal";
@@ -15,6 +16,7 @@ type IProps = {
 	isCreateDocumentModalVisible: boolean;
 	closeModal: () => void;
 	folder: OfficeFolder;
+	onDocumentsUpdated?: (newDocumentTypes: IFormOption[]) => void;
 };
 
 export default function ParameterDocuments(props: IProps) {
@@ -80,9 +82,18 @@ export default function ParameterDocuments(props: IProps) {
 					document_types: [...oldDocumentsType, documentType],
 				});
 
-				//await this.loadData();
+				// Create a new document type in the format expected by the parent component
+				const newDocumentType: IFormOption = {
+					label: documentType.name!,
+					value: documentType.uid!,
+					description: documentType.private_description!,
+				};
+
+				if (props.onDocumentsUpdated) {
+					props.onDocumentsUpdated([newDocumentType]);
+				}
+				
 				handleClose();
-				window.location.reload();
 			} catch (e) {
 				console.error(e);
 			}
@@ -96,9 +107,23 @@ export default function ParameterDocuments(props: IProps) {
 					],
 				});
 
-				//await this.loadData();
+				// Get the full document details for the selected documents
+				const documentsById = await Promise.all(
+					selectedDocuments.map(async (doc) => {
+						const fullDoc = await DocumentTypes.getInstance().getByUid(doc.id as string);
+						return {
+							label: fullDoc.name!,
+							value: fullDoc.uid!,
+							description: fullDoc.private_description!,
+						} as IFormOption;
+					})
+				);
+
+				if (props.onDocumentsUpdated) {
+					props.onDocumentsUpdated(documentsById);
+				}
+				
 				handleClose();
-				window.location.reload();
 			} catch (e) {
 				console.error(e);
 			}

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

@@ -9,7 +9,7 @@ import Module from "@Front/Config/Module";
 import { PlusIcon } from "@heroicons/react/24/outline";
 import { OfficeFolder } from "le-coffre-resources/dist/Notary";
 import { useRouter } from "next/router";
-import React, { useCallback, useEffect, useState } from "react";
+import React, { useCallback, useEffect, useState, useRef } from "react";
 import DefaultDoubleSidePage from "@Front/Components/LayoutTemplates/DefaultDoubleSidePage";
 import classes from "./classes.module.scss";
 import ParameterDocuments from "./ParameterDocuments";
@@ -22,9 +22,30 @@ export default function AskDocuments() {
 	const [isCreateDocumentModalVisible, setIsCreateDocumentModalVisible] = useState<boolean>(false);
 	const [documentTypes, setDocumentTypes] = useState<IOption[]>([]);
 	const [folder, setFolder] = useState<OfficeFolder | null>(null);
+	const [selectedDocumentTypes, setSelectedDocumentTypes] = useState<string[]>([]);
+	const formRef = useRef<Form>(null);
 
 	const closeModal = () => setIsCreateDocumentModalVisible(false);
-	const openModal = () => setIsCreateDocumentModalVisible(true);
+	const openModal = () => {
+		// Store the currently selected document types before opening modal
+		const selectedTypes = getSelectedDocumentTypes();
+		setSelectedDocumentTypes(selectedTypes);
+		setIsCreateDocumentModalVisible(true);
+	};
+
+	const getSelectedDocumentTypes = () => {
+		// Get all checked checkboxes
+		if (!formRef.current) return [];
+
+		const formElement = formRef.current.formRef.current;
+		if (!formElement) return [];
+
+		const checkboxes = Array.from(formElement.elements).filter(
+			(elem) => elem.getAttribute("type") === "checkbox" && elem.getAttribute("name") === "document_types",
+		) as HTMLInputElement[];
+
+		return checkboxes.filter((checkbox) => checkbox.checked).map((checkbox) => checkbox.value);
+	};
 
 	const onFormSubmit = useCallback(
 		async (
@@ -122,13 +143,55 @@ export default function AskDocuments() {
 		}
 	}, [folderUid, getAvailableDocuments]);
 
+	// Update checkboxes after data has been refreshed
+	const updateCheckedState = useCallback(() => {
+		if (!formRef.current || selectedDocumentTypes.length === 0) return;
+
+		const formElement = formRef.current.formRef.current;
+		if (!formElement) return;
+
+		// Check all checkboxes that were previously selected
+		const checkboxes = Array.from(formElement.elements).filter(
+			(elem) => elem.getAttribute("type") === "checkbox" && elem.getAttribute("name") === "document_types",
+		) as HTMLInputElement[];
+
+		checkboxes.forEach((checkbox) => {
+			if (selectedDocumentTypes.includes(checkbox.value)) {
+				checkbox.checked = true;
+				// Trigger change to update the internal state of CheckBox component
+				const event = new Event("change", { bubbles: true });
+				checkbox.dispatchEvent(event);
+			}
+		});
+	}, [selectedDocumentTypes]);
+
 	useEffect(() => {
 		loadData();
 	}, [loadData]);
 
+	useEffect(() => {
+		// Set timeout to ensure DOM is updated with checkboxes before trying to check them
+		const timer = setTimeout(() => {
+			updateCheckedState();
+		}, 0);
+		return () => clearTimeout(timer);
+	}, [documentTypes, updateCheckedState]);
+
 	const backUrl = Module.getInstance()
 		.get()
 		.modules.pages.Folder.pages.FolderInformation.props.path.replace("[folderUid]", folderUid as string);
+
+	const handleDocumentsUpdated = async (newDocumentTypes: IOption[]) => {
+		// Store existing selections
+		const existingSelections = getSelectedDocumentTypes();
+
+		// Update document types with new ones
+		setDocumentTypes([...documentTypes, ...newDocumentTypes]);
+
+		// Set these as selected
+		setSelectedDocumentTypes([...existingSelections, ...newDocumentTypes.map((dt) => dt.value as string)]);
+	};
+
 	return (
 		<DefaultDoubleSidePage title={"Demander des documents"} image={backgroundImage} showHeader>
 			<div className={classes["root"]}>
@@ -136,7 +199,7 @@ export default function AskDocuments() {
 				<Typography typo={ETypo.DISPLAY_LARGE} color={ETypoColor.COLOR_GENERIC_BLACK} className={classes["title"]}>
 					Demander des documents
 				</Typography>
-				<Form onSubmit={onFormSubmit}>
+				<Form ref={formRef} onSubmit={onFormSubmit}>
 					<div className={classes["form-container"]}>
 						<div className={classes["checkbox-container"]}>
 							{documentTypes.map((documentType) => {
@@ -147,10 +210,18 @@ export default function AskDocuments() {
 											toolTip={documentType.description}
 											option={documentType}
 											key={documentType.value as string}
+											checked={selectedDocumentTypes.includes(documentType.value as string)}
 										/>
 									);
 								}
-								return <CheckBox name="document_types" option={documentType} key={documentType.value as string} />;
+								return (
+									<CheckBox
+										name="document_types"
+										option={documentType}
+										key={documentType.value as string}
+										checked={selectedDocumentTypes.includes(documentType.value as string)}
+									/>
+								);
 							})}
 						</div>
 						<div className={classes["add-document-container"]}>
@@ -175,7 +246,12 @@ export default function AskDocuments() {
 				</Form>
 			</div>
 			{folder && (
-				<ParameterDocuments folder={folder} closeModal={closeModal} isCreateDocumentModalVisible={isCreateDocumentModalVisible} />
+				<ParameterDocuments
+					folder={folder}
+					closeModal={closeModal}
+					isCreateDocumentModalVisible={isCreateDocumentModalVisible}
+					onDocumentsUpdated={handleDocumentsUpdated}
+				/>
 			)}
 		</DefaultDoubleSidePage>
 	);

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

@@ -74,7 +74,7 @@ export default function DocumentsReminderHistory(props: IProps) {
 				setTotalPages(totalPages);
 			})
 			.catch((e) => console.warn(e));
-	}, [pageSize]);
+	}, [pageSize, folderUid]);
 
 	const fetchReminders = useCallback(() => {
 		DocumentReminders.getInstance()
@@ -109,7 +109,7 @@ export default function DocumentsReminderHistory(props: IProps) {
 				setReminders(response); // Set the reminders
 			})
 			.catch((e) => console.warn(e));
-	}, [customerOption, page, pageSize]); // Update on page change
+	}, [customerOption, page, pageSize, folderUid]); // Update on page change
 
 	const fetchCustomers = useCallback(async () => {
 		if (!folderUid) return;

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

@@ -41,7 +41,7 @@ export default function ClientBox(props: IProps) {
 			}
 			props.onDelete(customerUid);
 		},
-		[closeDeleteModal, customer.documents, openErrorModal, props],
+		[closeDeleteModal, customer.documents, openErrorModal, props, customer, folderUid],
 	);
 
 	let createOrUpdateNotePath = Module.getInstance()