46 lines
1.6 KiB
TypeScript
46 lines
1.6 KiB
TypeScript
import CoffreIcon from "@Assets/Icons/coffre.svg";
|
|
import idNoteLogo from "@Assets/Icons/id-note-logo.svg";
|
|
import Button, { EButtonVariant } from "@Front/Components/DesignSystem/Button";
|
|
import Typography, { ITypo } from "@Front/Components/DesignSystem/Typography";
|
|
import DefaultDoubleSidePage from "@Front/Components/LayoutTemplates/DefaultDoubleSidePage";
|
|
import Image from "next/image";
|
|
import { useRouter } from "next/router";
|
|
import { useCallback } from "react";
|
|
import Customers from "@Front/Api/LeCoffreApi/Id360/Customers/Customers";
|
|
import classes from "./classes.module.scss";
|
|
import LandingImage from "./landing-connect.jpeg";
|
|
|
|
export default function Login() {
|
|
const router = useRouter();
|
|
|
|
const redirectCustomerOnConnection = useCallback(() => {
|
|
async function getCustomer() {
|
|
try {
|
|
const loginRes = await Customers.getInstance().login();
|
|
router.push(loginRes.enrollment.franceConnectUrl);
|
|
} catch (e) {
|
|
console.error(e);
|
|
}
|
|
}
|
|
getCustomer();
|
|
}, [router]);
|
|
|
|
return (
|
|
<DefaultDoubleSidePage title={"Login"} image={LandingImage}>
|
|
<div className={classes["root"]}>
|
|
<Image alt="coffre" src={CoffreIcon} />
|
|
<Typography typo={ITypo.H1}>
|
|
<div className={classes["title"]}>Connexion espace client</div>
|
|
</Typography>
|
|
<Button onClick={redirectCustomerOnConnection} icon={idNoteLogo} iconposition={"left"}>
|
|
S'identifier en tant que customer
|
|
</Button>
|
|
<Typography typo={ITypo.P_18}>
|
|
<div className={classes["forget-password"]}>Vous n'arrivez pas à vous connecter ?</div>
|
|
</Typography>
|
|
<Button variant={EButtonVariant.LINE}>Contacter l'administrateur</Button>
|
|
</div>
|
|
</DefaultDoubleSidePage>
|
|
);
|
|
}
|