Merge branch 'dev' into staging

devops/ppd.values.yaml

@@ -1,6 +1,6 @@
 dockerPullSecret: docker-pull-secret
 
-scwSecretKey: AgCgjF5QEzxT3GYTS5B6cmQ0e+0/qFWzKaUDSi+Vjc7RoameuvaIJvTXMBkS3he1oy1ulbB34v6vpZI2kxnGNqERA/U5BaYDAyfKSBwMAy4br7HVKhhuwkoF5qoG5JzJXseSmqB1U9vncVIGOZWzJc1Y4/eGlWcvLcLyfw2z/WEpyeNiWJfEhTYpJOB7gv0XnRb2U/JM3jRy1QgEUIk1WR6kgBalF+xaczPQ6uKh+PR2pqkbZa3WaKUrddmzNsgEz4d8PZMWt8IBwR2JOQEHUqCd34p/pJNyLdUgcdDhg02DKwn1oRoAxKTbAio/a7WrMbodjCb3TNWIYGal5mFmItZ7Ok/EBmUf4E85eOkTR+j8ynuuiexld3Q5Kw3o8LsHjgzVL9uP+T2rYaKkjtVt+YQRX1U8l9CrsdUEz0/wEBA0jwCWMfnh1qhD5pM/xwwjsEEAcK4rYV+Q7iAgGZZvZBCQ5aEHzrtn5D95tr1GZCV2hmrW6Seu+LKKLVBS1JmsuEsOuhudYsEK9m2RYVcxbjuS5eokKEjNrGobf2oB8rhBByavfw1JTBixR5JrI8lcYlnCa+oEhxXKJY+4Fx5SAB4YaLCMSo5vw6zsFQ3WKQzlEmCFt+EnapS+a+MGrdlwq07OHTDpvgk/1z39hopoCuhhKckGGfErLXsTYQvDOkFu+EPzgY7m7qDw/d9pSiht5tuSOkAqeOgm7tpNkUufZhaXmP+1aT7i+H5gq1JILGAmXzTI5Wc=
+scwSecretKey: AgChoEnPitXp4Ny/rVMEcevaWKNVpyj2cJYAcq+yFqKwVwnLB+ffDvwqz9XBHu+6d4Nyyjkf37zUAMoaM21lEDWA7x3zfG2/D/j+rvX1qxzZgLD0mjBk7fGElVm332I6JA83oInes8AMMYEDPLElzHnpKRb9KtkIP4NzgOcCeW0ijft3N7Vroez6LEHsBPCA1I9XjKSkGEDvrO0MhWX3iJOlfz+SPMfJAV7rPawOs0ZmohTHrPW8qIvGDn8HCzKyU8zRBoMt+Ogpf5pH4U3JryEFuqD61KAQgablAM8edPIvsgNno9HAEuC2QtRLYA9aUhuKdaKuS58c9P2E80PHWXIlbpFCg6EugQTgNfnYp+3qDUNz8edeCfapYLvF4s9eCMGyMsGnpDR8EDNOyuGy7Y3l7okX8Xqu464gMp9E+hX7bHkcD6a4xfyIgJcWxsku0tm1TH1dpn4M1UXRuyZZif8P08nuE6MTUL67sAR9J1lpn4lVEL4kflk0pP2tZ5ncgPQFafJrRz05krMb0eU5tb2H4gs7ao/LL6idWo8MM9K1yr8lIuT5x2WW5CX+RjA+i50ex114V6vX3PNP5oVyt+DynTUB9QmXzVm3oLfDc3Cae1uqh7X0CFd+xiztJBtg0VtJaD/xUJcuWfY4cV2lERo9fRrykltzlJqiXHO4nowt8OtN0BcViVV8NJhPhYFzyb4ympxpOlTjm3GETuT2TYhUqdgS9nzleEAbOmOHZdIO2COunPE=
 
 lecoffreFront:
     serviceAccountName: lecoffre-front-sa

src/front/Api/LeCoffreApi/Admin/OfficeRoles/OfficeRoles.ts

@@ -13,6 +13,11 @@ export type IPutRoleParams = {
 	rules: OfficeRole["rules"];
 };
 
+export type IPostRoleParams = {
+	name: OfficeRole["name"];
+	office: OfficeRole["office"];
+};
+
 export default class OfficeRoles extends BaseAdmin {
 	private static instance: OfficeRoles;
 	private readonly baseURl = this.namespaceUrl.concat("/office-roles");
@@ -63,4 +68,14 @@ export default class OfficeRoles extends BaseAdmin {
 			return Promise.reject(err);
 		}
 	}
+
+	public async post(body: IPostRoleParams) {
+		const url = new URL(this.baseURl);
+		try {
+			return await this.postRequest<OfficeRole>(url, body);
+		} catch (err) {
+			this.onError(err);
+			return Promise.reject(err);
+		}
+	}
 }

src/front/Api/LeCoffreApi/Admin/Roles/Roles.ts

@@ -13,6 +13,9 @@ export type IPutRoleParams = {
 	rules: Role["rules"];
 };
 
