diff --git a/src/front/Components/Elements/Rules/index.tsx b/src/front/Components/Elements/Rules/index.tsx
index 889adf89..ecf66840 100644
--- a/src/front/Components/Elements/Rules/index.tsx
+++ b/src/front/Components/Elements/Rules/index.tsx
@@ -1,8 +1,8 @@
 import React, { useCallback, useEffect } from "react";
-import { useRouter } from "next/router";
-import Module from "@Front/Config/Module";
 import JwtService from "@Front/Services/JwtService/JwtService";
 import { IAppRule } from "@Front/Api/Entities/rule";
+import { useRouter } from "next/router";
+import Module from "@Front/Config/Module";
 
 export enum RulesMode {
 	OPTIONAL = "optional",
@@ -10,16 +10,18 @@ export enum RulesMode {
 }
 
 type IProps = {
-	isPage?: boolean;
 	mode: RulesMode;
 	rules: IAppRule[];
-	no?: boolean;
 	children: JSX.Element;
+	isPage?: boolean;
 };
 
 export default function Rules(props: IProps) {
 	const router = useRouter();
 
+	const [isShowing, setIsShowing] = React.useState(false);
+	const [hasJwt, setHasJwt] = React.useState(false);
+
 	const getShowValue = useCallback(() => {
 		if (props.mode === RulesMode.NECESSARY) {
 			return props.rules.every((rule) => JwtService.getInstance().hasRule(rule.name, rule.action));
@@ -27,19 +29,18 @@ export default function Rules(props: IProps) {
 		return !!props.rules.find((rule) => JwtService.getInstance().hasRule(rule.name, rule.action));
 	}, [props.mode, props.rules]);
 
-	const show = getShowValue();
-	const [isShowing, setIsShowing] = React.useState(props.no ? !show : show);
-
 	useEffect(() => {
-		setIsShowing(props.no ? !show : show);
-	}, [props.no, show]);
+		if (!JwtService.getInstance().decodeJwt()) return;
+		setHasJwt(true);
+		setIsShowing(getShowValue());
+	}, [getShowValue, isShowing]);
 
-	if (!isShowing && props.isPage) {
-		router.push(Module.getInstance().get().modules.pages.Home.props.path);
-	}
-
-	if (!JwtService.getInstance().decodeJwt() || !isShowing) {
+	if (props.isPage && !isShowing) {
+		router.push(Module.getInstance().get().modules.pages[404].props.path);
 		return null;
 	}
+
+	if (!hasJwt || !isShowing) return null;
+
 	return props.children;
 }
diff --git a/src/front/Components/Layouts/Roles/RolesCreate/index.tsx b/src/front/Components/Layouts/Roles/RolesCreate/index.tsx
index 0fbbd749..d64b4e85 100644
--- a/src/front/Components/Layouts/Roles/RolesCreate/index.tsx
+++ b/src/front/Components/Layouts/Roles/RolesCreate/index.tsx
@@ -12,6 +12,8 @@ import { useCallback, useState } from "react";
 
 import classes from "./classes.module.scss";
 import JwtService from "@Front/Services/JwtService/JwtService";
+import Rules, { RulesMode } from "@Front/Components/Elements/Rules";
+import { AppRuleActions, AppRuleNames } from "@Front/Api/Entities/rule";
 
 type IProps = {};
 export default function RolesCreate(props: IProps) {
@@ -61,35 +63,44 @@ export default function RolesCreate(props: IProps) {
 	}, [hasChanged, redirect]);
 
 	return (
-		<DefaultRolesDashboard mobileBackText={"Liste des rôles"} hasBackArrow title="Créer un rôle">
-			<div className={classes["root"]}>
-				<div className={classes["header"]}>
-					<Typography typo={ITypo.H1Bis}>Créer un rôle</Typography>
+		<Rules
+			mode={RulesMode.NECESSARY}
+			rules={[
+				{
+					action: AppRuleActions.create,
+					name: AppRuleNames.officeRoles,
+				},
+			]}>
+			<DefaultRolesDashboard mobileBackText={"Liste des rôles"} hasBackArrow title="Créer un rôle">
+				<div className={classes["root"]}>
+					<div className={classes["header"]}>
+						<Typography typo={ITypo.H1Bis}>Créer un rôle</Typography>
+					</div>
+					<Form onSubmit={onSubmitHandler} className={classes["form-container"]} onFieldChange={onFieldChange}>
+						<TextField name="name" placeholder="Nom du rôle" />
+						<div className={classes["buttons-container"]}>
+							<Button variant={EButtonVariant.GHOST} onClick={onCancel}>
+								Annuler
+							</Button>
+							<Button type="submit">Créer le rôle</Button>
+						</div>
+					</Form>
+					<Confirm
+						isOpen={isConfirmModalVisible}
+						onClose={closeConfirmModal}
+						onAccept={redirect}
+						closeBtn
+						header={"Êtes-vous sur de vouloir quitter sans enregistrer ?"}
+						cancelText={"Annuler"}
+						confirmText={"Quitter"}>
+						<div className={classes["modal-content"]}>
+							<Typography typo={ITypo.P_16} className={classes["text"]}>
+								Si vous quittez, toutes les modifications que vous avez effectuées ne seront pas enregistrées.
+							</Typography>
+						</div>
+					</Confirm>
 				</div>
-				<Form onSubmit={onSubmitHandler} className={classes["form-container"]} onFieldChange={onFieldChange}>
-					<TextField name="name" placeholder="Nom du rôle" />
-					<div className={classes["buttons-container"]}>
-						<Button variant={EButtonVariant.GHOST} onClick={onCancel}>
-							Annuler
-						</Button>
-						<Button type="submit">Créer le rôle</Button>
-					</div>
-				</Form>
-				<Confirm
-					isOpen={isConfirmModalVisible}
-					onClose={closeConfirmModal}
-					onAccept={redirect}
-					closeBtn
-					header={"Êtes-vous sur de vouloir quitter sans enregistrer ?"}
-					cancelText={"Annuler"}
-					confirmText={"Quitter"}>
-					<div className={classes["modal-content"]}>
-						<Typography typo={ITypo.P_16} className={classes["text"]}>
-							Si vous quittez, toutes les modifications que vous avez effectuées ne seront pas enregistrées.
-						</Typography>
-					</div>
-				</Confirm>
-			</div>
-		</DefaultRolesDashboard>
+			</DefaultRolesDashboard>
+		</Rules>
 	);
 }
diff --git a/src/front/Services/JwtService/JwtService.ts b/src/front/Services/JwtService/JwtService.ts
index 86380536..a2fd9183 100644
--- a/src/front/Services/JwtService/JwtService.ts
+++ b/src/front/Services/JwtService/JwtService.ts
@@ -68,10 +68,8 @@ export default class JwtService {
 	}
 
 	public hasRule(name: string, action: string) {
-		const accessToken = CookieService.getInstance().getCookie("leCoffreAccessToken");
-		if (!accessToken) return false;
-		const decodedToken = this.decodeJwt();
-		if (!decodedToken) return false;
-		return decodedToken?.rules?.some((rule: string) => rule === `${action} ${name}`);
+		const token = this.decodeJwt();
+		if (!token) return false;
+		return token?.rules?.some((rule: string) => rule === `${action} ${name}`);
 	}
 }
