From 8243e8727154855b8f320e08e07bfd03248baaf1 Mon Sep 17 00:00:00 2001
From: Max S <maxime.sallerin@smart-chain.fr>
Date: Tue, 20 Aug 2024 15:35:35 +0200
Subject: [PATCH] :sparkles integration page received documents

---
 .../Components/Elements/BackArrow/index.tsx   |  3 +-
 .../ReceivedDocuments/classes.module.scss     | 23 ++++++++
 .../ReceivedDocuments/index.tsx               | 59 +++++++++++++++++++
 .../Layouts/ClientDashboard/index.tsx         | 16 ++++-
 src/front/Config/Module/development.json      |  9 +++
 src/front/Config/Module/preprod.json          |  9 +++
 src/front/Config/Module/production.json       |  9 +++
 src/front/Config/Module/staging.json          |  9 +++
 .../[folderUid]/received-documents/index.tsx  |  5 ++
 9 files changed, 138 insertions(+), 4 deletions(-)
 create mode 100644 src/front/Components/Layouts/ClientDashboard/ReceivedDocuments/classes.module.scss
 create mode 100644 src/front/Components/Layouts/ClientDashboard/ReceivedDocuments/index.tsx
 create mode 100644 src/pages/client-dashboard/[folderUid]/received-documents/index.tsx

diff --git a/src/front/Components/Elements/BackArrow/index.tsx b/src/front/Components/Elements/BackArrow/index.tsx
index 8421b1b5..b4714259 100644
--- a/src/front/Components/Elements/BackArrow/index.tsx
+++ b/src/front/Components/Elements/BackArrow/index.tsx
@@ -5,6 +5,7 @@ import React from "react";
 
 type IProps = {
 	url?: string;
+	text?: string;
 };
 
 type IPropsClass = IProps & {
@@ -26,7 +27,7 @@ class BackArrowClass extends React.Component<IPropsClass, IState> {
 				styletype={EButtonstyletype.TEXT}
 				size={EButtonSize.SM}
 				onClick={this.handleClick}>
-				Retour
+				{this.props.text ?? "Retour"}
 			</Button>
 		);
 	}
diff --git a/src/front/Components/Layouts/ClientDashboard/ReceivedDocuments/classes.module.scss b/src/front/Components/Layouts/ClientDashboard/ReceivedDocuments/classes.module.scss
new file mode 100644
index 00000000..62f8849f
--- /dev/null
+++ b/src/front/Components/Layouts/ClientDashboard/ReceivedDocuments/classes.module.scss
@@ -0,0 +1,23 @@
+@import "@Themes/constants.scss";
+
+.root {
+	padding: var(--spacing-3) var(--spacing-15);
+	max-width: 1156px;
+
+	display: flex;
+	flex-direction: column;
+	align-items: flex-start;
+	gap: var(--spacing-xl, 32px);
+
+	.table{	
+		width: 100%;
+	}
+
+	@media screen and (max-width: $screen-m) {
+		padding: var(--spacing-3);
+	}
+
+	@media screen and (max-width: $screen-s) {
+		padding: var(--spacing-2);
+	}
+}
diff --git a/src/front/Components/Layouts/ClientDashboard/ReceivedDocuments/index.tsx b/src/front/Components/Layouts/ClientDashboard/ReceivedDocuments/index.tsx
new file mode 100644
index 00000000..bbd62240
--- /dev/null
+++ b/src/front/Components/Layouts/ClientDashboard/ReceivedDocuments/index.tsx
@@ -0,0 +1,59 @@
+import React from "react";
+
+import classes from "./classes.module.scss";
+import { useRouter } from "next/router";
+
+import Typography, { ETypo, ETypoColor } from "@Front/Components/DesignSystem/Typography";
+import DefaultTemplate from "@Front/Components/LayoutTemplates/DefaultTemplate";
+import Module from "@Front/Config/Module";
+import BackArrow from "@Front/Components/Elements/BackArrow";
+import { ArrowDownTrayIcon } from "@heroicons/react/24/outline";
+import Button, { EButtonSize, EButtonstyletype, EButtonVariant } from "@Front/Components/DesignSystem/Button";
+import { IHead } from "@Front/Components/DesignSystem/Table/MuiTable";
+import Table from "@Front/Components/DesignSystem/Table";
+
+type IProps = {};
+
+const header: readonly IHead[] = [
+	{
+		key: "name",
+		title: "Nom",
+	},
+	{
+		key: "sentAt",
+		title: "Envoyé le",
+	},
+	{
+		key: "actions",
+		title: "Action",
+	},
+];
+
+export default function ReceivedDocuments(props: IProps) {
+	const router = useRouter();
+	let { folderUid } = router.query;
+
+	return (
+		<DefaultTemplate title={"Documents reçus"} isPadding={false}>
+			<div className={classes["root"]}>
+				<BackArrow
+					text="Retour aux dossiers"
+					url={Module.getInstance()
+						.get()
+						.modules.pages.ClientDashboard.props.path.replace("[folderUid]", folderUid as string)}
+				/>
+				<Typography typo={ETypo.TITLE_H1} color={ETypoColor.TEXT_PRIMARY}>
+					Un document vous a été envoyé
+				</Typography>
+				<Table className={classes["table"]} header={header} rows={[{ key: "1", name: "todo", sentAt: "todo", actions: "todo" }]} />
+				<Button
+					variant={EButtonVariant.PRIMARY}
+					size={EButtonSize.LG}
+					styletype={EButtonstyletype.CONTAINED}
+					leftIcon={<ArrowDownTrayIcon />}>
+					Tout télécharger
+				</Button>
+			</div>
+		</DefaultTemplate>
+	);
+}
diff --git a/src/front/Components/Layouts/ClientDashboard/index.tsx b/src/front/Components/Layouts/ClientDashboard/index.tsx
index 84e097c5..d1fe593d 100644
--- a/src/front/Components/Layouts/ClientDashboard/index.tsx
+++ b/src/front/Components/Layouts/ClientDashboard/index.tsx
@@ -19,6 +19,8 @@ import ContactBox from "@Front/Components/Elements/ContactBox";
 import Button, { EButtonSize, EButtonstyletype, EButtonVariant } from "@Front/Components/DesignSystem/Button";
 import { ArrowDownTrayIcon } from "@heroicons/react/24/outline";
 import DepositDocumentComponent from "./DepositDocumentComponent";
