4nk/lecoffre-front
4
0
Fork 0
Code Issues 1 Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Error popups

Browse Source
This commit is contained in:
Vins 2024-10-21 15:38:38 +02:00
parent a61368030c
commit 1f582a0e82
5 changed files with 82 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
src/front/Components/DesignSystem/OldModal/Confirm/index.tsx
View File

@ -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>

2
src/front/Components/DesignSystem/OldModal/Elements/Header/index.tsx
View File

@ -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>
);
}

15
src/front/Components/Layouts/Login/StepEmail/classes.module.scss
View File

@ -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);
}
}
}
}

57
src/front/Components/Layouts/Login/StepEmail/index.tsx
View File

@ -62,10 +62,10 @@ export default function StepEmail(props: IProps) {
router.push("https://connexion.idnot.fr/");
}, [router]);
const closeContactAdminModal = () => {
setIsErrorModalOpen(0);
window.open("https://www.lecoffre.io/contact", "_blank");
};
// const closeContactAdminModal = () => {
// setIsErrorModalOpen(0);
// 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"}
confirmText={"OK"}>
header={"Abonnement Manquant"}
confirmText={"Fermer"}>
<div className={classes["modal-content"]}>
<Typography typo={ETypo.TEXT_MD_REGULAR} className={classes["text"]}>
Vous ne disposez pas d'un abonnement, veuillez contacter l'administrateur de votre office.
<Typography typo={ETypo.TEXT_MD_LIGHT} className={classes["text"]}>
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
professionnelles)
Votre e-mail professionnel n'est pas renseigné sur votre compte ID.Not. Merci de l'ajouter pour accéder à ce
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>
);
}

32
src/front/Components/Layouts/Login/index.tsx
View File

@ -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(() => {
setIsErrorModalOpen(true);
}, []);
// const openErrorModal = useCallback(() => {
// setIsErrorModalOpen(true);
// }, []);
const closeErrorModal = useCallback(() => {
setIsErrorModalOpen(false);
}, []);
// const closeErrorModal = useCallback(() => {
// setIsErrorModalOpen(false);
// }, []);
useEffect(() => {
if (error === "1") openErrorModal();
}, [error, openErrorModal]);
// useEffect(() => {
// if (error === "1") 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>
);
}