init commit,

03_source/frontend/src/auth/guard/auth-guard.tsx

@@ -0,0 +1,68 @@
+import { useState, useEffect } from 'react';
+
+import { paths } from 'src/routes/paths';
+import { useRouter, usePathname } from 'src/routes/hooks';
+
+import { CONFIG } from 'src/global-config';
+
+import { SplashScreen } from 'src/components/loading-screen';
+
+import { useAuthContext } from '../hooks';
+
+// ----------------------------------------------------------------------
+
+type AuthGuardProps = {
+  children: React.ReactNode;
+};
+
+const signInPaths = {
+  jwt: paths.auth.jwt.signIn,
+  auth0: paths.auth.auth0.signIn,
+  amplify: paths.auth.amplify.signIn,
+  firebase: paths.auth.firebase.signIn,
+  supabase: paths.auth.supabase.signIn,
+};
+
+export function AuthGuard({ children }: AuthGuardProps) {
+  const router = useRouter();
+  const pathname = usePathname();
+
+  const { authenticated, loading } = useAuthContext();
+
+  const [isChecking, setIsChecking] = useState(true);
+
+  const createRedirectPath = (currentPath: string) => {
+    const queryString = new URLSearchParams({ returnTo: pathname }).toString();
+    return `${currentPath}?${queryString}`;
+  };
+
+  const checkPermissions = async (): Promise<void> => {
+    if (loading) {
+      return;
+    }
+
+    if (!authenticated) {
+      const { method } = CONFIG.auth;
+
+      const signInPath = signInPaths[method];
+      const redirectPath = createRedirectPath(signInPath);
+
+      router.replace(redirectPath);
+
+      return;
+    }
+
+    setIsChecking(false);
+  };
+
+  useEffect(() => {
+    checkPermissions();
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [authenticated, loading]);
+
+  if (isChecking) {
+    return <SplashScreen />;
+  }
+
+  return <>{children}</>;
+}