From e9b67d48c159c14890500a1ebf831b83b7884e58 Mon Sep 17 00:00:00 2001
From: Max S <maxime.sallerin@smart-chain.fr>
Date: Mon, 16 Sep 2024 18:05:58 +0200
Subject: [PATCH] :sparkles: add hours reminder document history

---
 .../DesignSystem/Table/MuiTable/index.tsx     |  8 +++++++-
 .../Folder/DocumentsReminderHistory/index.tsx | 20 ++++++++++++++++---
 .../ClientView/EmailReminder/index.tsx        | 12 +++++++++--
 3 files changed, 34 insertions(+), 6 deletions(-)

diff --git a/src/front/Components/DesignSystem/Table/MuiTable/index.tsx b/src/front/Components/DesignSystem/Table/MuiTable/index.tsx
index c7fb8e0e..6e5a360b 100644
--- a/src/front/Components/DesignSystem/Table/MuiTable/index.tsx
+++ b/src/front/Components/DesignSystem/Table/MuiTable/index.tsx
@@ -55,7 +55,13 @@ export default function MuiTable(props: IProps) {
 				className={classes["root"]}
 				sx={{ maxHeight: "80vh", overflowY: "auto", overflowX: "hidden", backgroundColor: "var(--table-background-default)" }}>
 				<Table aria-label="simple table" sx={{ border: "0" }}>
-					<TableHead sx={{ position: "sticky", top: "0", borderBottom: "1px solid var(--table-header-border)" }}>
+					<TableHead
+						sx={{
+							position: "sticky",
+							top: "0",
+							borderBottom: "1px solid var(--table-header-border)",
+							backgroundColor: "var(--table-background-default)",
+						}}>
 						<TableRow>
 							{props.header.map((column) => (
 								<TableCell key={column.key} align={"left"} sx={{ border: 0, padding: "4px 8px" }}>
diff --git a/src/front/Components/Layouts/Folder/DocumentsReminderHistory/index.tsx b/src/front/Components/Layouts/Folder/DocumentsReminderHistory/index.tsx
index 47d7177d..3331e2ff 100644
--- a/src/front/Components/Layouts/Folder/DocumentsReminderHistory/index.tsx
+++ b/src/front/Components/Layouts/Folder/DocumentsReminderHistory/index.tsx
@@ -145,10 +145,13 @@ function buildRows(reminders: DocumentReminder[] | null): IRowProps[] {
 	if (!reminders) return [];
 	return reminders.map((reminder) => ({
 		key: reminder.uid ?? "",
-		remindedAt: new Date(reminder.reminder_date!).toLocaleDateString(),
-		customer: `${reminder.document?.depositor?.contact?.first_name} ${reminder.document?.depositor?.contact?.last_name}`,
+		remindedAt: { sx: { width: 220 }, content: formatDateWithHours(reminder.reminder_date) },
+		customer: {
+			sx: { width: 220 },
+			content: `${reminder.document?.depositor?.contact?.first_name} ${reminder.document?.depositor?.contact?.last_name}`,
+		},
 		document_type: reminder.document?.document_type?.name,
-		statut: getTag(reminder.document?.document_status as EDocumentStatus),
+		statut: { sx: { width: 220 }, content: getTag(reminder.document?.document_status as EDocumentStatus) },
 	}));
 }
 
@@ -166,3 +169,14 @@ function getTag(status: EDocumentStatus) {
 			return <Tag label={tradDocumentStatus[status]} color={ETagColor.INFO} variant={ETagVariant.SEMI_BOLD} />;
 	}
 }
+
+function formatDateWithHours(date: Date | null) {
+	if (!date) return "-";
+	return new Date(date).toLocaleDateString("fr-FR", {
+		year: "numeric",
+		month: "2-digit",
+		day: "2-digit",
+		hour: "2-digit",
+		minute: "2-digit",
+	});
+}
diff --git a/src/front/Components/Layouts/Folder/FolderInformation/ClientView/EmailReminder/index.tsx b/src/front/Components/Layouts/Folder/FolderInformation/ClientView/EmailReminder/index.tsx
index 9992aa4e..5412078f 100644
--- a/src/front/Components/Layouts/Folder/FolderInformation/ClientView/EmailReminder/index.tsx
+++ b/src/front/Components/Layouts/Folder/FolderInformation/ClientView/EmailReminder/index.tsx
@@ -95,8 +95,7 @@ export default function EmailReminder(props: IProps) {
 				</Link>
 				<div className={classes["info"]}>
 					<Typography typo={ETypo.TEXT_XS_REGULAR} color={ETypoColor.TEXT_SECONDARY}>
-						Dernière relance:{" "}
-						{reminders && remindersLength > 0 ? new Date(reminders[0]!.reminder_date!).toLocaleDateString() : "-"}
+						Dernière relance: {reminders && remindersLength > 0 ? formatDateWithHours(reminders[0]!.reminder_date) : "-"}
 					</Typography>
 					<Typography typo={ETypo.TEXT_XS_REGULAR} color={ETypoColor.TEXT_SECONDARY}>
 						Nombre de relance: {remindersLength}
@@ -107,3 +106,12 @@ export default function EmailReminder(props: IProps) {
 		</div>
 	);
 }
+
+function formatDateWithHours(date: Date | null) {
+	if (!date) return "-";
+	return new Date(date).toLocaleDateString("fr-FR", {
+		year: "numeric",
+		month: "2-digit",
+		day: "2-digit",
+	});
+}