Error popups

src/front/Components/DesignSystem/OldModal/Confirm/index.tsx

@@ -63,7 +63,12 @@ export default class Confirm extends React.Component<IProps, IState> {
 						</div>
 					))}
 				<div className={classes["sub-container"]}>
-					<Button variant={EButtonVariant.PRIMARY} onClick={this.props.onAccept} disabled={!this.props.canConfirm} fullwidth>
+					<Button
+						variant={EButtonVariant.PRIMARY}
+						styletype={EButtonstyletype.OUTLINED}
+						onClick={this.props.onAccept}
+						disabled={!this.props.canConfirm}
+						fullwidth>
 						{this.props.confirmText}
 					</Button>
 				</div>

src/front/Components/DesignSystem/OldModal/Elements/Header/index.tsx

@@ -10,7 +10,7 @@ export default class Header extends React.Component<IProps> {
 	public override render(): JSX.Element {
 		return (
 			<header className={classes["root"]}>
-				<Typography typo={ETypo.TITLE_H3}>{this.props.content}</Typography>
+				<Typography typo={ETypo.TITLE_H4}>{this.props.content}</Typography>
 			</header>
 		);
 	}

src/front/Components/Layouts/Login/StepEmail/classes.module.scss

@@ -40,4 +40,19 @@
 			}
 		}
 	}
+	.modal-content {
+		.text {
+			color: var(--color-neutral-700);
+		}
+
+		.modal-button {
+			display: flex;
+			margin-top: 24px;
+			color: var(--color-secondary-500);
+
+			.button-text {
+				border-bottom: 1px solid var(--color-secondary-500);
+			}
+		}
+	}
 }

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

@@ -62,10 +62,10 @@ export default function StepEmail(props: IProps) {
 		router.push("https://connexion.idnot.fr/");
 	}, [router]);
 