+export type IPostRoleParams = {
+	name: Role["name"];
+};
 export default class Roles extends BaseAdmin {
 	private static instance: Roles;
 	private readonly baseURl = this.namespaceUrl.concat("/roles");
@@ -43,6 +46,16 @@ export default class Roles extends BaseAdmin {
 		}
 	}
 
+	public async post(body: IPostRoleParams) {
+		const url = new URL(this.baseURl);
+		try {
+			return await this.postRequest<Role>(url, body);
+		} catch (err) {
+			this.onError(err);
+			return Promise.reject(err);
+		}
+	}
+
 	public async getOne(q?: IGetRolesParams): Promise<Role | null> {
 		const url = new URL(this.baseURl);
 		if (q) {

src/front/Components/DesignSystem/Header/Notifications/NotificationModal/index.tsx

@@ -32,7 +32,7 @@ export default class NotificationModal extends React.Component<IProps, IState> {
 				<div className={classes["background"]} onClick={this.props.closeModal} />
 				<div className={classes["root"]}>
 					<div className={classes["notification-header"]}>
-						<Typography typo={ITypo.P_16}>Notifications</Typography>
+						<Typography typo={ITypo.P_SB_16}>Notifications</Typography>
 						<div className={classes["close-icon"]} onClick={this.props.closeModal}>
 							<Image src={CloseIcon} alt="Close notification modal" className={classes["close-icon"]}></Image>
 						</div>

src/front/Components/LayoutTemplates/DefaultOfficeDashboard/OfficeListContainer/index.tsx

@@ -43,7 +43,7 @@ export default function OfficeListContainer(props: IProps) {
 		<div className={classes["root"]}>
 			<div className={classes["header"]}>
 				<div className={classes["searchbar"]}>
-					<SearchBar onChange={filterOffices} placeholder="Chercher un utilisateur" />
+					<SearchBar onChange={filterOffices} placeholder="Chercher un office" />
 				</div>
 				<div className={classes["folderlist-container"]}>
 					<BlockList

src/front/Components/LayoutTemplates/DefaultRoleDashboard/RoleListContainer/classes.module.scss

@@ -15,8 +15,8 @@
 	}
 
 	.folderlist-container {
-		max-height: 100vh;
+		max-height: calc(100vh - 290px);
-		height: 100vh;
+		height: calc(100vh - 290px);
 		overflow: auto;
 		border-right: 1px solid var(--grey-medium);
 	}

src/front/Components/LayoutTemplates/DefaultRoleDashboard/RoleListContainer/index.tsx

@@ -6,6 +6,8 @@ import { useRouter } from "next/router";
 import React, { useCallback, useState } from "react";
 
 import classes from "./classes.module.scss";
+import Link from "next/link";
+import Button from "@Front/Components/DesignSystem/Button";
 
 type IProps = {
 	roles: OfficeRole[];
@@ -62,6 +64,11 @@ export default function RoleListContainer(props: IProps) {
 					/>
 				</div>
 			</div>
+			<div>
+				<Link href={Module.getInstance().get().modules.pages.Roles.pages.Create.props.path}>
+					<Button fullwidth={true}>Créer un rôle</Button>
+				</Link>
+			</div>
 		</div>
 	);
 }

src/front/Components/Layouts/DeedTypes/DeedTypesInformations/index.tsx

@@ -142,7 +142,7 @@ export default function DeedTypesInformations(props: IProps) {
 						<div className={classes["documents"]}>
 							<MultiSelect
 								options={formattedOptions}
-								placeholder="Type de document"
+								placeholder="Cliquez pour sélectionner des documents"
 								onChange={onDocumentChangeHandler}
 								defaultValue={selectedDocuments}
 							/>

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

@@ -15,7 +15,7 @@ export default class Offices extends BasePage<IProps, IState> {
 						<Typography typo={ITypo.H1Bis}>Informations des offices</Typography>
 						<div className={classes["choose-a-folder"]}>
 							<Typography typo={ITypo.P_18} color={ITypoColor.GREY}>
-								Sélectionnez une office
+								Sélectionnez un office
 							</Typography>
 						</div>
 					</div>

src/front/Components/Layouts/Roles/RolesCreate/classes.module.scss

@@ -0,0 +1,24 @@
+@import "@Themes/constants.scss";
+
+.root {
+	.header {
+		margin-top: 24px;
+	}
+
+	.form-container {
+		margin-top: 32px;
+		display: flex;
+		flex-direction: column;
+		gap: 32px;
+	}
+
+	.buttons-container {
+		display: flex;
+		gap: 32px;
+
+		@media (max-width: $screen-s) {
+			flex-direction: column-reverse;
+			gap: 16px;
+		}
+	}
+}

src/front/Components/Layouts/Roles/RolesCreate/index.tsx

@@ -0,0 +1,95 @@
+import OfficeRoles from "@Front/Api/LeCoffreApi/Admin/OfficeRoles/OfficeRoles";
+import Button, { EButtonVariant } from "@Front/Components/DesignSystem/Button";
+import Form from "@Front/Components/DesignSystem/Form";
+import TextField from "@Front/Components/DesignSystem/Form/TextField";
+import Confirm from "@Front/Components/DesignSystem/Modal/Confirm";
+import Typography, { ITypo } from "@Front/Components/DesignSystem/Typography";
+import DefaultRolesDashboard from "@Front/Components/LayoutTemplates/DefaultRoleDashboard";
+import Module from "@Front/Config/Module";
+import { Office, OfficeRole } from "le-coffre-resources/dist/Admin";
+import { useRouter } from "next/router";
+import { useCallback, useState } from "react";
+
+import classes from "./classes.module.scss";
+import JwtService from "@Front/Services/JwtService/JwtService";
+
+type IProps = {};
+export default function RolesCreate(props: IProps) {
+	const [hasChanged, setHasChanged] = useState<boolean>(false);
+	const [isConfirmModalVisible, setIsConfirmModalVisible] = useState<boolean>(false);
+
+	const router = useRouter();
+	const onSubmitHandler = useCallback(
+		async (e: React.FormEvent<HTMLFormElement> | null, values: { [key: string]: string }) => {
+			try {
+				const jwt = JwtService.getInstance().decodeJwt();
+				const role = await OfficeRoles.getInstance().post(
+					OfficeRole.hydrate<OfficeRole>({
+						name: values["name"],
+						office: Office.hydrate<Office>({
+							uid: jwt?.office_Id,
+						}),
+					}),
+				);
+
+				router.push(Module.getInstance().get().modules.pages.Roles.pages.RolesInformations.props.path.replace("[uid]", role.uid!));
+			} catch (e) {
+				console.error(e);
+			}
+		},
+		[router],
+	);
+
+	const closeConfirmModal = useCallback(() => {
+		setIsConfirmModalVisible(false);
+	}, []);
+
+	const onFieldChange = useCallback((name: string, field: any) => {
+		setHasChanged(true);
+	}, []);
+
+	const redirect = useCallback(() => {
+		router.push(Module.getInstance().get().modules.pages.Roles.props.path);
+	}, [router]);
+
+	const onCancel = useCallback(() => {
+		if (hasChanged) {
+			setIsConfirmModalVisible(true);
+		} else {
+			redirect();
+		}
+	}, [hasChanged, redirect]);
+
+	return (
+		<DefaultRolesDashboard mobileBackText={"Liste des rôles"} hasBackArrow title="Créer un rôle">
+			<div className={classes["root"]}>
+				<div className={classes["header"]}>
+					<Typography typo={ITypo.H1Bis}>Créer un rôle</Typography>
+				</div>
+				<Form onSubmit={onSubmitHandler} className={classes["form-container"]} onFieldChange={onFieldChange}>
+					<TextField name="name" placeholder="Nom du rôle" />
+					<div className={classes["buttons-container"]}>
+						<Button variant={EButtonVariant.GHOST} onClick={onCancel}>
+							Annuler
+						</Button>
+						<Button type="submit">Créer le rôle</Button>
+					</div>
+				</Form>
+				<Confirm
+					isOpen={isConfirmModalVisible}
+					onClose={closeConfirmModal}
+					onAccept={redirect}
+					closeBtn
+					header={"Êtes-vous sur de vouloir quitter sans enregistrer ?"}
+					cancelText={"Annuler"}
+					confirmText={"Quitter"}>
+					<div className={classes["modal-content"]}>
+						<Typography typo={ITypo.P_16} className={classes["text"]}>
+							Si vous quittez, toutes les modifications que vous avez effectuées ne seront pas enregistrées.
+						</Typography>
+					</div>
+				</Confirm>
+			</div>
+		</DefaultRolesDashboard>
+	);
+}

src/front/Config/Module/development.json

@@ -155,6 +155,13 @@
 							"path": "/roles/[uid]",
 							"labelKey": "roles_informations"
 						}
+					},
+					"Create": {
+						"enabled": true,
+						"props": {
+							"path": "/roles/create",
+							"labelKey": "create_role"
+						}
 					}
 				}
 			},

src/front/Config/Module/preprod.json

@@ -155,6 +155,13 @@
 							"path": "/roles/[uid]",
 							"labelKey": "roles_informations"
 						}
+					},
+					"Create": {
+						"enabled": true,
+						"props": {
+							"path": "/roles/create",
+							"labelKey": "create_role"
+						}
 					}
 				}
 			},

src/front/Config/Module/production.json

@@ -155,6 +155,13 @@
 							"path": "/roles/[uid]",
 							"labelKey": "roles_informations"
 						}
+					},
+					"Create": {
+						"enabled": true,
+						"props": {
+							"path": "/roles/create",
+							"labelKey": "create_role"
+						}
 					}
 				}
 			},

src/front/Config/Module/staging.json

@@ -155,6 +155,13 @@
 							"path": "/roles/[uid]",
 							"labelKey": "roles_informations"
 						}
+					},
+					"Create": {
+						"enabled": true,
+						"props": {
+							"path": "/roles/create",
+							"labelKey": "create_role"
+						}
 					}
 				}
 			},

src/pages/roles/create/index.tsx

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