Merge branch 'dev' into preprod

src/front/Components/Layouts/ClientDashboard/ContactBox/index.tsx

@@ -79,9 +79,7 @@ export default function ContactBox(props: IProps) {
 						{notaryContact?.email ?? "_"}
 					</Typography>
 				</div>
-				<div className={classes["note-and-rib-button"]}>
-					{noteAndRibButton()}
-				</div>
+				<div className={classes["note-and-rib-button"]}>{noteAndRibButton()}</div>
 			</div>
 
 			<div className={classes["right"]}>{noteAndRibButton()}</div>
@@ -107,7 +105,7 @@ export default function ContactBox(props: IProps) {
 						size={EButtonSize.LG}
 						styletype={EButtonstyletype.CONTAINED}
 						rightIcon={<ArrowDownTrayIcon />}>
-						Télécharger le RIB
+						Télécharger le RIB de mon notaire
 					</Button>
 				)}
 			</>

src/front/Components/Layouts/ClientDashboard/DepositDocumentComponent/classes.module.scss

@@ -11,6 +11,12 @@
 		display: flex;
 		flex-direction: column;
 		gap: var(--spacing-sm, 8px);
+
+		.refused-link {
+			color: var(--color-danger-500);
+			text-decoration: underline !important;
+			cursor: pointer;
+		}
 	}
 
 	@media screen and (max-width: $screen-s) {

src/front/Components/Layouts/ClientDashboard/DepositDocumentComponent/index.tsx

@@ -1,11 +1,12 @@
 import DragAndDrop, { IDocumentFileWithUid } from "@Front/Components/DesignSystem/DragAndDrop";
 import Typography, { ETypo, ETypoColor } from "@Front/Components/DesignSystem/Typography";
 import { Document } from "le-coffre-resources/dist/Customer";
-import { useCallback, useMemo } from "react";
+import { useCallback, useMemo, useState } from "react";
 
 import classes from "./classes.module.scss";
 import Files from "@Front/Api/LeCoffreApi/Customer/Files/Files";
 import { ToasterService } from "@Front/Components/DesignSystem/Toaster";
+import Confirm from "@Front/Components/DesignSystem/OldModal/Confirm";
 
 type IProps = {
 	document: Document;
@@ -14,6 +15,8 @@ type IProps = {
 
 export default function DepositDocumentComponent(props: IProps) {
 	const { document, onChange } = props;
+	const [isModalOpen, setIsModalOpen] = useState(false);
+	const [refused_reason, setRefusedReason] = useState<string | null>(null);
 
 	const defaultFiles: IDocumentFileWithUid[] = useMemo(() => {
 		const filesNotArchived = document.files?.filter((file) => !file.archived_at) ?? [];
@@ -50,6 +53,17 @@ export default function DepositDocumentComponent(props: IProps) {
 		[onChange],
 	);
 
+	const onOpenModal = useCallback(async () => {
+		const refused_reason = document.document_history?.find((history) => history.document_status === "REFUSED")?.refused_reason;
+		if (!refused_reason) return;
+		setRefusedReason(refused_reason);
+		setIsModalOpen(true);
+	}, []);
+
+	const closeModal = useCallback(() => {
+		setIsModalOpen(false);
+	}, []);
+
 	return (
 		<div className={classes["root"]}>
 			<div className={classes["title"]}>
@@ -59,7 +73,36 @@ export default function DepositDocumentComponent(props: IProps) {
 				<Typography typo={ETypo.TEXT_MD_REGULAR} color={ETypoColor.TEXT_SECONDARY}>
 					Demandé le: {document.created_at ? new Date(document.created_at).toLocaleDateString() : "_"}
 				</Typography>
+				{document.document_status === "REFUSED" && (
+					<div>
+						<Typography typo={ETypo.TEXT_MD_REGULAR} color={ETypoColor.TEXT_SECONDARY}>
+							Refusé le : {document.updated_at ? new Date(document.updated_at).toLocaleDateString() : "_"}
+						</Typography>
+						<Typography typo={ETypo.TEXT_MD_REGULAR} color={ETypoColor.ERROR_WEAK_CONTRAST} onClick={onOpenModal}>
+							Document non-conforme{" : "} <a className={classes["refused-link"]}>Voir le motif de refus</a>
+						</Typography>
 					</div>
+				)}
+			</div>
+
+			<Confirm
+				isOpen={isModalOpen}
+				showCancelButton={false}
+				onAccept={closeModal}
+				onClose={closeModal}
+				closeBtn
+				header={"Motif de refus"}
+				confirmText={"J'ai compris"}>
+				<div className={classes["modal-content"]}>
+					<Typography typo={ETypo.TEXT_MD_SEMIBOLD} className={classes["text"]}>
+						Votre document a été refusé pour la raison suivante :
+					</Typography>
+					<br />
+					<Typography typo={ETypo.TEXT_MD_REGULAR} className={classes["text"]}>
+						{refused_reason}
+					</Typography>
+				</div>
+			</Confirm>
 
 			<DragAndDrop
 				title={"Glisser-déposer ou"}

src/front/Components/Layouts/Login/StepEmail/index.tsx

@@ -83,7 +83,7 @@ export default function StepEmail(props: IProps) {
 			<div className={classes["content"]}>
 				<div className={classes["section"]}>
 					<Typography typo={ETypo.TITLE_H6} color={ETypoColor.TEXT_ACCENT} className={classes["section-title"]}>
-						Pour les notaires :
+						Pour les notaires et les colaborateurs :
 					</Typography>
 					<Button onClick={redirectUserOnConnection} rightIcon={<Image alt="id-not-logo" src={idNoteLogo} />}>
 						S'identifier avec ID.not