-	const closeContactAdminModal = () => {
+	// const closeContactAdminModal = () => {
-		setIsErrorModalOpen(0);
+	// 	setIsErrorModalOpen(0);
-		window.open("https://www.lecoffre.io/contact", "_blank");
+	// 	window.open("https://www.lecoffre.io/contact", "_blank");
-	};
+	// };
 
 	useEffect(() => {
 		openErrorModal(parseInt(error as string));
@@ -110,12 +110,18 @@ export default function StepEmail(props: IProps) {
 				showCancelButton={false}
 				onAccept={closeErrorModal}
 				closeBtn
-				header={"Erreur"}
+				header={"Abonnement Manquant"}
-				confirmText={"OK"}>
+				confirmText={"Fermer"}>
 				<div className={classes["modal-content"]}>
-					<Typography typo={ETypo.TEXT_MD_REGULAR} className={classes["text"]}>
+					<Typography typo={ETypo.TEXT_MD_LIGHT} className={classes["text"]}>
-						Vous ne disposez pas d'un abonnement, veuillez contacter l'administrateur de votre office.
+						Vous ne disposez pas d'un abonnement actif. Veuillez demander au référent de votre étude de souscrire à un
+						abonnement pour activer cette fonctionnalité. Pour toute question, contactez-nous à support@lecoffre.io.
 					</Typography>
+					<a className={classes["modal-button"]} href="mailto:support@lecoffre.io" target="_blank">
+						<Typography typo={ETypo.TEXT_MD_REGULAR} color={ETypoColor.COLOR_SECONDARY_500} className={classes["button-text"]}>
+							Contactez le support
+						</Typography>
+					</a>
 				</div>
 			</Confirm>
 			<Confirm
@@ -137,17 +143,42 @@ export default function StepEmail(props: IProps) {
 				onClose={closeErrorModal}
 				onAccept={closeNoEmailModal}
 				closeBtn
-				header={"Echec de connexion"}
+				header={"E-mail Professionnel Manquant"}
 				confirmText={"Accéder à mon compte ID.not"}
-				cancelText={"OK"}>
+				cancelText={"Fermer"}>
 				<div className={classes["modal-content"]}>
 					<Typography typo={ETypo.TEXT_MD_REGULAR} className={classes["text"]}>
-						Votre compte ID.not doit être associé à une adresse email @notaires.fr (onglet Mettre à jour mes données
+						Votre e-mail professionnel n'est pas renseigné sur votre compte ID.Not. Merci de l'ajouter pour accéder à ce
-						professionnelles)
+						service. Pour toute question, contactez-nous à support@lecoffre.io.
 					</Typography>
+					<a className={classes["modal-button"]} href="mailto:support@lecoffre.io" target="_blank">
+						<Typography typo={ETypo.TEXT_MD_REGULAR} color={ETypoColor.COLOR_SECONDARY_500} className={classes["button-text"]}>
+							Contactez le support
+						</Typography>
+					</a>
 				</div>
 			</Confirm>
 			<Confirm
+				isOpen={isErrorModalOpen === 4}
+				onClose={closeErrorModal}
+				showCancelButton={false}
+				onAccept={closeErrorModal}
+				closeBtn
+				header={"Connexion à ID.Not impossible"}
+				confirmText={"Fermer"}>
+				<div className={classes["modal-content"]}>
+					<Typography typo={ETypo.TEXT_MD_REGULAR} className={classes["text"]}>
+						Notre partenaire ID.Not rencontre actuellement un problème technique. Nous vous tiendrons informé de l'évolution.
+						Pour toute question, contactez-nous à support@lecoffre.io.
+					</Typography>
+					<a className={classes["modal-button"]} href="mailto:support@lecoffre.io" target="_blank">
+						<Typography typo={ETypo.TEXT_MD_REGULAR} color={ETypoColor.COLOR_SECONDARY_500} className={classes["button-text"]}>
+							Contactez le support
+						</Typography>
+					</a>
+				</div>
+			</Confirm>
+			{/* <Confirm
 				isOpen={isErrorModalOpen === 4}
 				onClose={closeErrorModal}
 				onAccept={closeContactAdminModal}
@@ -188,7 +219,7 @@ export default function StepEmail(props: IProps) {
 						</li>
 					</ul>
 				</div>
-			</Confirm>
+			</Confirm> */}
 		</div>
 	);
 }

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

@@ -1,10 +1,10 @@
-import Typography, { ETypo } from "@Front/Components/DesignSystem/Typography";
+// import Typography, { ETypo } from "@Front/Components/DesignSystem/Typography";
 import DefaultDoubleSidePage from "@Front/Components/LayoutTemplates/DefaultDoubleSidePage";
 import { useRouter } from "next/router";
-import { useCallback, useEffect, useState } from "react";
+import { useCallback, useState } from "react";
 
 import classes from "./classes.module.scss";
-import Confirm from "@Front/Components/DesignSystem/OldModal/Confirm";
+// import Confirm from "@Front/Components/DesignSystem/OldModal/Confirm";
 import StepEmail from "./StepEmail";
 import StepTotp from "./StepTotp";
 import Auth from "@Front/Api/Auth/Customer/Auth";
@@ -25,9 +25,9 @@ export enum LoginStep {
 }
 export default function Login() {
 	const router = useRouter();
-	const error = router.query["error"];
+	// const error = router.query["error"];
 
-	const [isErrorModalOpen, setIsErrorModalOpen] = useState(false);
+	// const [isErrorModalOpen, setIsErrorModalOpen] = useState(false);
 
 	const [step, setStep] = useState<LoginStep>(LoginStep.EMAIL);
 	const [totpCodeUid, setTotpCodeUid] = useState<string>("");
@@ -36,17 +36,17 @@ export default function Login() {
 	const [partialPhoneNumber, setPartialPhoneNumber] = useState<string>("");
 	const [validationErrors, setValidationErrors] = useState<ValidationError[]>([]);
 
-	const openErrorModal = useCallback(() => {
+	// const openErrorModal = useCallback(() => {
-		setIsErrorModalOpen(true);
+	// 	setIsErrorModalOpen(true);
-	}, []);
+	// }, []);
 
-	const closeErrorModal = useCallback(() => {
+	// const closeErrorModal = useCallback(() => {
-		setIsErrorModalOpen(false);
+	// 	setIsErrorModalOpen(false);
-	}, []);
+	// }, []);
 
-	useEffect(() => {
+	// useEffect(() => {
-		if (error === "1") openErrorModal();
+	// 	if (error === "1") openErrorModal();
-	}, [error, openErrorModal]);
+	// }, [error, openErrorModal]);
 
 	const onEmailFormSubmit = useCallback(async (e: React.FormEvent<HTMLFormElement> | null, values: { [key: string]: string }) => {
 		try {
@@ -232,7 +232,7 @@ export default function Login() {
 					<PasswordForgotten onSubmit={onNewPasswordSubmit} validationErrors={validationErrors} />
 				)}
 			</div>
-			<Confirm
+			{/* <Confirm
 				isOpen={isErrorModalOpen}
 				onClose={closeErrorModal}
 				showCancelButton={false}
@@ -245,7 +245,7 @@ export default function Login() {
 						Une erreur est survenue lors de la connexion. Veuillez réessayer.
 					</Typography>
 				</div>
-			</Confirm>
+			</Confirm> */}
 		</DefaultDoubleSidePage>
 	);
 }