diff --git a/front/public/assets/logo.svg b/front/public/assets/logo.svg
new file mode 100644
index 000000000..283dde2ef
--- /dev/null
+++ b/front/public/assets/logo.svg
@@ -0,0 +1,39 @@
+
+
+
diff --git a/front/src/components/AuthenticationProtection/AuthenticationProtection.tsx b/front/src/components/AuthenticationProtection/AuthenticationProtection.tsx
index ea2a32910..7b422462b 100644
--- a/front/src/components/AuthenticationProtection/AuthenticationProtection.tsx
+++ b/front/src/components/AuthenticationProtection/AuthenticationProtection.tsx
@@ -1,34 +1,50 @@
-import { useAuthenticationContext } from '@Front/hooks/useAuthenticationContext';
-import { appRoutes } from '@Front/routing/appRoutes';
-import { useMemo, type ReactNode } from 'react';
-import { Navigate, useLocation, useMatches, type UIMatch } from 'react-router';
+import { useAuthenticationContext } from "@Front/hooks/useAuthenticationContext";
+import LoaderPage from "@Front/pages/Loader/LoaderPage";
+import { appRoutes } from "@Front/routing/appRoutes";
+import { useMemo, type ReactNode } from "react";
+import { Navigate, useLocation, useMatches, type UIMatch } from "react-router";
type AuthenticationProtectionProps = {
children: ReactNode;
};
export const AuthenticationProtection = ({ children }: AuthenticationProtectionProps) => {
- const { isAuthenticated, postAuthRedirectPath, setPostAuthRedirectPath, resetPostAuthRedirectPath } =
- useAuthenticationContext();
+ const {
+ isAuthenticated,
+ postAuthRedirectPath,
+ setPostAuthRedirectPath,
+ resetPostAuthRedirectPath,
+ } = useAuthenticationContext();
const { pathname } = useLocation();
const matches = useMatches() as UIMatch[];
const mustBeAuthenticate = useMemo(() => {
- const currentMatch = matches.find(match => match.pathname === pathname);
+ const currentMatch = matches.find((match) => match.pathname === pathname);
if (currentMatch?.handle?.mustBeAuthenticate === true && !isAuthenticated) {
setPostAuthRedirectPath(pathname);
}
- if (currentMatch?.handle?.mustBeAuthenticate === false && isAuthenticated && postAuthRedirectPath) {
+ if (
+ currentMatch?.handle?.mustBeAuthenticate === false &&
+ isAuthenticated &&
+ postAuthRedirectPath
+ ) {
resetPostAuthRedirectPath();
}
return currentMatch?.handle?.mustBeAuthenticate;
- }, [pathname, matches, isAuthenticated, postAuthRedirectPath, setPostAuthRedirectPath, resetPostAuthRedirectPath]);
+ }, [
+ pathname,
+ matches,
+ isAuthenticated,
+ postAuthRedirectPath,
+ setPostAuthRedirectPath,
+ resetPostAuthRedirectPath,
+ ]);
if (isAuthenticated === undefined) {
- return null;
+ return ;
}
if (mustBeAuthenticate && !isAuthenticated) {
diff --git a/front/src/pages/Loader/LoaderPage.css b/front/src/pages/Loader/LoaderPage.css
new file mode 100644
index 000000000..81f8cf504
--- /dev/null
+++ b/front/src/pages/Loader/LoaderPage.css
@@ -0,0 +1,37 @@
+.container {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+}
+
+/* Classe pour le loader SVG */
+.svg-loader {
+ width: 300px; /* Ajustez la taille selon vos besoins */
+ height: auto;
+}
+
+/* --- Adaptation du CSS de cssloader --- */
+.animated-path {
+ /* 1. Transparence de base et Contour */
+ stroke: #000000;
+ stroke-width: 20px; /* Augmenté car la viewBox du SVG est immense (5335px) */
+ fill: none; /* Ajustez l'épaisseur du contour */
+
+ /* 2. Application du Masque (pour l'effet de remplissage) */
+ mask: url(#wave-mask);
+}
+
+/* Définition de l'onde dans le masque (équivalent du gradient CSS) */
+#wave-rect {
+ animation: wave-animation 2s linear infinite;
+}
+
+/* 3. L'Animation (adaptée pour SVG) */
+@keyframes wave-animation {
+ from {
+ x: -320px; /* Commence décalé à gauche (taille du motif) */
+ }
+ to {
+ x: 0; /* Revient à la position initiale */
+ }
+}
diff --git a/front/src/pages/Loader/LoaderPage.tsx b/front/src/pages/Loader/LoaderPage.tsx
new file mode 100644
index 000000000..cd4abfe2a
--- /dev/null
+++ b/front/src/pages/Loader/LoaderPage.tsx
@@ -0,0 +1,70 @@
+import React from 'react';
+import './LoaderPage.css';
+
+const LoaderPage: React.FC = () => {
+ return (
+
+
+
+
+