diff --git a/src/frontend/src/features/auth/Auth.tsx b/src/frontend/src/features/auth/Auth.tsx index ba0f54aa..93e4e197 100644 --- a/src/frontend/src/features/auth/Auth.tsx +++ b/src/frontend/src/features/auth/Auth.tsx @@ -15,7 +15,6 @@ export const login = () => { interface AuthContextInterface { user?: User | null; - init?: () => Promise; } export const AuthContext = React.createContext({}); @@ -36,7 +35,7 @@ export const Auth = ({ } }, [query.isError, redirect]); - if (query.isFetched === false) { + if (!query.isFetched) { return (
{children} diff --git a/src/frontend/src/features/layouts/components/main/authenticated-view.tsx b/src/frontend/src/features/layouts/components/main/authenticated-view.tsx new file mode 100644 index 00000000..ce052bc0 --- /dev/null +++ b/src/frontend/src/features/layouts/components/main/authenticated-view.tsx @@ -0,0 +1,23 @@ +import { useAuth } from "@/features/auth/Auth"; +import { useRouter } from "next/router"; +import { useEffect } from "react"; + +/** + * Check if a user is authenticated otherwise redirect to the homepage + */ +const AuthenticatedView = ({ children }: { children: React.ReactNode }) => { + const { user } = useAuth(); + const router = useRouter(); + + useEffect(() => { + if (user === null) { + router.replace("/"); + } + }, [user, router]); + + if (!user) return null; + + return children; +}; + +export default AuthenticatedView; diff --git a/src/frontend/src/features/layouts/components/main/index.tsx b/src/frontend/src/features/layouts/components/main/index.tsx index edd5d952..42f5f62e 100644 --- a/src/frontend/src/features/layouts/components/main/index.tsx +++ b/src/frontend/src/features/layouts/components/main/index.tsx @@ -3,18 +3,21 @@ import { HeaderRight } from "../header"; import { MailboxPanel } from "@/features/layouts/components/mailbox-panel"; import { PropsWithChildren } from "react"; import { GlobalLayout } from "../global/GlobalLayout"; +import AuthenticatedView from "./authenticated-view"; -export const MainLayout = ({ children }: PropsWithChildren<{}>) => { +export const MainLayout = ({ children }: PropsWithChildren) => { return ( - } - icon={logo} - rightHeaderContent={} - > - {children} - + + } + icon={logo} + rightHeaderContent={} + > + {children} + + ) } \ No newline at end of file