renaming url and page modify-description

src/front/Components/DesignSystem/FolderBoxInformation/classes.module.scss

@@ -46,9 +46,10 @@
 	@media (max-width: $screen-s) {
 		flex-wrap: wrap;
 
-		.edit-icon {
+		.edit-icon-container {
 			margin-left: 0px;
 			margin-top: 24px;
 		}
 	}
+
 }

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

@@ -15,8 +15,8 @@ type IProps = {
 export default function FolderBoxInformation(props: IProps) {
 	const { isDescription = false } = props;
 	const path = isDescription
-		? "/dossier/".concat(props.folder.uid).concat("/todo")
-		: "/dossier/".concat(props.folder.uid).concat("/modifier");
+		? "/folder/".concat(props.folder.uid).concat("/update-description")
+		: "/folder/".concat(props.folder.uid).concat("/update-metadata");
 
 	return (
 		<div className={classNames(classes["root"], isDescription && classes["isSignleDescription"])}>

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

@@ -19,7 +19,7 @@ export default class FolderList extends React.Component<IProps, IState> {
 				{this.props.folders.map((folder) => {
 					return (
 						<div onClick={this.props.onCloseLeftSide} key={folder.uid}>
-							<Link href={"/dossier/".concat(folder.uid)}>
+							<Link href={"/folder/".concat(folder.uid)}>
 								<FolderContainer folder={folder} onSelectedFolder={this.props.onSelectedFolder} />;
 							</Link>
 						</div>

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

@@ -26,6 +26,7 @@ export default class FolderListContainer extends React.Component<IProps, IState>
 	}
 
 	public override render(): JSX.Element {
+		const navigatePath = "/folder/create";
 		return (
 			<div className={classes["root"]}>
 				<div>
@@ -39,7 +40,7 @@ export default class FolderListContainer extends React.Component<IProps, IState>
 					/>
 				</div>
 				<div>
-					<Link href={"/dossier/creer-dossier"}>
+					<Link href={navigatePath}>
 						<Button fullwidth={true}>Créer un dossier</Button>
 					</Link>
 				</div>

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

@@ -42,11 +42,12 @@ class AddClientToFolderClass extends BasePage<IProps, IState> {
 			{ value: "rijgreipgje", label: "jane Doe" },
 			{ value: "gipjerpogkzfe", label: "Marcelino Doe" },
 		];
+		const backwardPath = "/folder/".concat(this.props.selectedFolderUid);
 		return (
 			<DefaultNotaryDashboard title={"Ajouter client(s)"} onSelectedFolder={this.onSelectedFolder}>
 				<div className={classes["root"]}>
 					<div className={classes["back-arrow"]}>
-						<BackArrow url={"/dossier/".concat(this.props.selectedFolderUid)} />
+						<BackArrow url={backwardPath} />
 					</div>
 					<Typography typo={ITypo.H1Bis}>Associer un ou plusieurs client(s)</Typography>
 					<Form>

src/front/Components/Layouts/Folder/FolderInformation/ClientSection/index.tsx

@@ -14,12 +14,13 @@ type IState = {};
 
 export default class ClientSection extends React.Component<IProps, IState> {
 	public override render(): JSX.Element {
+		const navigatePath = "/folder/".concat(this.props.folder.uid).concat("/ajouter-client");
 		return (
 			<div className={classes["root"]}>
 				{this.doesFolderHaveCustomer() ? (
 					<>
 						<div className={classes["client"]}>{this.renderCustomerFolders()}</div>
-						<Link href={"/dossier/".concat(this.props.folder.uid).concat("/ajouter-client")}>
+						<Link href={navigatePath}>
 							<Button variant={EButtonVariant.LINE} icon={PlusIcon}>
 								Ajouter un client
 							</Button>
@@ -32,7 +33,7 @@ export default class ClientSection extends React.Component<IProps, IState> {
 								Aucun client n’est associé au dossier.
 							</Typography>
 						</div>
-						<Link href={"/dossier/".concat(this.props.folder.uid).concat("/ajouter-client")}>
+						<Link href={navigatePath}>
 							<Button variant={EButtonVariant.LINE} icon={PlusIcon}>
 								Ajouter un client
 							</Button>

src/front/Components/Layouts/Folder/UpdateFolderDescription/classes.module.scss

@@ -0,0 +1,56 @@
+@import "@Themes/constants.scss";
+
+.root {
+	display: flex;
+	flex-direction: column;
+	min-height: 100%;
+	align-items: flex-start;
+	width: fit-content;
+
+	.back-arrow {
+		margin-bottom: 24px;
+	}
+
+	.form {
+		width: 100%;
+
+		.content {
+			margin-top: 32px;
+
+			>:not(:last-child) {
+				margin-bottom: 24px;
+			}
+
+		}
+
+		.button-container {
+			width: 100%;
+			display: flex;
+			text-align: center;
+			margin-top: 24px;
+
+			.cancel-button {
+				display: flex;
+				margin-right: 12px;
+			}
+
+			@media (max-width: $screen-m) {
+				display: flex;
+				flex-direction: column-reverse;
+
+				.cancel-button {
+					margin-left: 0;
+					margin-top: 12px;
+
+					>* {
+						flex: 1;
+					}
+				}
+
+				>* {
+					width: 100%;
+				}
+			}
+		}
+	}
+}

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

@@ -0,0 +1,64 @@
+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 DefaultNotaryDashboard, { IDashBoardFolder } from "@Front/Components/LayoutTemplates/DefaultNotaryDashboard";
+import { useRouter } from "next/router";
+
+import BasePage from "../../Base";
+import classes from "./classes.module.scss";
+import Link from "next/link";
+
+type IProps = {
+	selectedFolderUid: string;
+};
+type IState = {
+	selectedFolder: IDashBoardFolder | null;
+};
+class UpdateFolderDescriptionClass extends BasePage<IProps, IState> {
+	constructor(props: IProps) {
+		super(props);
+		this.state = {
+			selectedFolder: null,
+		};
+		this.onSelectedFolder = this.onSelectedFolder.bind(this);
+	}
+	public override render(): JSX.Element {
+		const backwardPath = "/folder/".concat(this.props.selectedFolderUid);
+		return (
+			<DefaultNotaryDashboard title={"Ajouter client(s)"} onSelectedFolder={this.onSelectedFolder}>
+				<div className={classes["root"]}>
+					<div className={classes["back-arrow"]}>
+						<BackArrow url={backwardPath} />
+					</div>
+					<Typography typo={ITypo.H1Bis}>Modifier la note du dossier</Typography>
+
+					<Form className={classes["form"]}>
+						<div className={classes["content"]}>
+							<InputField name="input field" fakeplaceholder="Intitulé du dossier" textarea />
+						</div>
+
+						<div className={classes["button-container"]}>
+							<Link href={backwardPath} className={classes["cancel-button"]}>
+								<Button variant={EButtonVariant.GHOST}>Annuler</Button>
+							</Link>
+							<Button type="submit">Enregistrer</Button>
+						</div>
+					</Form>
+				</div>
+			</DefaultNotaryDashboard>
+		);
+	}
+
+	private onSelectedFolder(folder: IDashBoardFolder): void {
+		this.setState({ selectedFolder: folder });
+	}
+}
+
+export default function UpdateFolderDescription() {
+	const router = useRouter();
+	let { uid } = router.query;
+	uid = uid as string;
+	return <UpdateFolderDescriptionClass selectedFolderUid={uid} />;
+}

src/front/Components/Layouts/Folder/UpdateFolderMetadata/classes.module.scss

@@ -5,11 +5,15 @@
 	flex-direction: column;
 	min-height: 100%;
 	align-items: flex-start;
+	width: fit-content;
 
 	.back-arrow {
 		margin-bottom: 24px;
 	}
 
+	.form {
+		width: 100%;
+
 		.content {
 			margin-top: 32px;
 
@@ -20,10 +24,33 @@
 		}
 
 		.button-container {
+			width: 100%;
+			display: flex;
+			text-align: center;
 			margin-top: 24px;
 
-		:first-child {
-			margin-right: 32px;
+			.cancel-button {
+				display: flex;
+				margin-right: 12px;
+			}
+
+			@media (max-width: $screen-m) {
+				display: flex;
+				flex-direction: column-reverse;
+
+				.cancel-button {
+					margin-left: 0;
+					margin-top: 12px;
+
+					>* {
+						flex: 1;
+					}
+				}
+
+				>* {
+					width: 100%;
+				}
+			}
 		}
 	}
 }

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

@@ -9,6 +9,7 @@ import { useRouter } from "next/router";
 
 import BasePage from "../../Base";
 import classes from "./classes.module.scss";
+import Link from "next/link";
 
 type IProps = {
 	selectedFolderUid: string;
@@ -32,16 +33,16 @@ class UpdateFolderMetadataClass extends BasePage<IProps, IState> {
 			{ value: "adazzqsdaad", label: "Vente immobilière" },
 			{ value: "adazzqsdaad", label: "Acte de divorce" },
 		];
-
+		const backwardPath = "/folder/".concat(this.props.selectedFolderUid);
 		return (
 			<DefaultNotaryDashboard title={"Ajouter client(s)"} onSelectedFolder={this.onSelectedFolder}>
 				<div className={classes["root"]}>
 					<div className={classes["back-arrow"]}>
-						<BackArrow url={"/dossier/".concat(this.props.selectedFolderUid)} />
+						<BackArrow url={backwardPath} />
 					</div>
 					<Typography typo={ITypo.H1Bis}>Modifier les informations du dossier</Typography>
 
-					<Form>
+					<Form className={classes["form"]}>
 						<div className={classes["content"]}>
 							<InputField name="input field" fakeplaceholder="Intitulé du dossier" />
 							<InputField name="input field" fakeplaceholder="Numéro de dossier" />
@@ -55,7 +56,9 @@ class UpdateFolderMetadataClass extends BasePage<IProps, IState> {
 						</div>
 
 						<div className={classes["button-container"]}>
+							<Link href={backwardPath} className={classes["cancel-button"]}>
 								<Button variant={EButtonVariant.GHOST}>Annuler</Button>
+							</Link>
 							<Button type="submit">Enregistrer</Button>
 						</div>
 					</Form>

src/pages/folder/[uid]/update-description.tsx

@@ -0,0 +1,5 @@
+import UpdateFolderDescription from "@Front/Components/Layouts/Folder/UpdateFolderDescription";
+
+export default function Route() {
+	return <UpdateFolderDescription />;
+}