diff --git a/src/middleware.ts b/src/middleware.ts
index 02594795..6422af83 100644
--- a/src/middleware.ts
+++ b/src/middleware.ts
@@ -25,22 +25,6 @@ export async function middleware(request: NextRequest) {
 		return NextResponse.redirect(new URL("/login", request.url));
 	}
 
-	const requestUrlPath = request.nextUrl.pathname;
-	if (
-		requestUrlPath.startsWith("/collaborators") ||
-		requestUrlPath.startsWith("/deed-types") ||
-		requestUrlPath.startsWith("/customer") ||
-		requestUrlPath.startsWith("/offices") ||
-		requestUrlPath.startsWith("/roles") ||
-		requestUrlPath.startsWith("/users")
-	) {
-		if (userDecodedToken.role !== "admin" && userDecodedToken.role !== "super-admin")
-			return NextResponse.redirect(new URL("/404", request.url));
-	}
-	if ((requestUrlPath.startsWith("/my-account") || requestUrlPath.startsWith("/document-types")) && !userDecodedToken)
-		return NextResponse.redirect(new URL("/404", request.url));
-	if (requestUrlPath.startsWith("/client-dashboard") && !customerDecodedToken) return NextResponse.redirect(new URL("/404", request.url));
-
 	return NextResponse.next();
 }