+import Link from "next/link";
+import Module from "@Front/Config/Module";
 
 type IProps = {};
 
@@ -169,9 +171,17 @@ export default function ClientDashboard(props: IProps) {
 								Télécharger le RIB
 							</Button>
 						)}
-						<Button fullwidth variant={EButtonVariant.PRIMARY} size={EButtonSize.LG} styletype={EButtonstyletype.OUTLINED}>
-							Voir les documents reçus
-						</Button>
+						<Link
+							href={Module.getInstance()
+								.get()
+								.modules.pages.ClientDashboard.pages.ReceiveDocuments.props.path.replace(
+									"[folderUid]",
+									folderUid as string,
+								)}>
+							<Button fullwidth variant={EButtonVariant.PRIMARY} size={EButtonSize.LG} styletype={EButtonstyletype.OUTLINED}>
+								Voir les documents reçus
+							</Button>
+						</Link>
 					</div>
 					<div className={classes["documents"]}>
 						<Typography typo={ETypo.TEXT_LG_BOLD} color={ETypoColor.TABLE_COLUMN_CONTRAST}>
diff --git a/src/front/Config/Module/development.json b/src/front/Config/Module/development.json
index b3d4b6d1..89703255 100644
--- a/src/front/Config/Module/development.json
+++ b/src/front/Config/Module/development.json
@@ -36,6 +36,15 @@
 				"props": {
 					"path": "/client-dashboard/[folderUid]",
 					"labelKey": "client-dashboard"
+				},
+				"pages": {
+					"ReceiveDocuments": {
+						"enabled": true,
+						"props": {
+							"path": "/client-dashboard/[folderUid]/received-documents",
+							"labelKey": "received_documents"
+						}
+					}
 				}
 			},
 			"Folder": {
diff --git a/src/front/Config/Module/preprod.json b/src/front/Config/Module/preprod.json
index b3d4b6d1..89703255 100644
--- a/src/front/Config/Module/preprod.json
+++ b/src/front/Config/Module/preprod.json
@@ -36,6 +36,15 @@
 				"props": {
 					"path": "/client-dashboard/[folderUid]",
 					"labelKey": "client-dashboard"
+				},
+				"pages": {
+					"ReceiveDocuments": {
+						"enabled": true,
+						"props": {
+							"path": "/client-dashboard/[folderUid]/received-documents",
+							"labelKey": "received_documents"
+						}
+					}
 				}
 			},
 			"Folder": {
diff --git a/src/front/Config/Module/production.json b/src/front/Config/Module/production.json
index b3d4b6d1..89703255 100644
--- a/src/front/Config/Module/production.json
+++ b/src/front/Config/Module/production.json
@@ -36,6 +36,15 @@
 				"props": {
 					"path": "/client-dashboard/[folderUid]",
 					"labelKey": "client-dashboard"
+				},
+				"pages": {
+					"ReceiveDocuments": {
+						"enabled": true,
+						"props": {
+							"path": "/client-dashboard/[folderUid]/received-documents",
+							"labelKey": "received_documents"
+						}
+					}
 				}
 			},
 			"Folder": {
diff --git a/src/front/Config/Module/staging.json b/src/front/Config/Module/staging.json
index b3d4b6d1..89703255 100644
--- a/src/front/Config/Module/staging.json
+++ b/src/front/Config/Module/staging.json
@@ -36,6 +36,15 @@
 				"props": {
 					"path": "/client-dashboard/[folderUid]",
 					"labelKey": "client-dashboard"
+				},
+				"pages": {
+					"ReceiveDocuments": {
+						"enabled": true,
+						"props": {
+							"path": "/client-dashboard/[folderUid]/received-documents",
+							"labelKey": "received_documents"
+						}
+					}
 				}
 			},
 			"Folder": {
diff --git a/src/pages/client-dashboard/[folderUid]/received-documents/index.tsx b/src/pages/client-dashboard/[folderUid]/received-documents/index.tsx
new file mode 100644
index 00000000..d4856fbc
--- /dev/null
+++ b/src/pages/client-dashboard/[folderUid]/received-documents/index.tsx
@@ -0,0 +1,5 @@
+import ReceivedDocuments from "@Front/Components/Layouts/ClientDashboard/ReceivedDocuments";
+
+export default function Route() {
+	return <ReceivedDocuments />;
+}