From fd2a9573e2e2199ba200a6c41ec365aca543ae08 Mon Sep 17 00:00:00 2001
From: Vincent Alamelle <vincent.alamelle@smart-chain.fr>
Date: Wed, 3 May 2023 13:14:56 +0200
Subject: [PATCH] Feature update folder description

---
 .../Folder/UpdateFolderDescription/index.tsx  | 64 ++++++++++++-------
 1 file changed, 41 insertions(+), 23 deletions(-)

diff --git a/src/front/Components/Layouts/Folder/UpdateFolderDescription/index.tsx b/src/front/Components/Layouts/Folder/UpdateFolderDescription/index.tsx
index 54568d25..33e8fa64 100644
--- a/src/front/Components/Layouts/Folder/UpdateFolderDescription/index.tsx
+++ b/src/front/Components/Layouts/Folder/UpdateFolderDescription/index.tsx
@@ -1,50 +1,58 @@
+import "reflect-metadata";
 import Button, { EButtonVariant } from "@Front/Components/DesignSystem/Button";
 import Form from "@Front/Components/DesignSystem/Form";
 import InputField from "@Front/Components/DesignSystem/Form/Elements/InputField";
 import Typography, { ITypo } from "@Front/Components/DesignSystem/Typography";
 import BackArrow from "@Front/Components/Elements/BackArrow";
-import { folders } from "@Front/Components/Layouts/DesignSystem/dummyData";
 import DefaultNotaryDashboard, { IDashBoardFolder } from "@Front/Components/LayoutTemplates/DefaultNotaryDashboard";
 import Module from "@Front/Config/Module";
 import Link from "next/link";
-import { useRouter } from "next/router";
+import { NextRouter, useRouter } from "next/router";
 
 import BasePage from "../../Base";
 import classes from "./classes.module.scss";
+import Folders from "@Front/Api/LeCoffreApi/SuperAdmin/Folders/Folders";
 
-type IProps = {
+type IProps = {};
+
+type IPropsClass = IProps & {
+	folderUid: string;
+	router: NextRouter;
+};
+
+type IState = {
 	folder: IDashBoardFolder | null;
 };
-type IState = {
-	selectedFolder: IDashBoardFolder | null;
-};
-class UpdateFolderDescriptionClass extends BasePage<IProps, IState> {
-	constructor(props: IProps) {
+class UpdateFolderDescriptionClass extends BasePage<IPropsClass, IState> {
+	private backwardPath = Module.getInstance().get().modules.pages.Folder.pages.FolderInformation.props.path.replace("[folderUid]", this.props.folderUid);
+	constructor(props: IPropsClass) {
 		super(props);
 		this.state = {
-			selectedFolder: null,
+			folder: null,
 		};
-		this.onSelectedFolder = this.onSelectedFolder.bind(this);
+		this.onFormSubmit = this.onFormSubmit.bind(this);
 	}
 	public override render(): JSX.Element {
-		const backwardPath = Module.getInstance()
-			.get()
-			.modules.pages.Folder.pages.FolderInformation.props.path.replace("[folderUid]", this.props.folder?.uid ?? "");
 		return (
-			<DefaultNotaryDashboard title={"Ajouter client(s)"} onSelectedFolder={this.onSelectedFolder}>
+			<DefaultNotaryDashboard title={"Ajouter client(s)"}>
 				<div className={classes["root"]}>
 					<div className={classes["back-arrow"]}>
-						<BackArrow url={backwardPath} />
+						<BackArrow url={this.backwardPath} />
 					</div>
 					<Typography typo={ITypo.H1Bis}>Modifier la note du dossier</Typography>
 
-					<Form className={classes["form"]}>
+					<Form className={classes["form"]} onSubmit={this.onFormSubmit}>
 						<div className={classes["content"]}>
-							<InputField name="input field" fakeplaceholder="Note du dossier" textarea defaultValue={this.props.folder?.description ?? ""} />
+							<InputField
+								name="description"
+								fakeplaceholder="Note du dossier"
+								textarea
+								defaultValue={this.state.folder?.description ?? ""}
+							/>
 						</div>
 
 						<div className={classes["button-container"]}>
-							<Link href={backwardPath} className={classes["cancel-button"]}>
+							<Link href={this.backwardPath} className={classes["cancel-button"]}>
 								<Button variant={EButtonVariant.GHOST}>Annuler</Button>
 							</Link>
 							<Button type="submit">Enregistrer</Button>
@@ -55,15 +63,25 @@ class UpdateFolderDescriptionClass extends BasePage<IProps, IState> {
 		);
 	}
 
-	private onSelectedFolder(folder: IDashBoardFolder): void {
-		this.setState({ selectedFolder: folder });
+	public override async componentDidMount() {
+		const folder = await Folders.getInstance().getByUid(this.props.folderUid);
+		this.setState({ folder });
+	}
+
+	private async onFormSubmit(e: React.FormEvent<HTMLFormElement> | null, values: { [key: string]: string }) {
+		try {
+			await Folders.getInstance().put(this.props.folderUid, values);
+			this.props.router.push(this.backwardPath);
+		} catch (error) {
+			console.error(error)	
+		}
 	}
 }
 
-export default function UpdateFolderDescription() {
+export default function UpdateFolderDescription(props: IProps) {
 	const router = useRouter();
 	let { folderUid } = router.query;
 	folderUid = folderUid as string;
-	const folder = folders.find((folder) => folder.uid === folderUid) ?? null;
-	return <UpdateFolderDescriptionClass folder={folder} />;
+
+	return <UpdateFolderDescriptionClass folderUid={folderUid} router={router} />;
 }