diff --git a/src/front/Components/Layouts/Login/index.tsx b/src/front/Components/Layouts/Login/index.tsx
index 59da4eb7..b4c10d64 100644
--- a/src/front/Components/Layouts/Login/index.tsx
+++ b/src/front/Components/Layouts/Login/index.tsx
@@ -1,48 +1,48 @@
 import CoffreIcon from "@Assets/Icons/coffre.svg";
-// import { FrontendVariables } from "@Front/Config/VariablesFront";
 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 Module from "@Front/Config/Module";
+import JwtService from "@Front/Services/JwtService/JwtService";
 import UserStore from "@Front/Stores/UserStore";
 import Image from "next/image";
+import { useRouter } from "next/router";
+import { useCallback } from "react";
 
-import BasePage from "../Base";
 import classes from "./classes.module.scss";
 import LandingImage from "./landing-connect.jpeg";
 
-export default class LoginClass extends BasePage {
-	public override render(): JSX.Element {
-		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 professionnel</div>
-					</Typography>
-					<Button onClick={this.redirectUserOnConnection} icon={idNoteLogo} iconposition={"left"}>
-						S'identifier avec ID.not
-					</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>
-		);
-	}
+export default function Login() {
+	const router = useRouter();
+	const redirectUserOnConnection = useCallback(() => {
+		async function getUser() {
+			try {
+				await UserStore.instance.connect(process.env["NEXT_PUBLIC_ADMIN_ID"] as string);
+				await JwtService.getInstance().checkJwt();
+				router.push(Module.getInstance().get().modules.pages.Folder.props.path);
+			} catch (e) {
+				console.error(e);
+			}
+		}
 
-	private async redirectUserOnConnection() {
-		// const variables = FrontendVariables.getInstance();
-		// const baseFronturl = variables.BACK_API_PROTOCOL + variables.FRONT_APP_HOST;
-
-		await UserStore.instance.connect(process.env["NEXT_PUBLIC_ADMIN_ID"] as string);
-		// await JwtService.getInstance().checkJwt();
-		// window.location.assign("http://localhost:3000" + "/folders");
-
-		// const authorizeEndPoint = variables.IDNOT_AUTHORIZE_ENDPOINT;
-		// const clientId = variables.IDNOT_CLIENT_ID;
-		// const url = `${authorizeEndPoint}?client_id=${clientId}&redirect_uri=${baseFronturl}/authorized-client&scope=openid,profile,offline_access&response_type=code`;
-		// window.location.assign(url);
-	}
+		getUser();
+	}, [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 professionnel</div>
+				</Typography>
+				<Button onClick={redirectUserOnConnection} icon={idNoteLogo} iconposition={"left"}>
+					S'identifier avec ID.not
+				</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>
+	);
 }