import { signIn, useSession } from "next-auth/react";
import { useRouter } from "next/router";
import { useEffect } from "react";
export function AuthGuard({ children }: { children: JSX.Element }) {
const { status, data: session } = useSession();
const router = useRouter();
const adminRoutes = ["/admin"];
const isAdminRoute = adminRoutes.some((route) =>
router.pathname.startsWith(route)
);
const isRootRoute = router.pathname === "/";
const isDashboardRouteAndIdNotSet =
router.pathname.startsWith("/dashboard") && !router.query.companySlug;
useEffect(() => {
if (status !== "loading") {
//auth is initialized and there is no user
if (!session) {
void signIn();
}
}
}, [router, status, session]);
/* show loading indicator while the auth provider is still initializing */
if (status === "loading") {
return (
<div className="flex min-h-screen items-center justify-center">
<h1 className="text-5xl">Securing route</h1>
</div>
);
}
// if auth initialized with a valid user show protected page
if (session) {
// if user tries to access root route or /dashboard without a slug and is logged in, redirect to dashboard/[companySlug]
if (isRootRoute || isDashboardRouteAndIdNotSet) {
console.log("redirecting to dashboard");
const companyName = session.user?.companies[0]?.name;
void router.push(`/dashboard/${companyName}`);
return null;
}
const isSuperAdmin = session.user?.role === "SUPERADMIN";
// if user is not admin and tries to access admin routes, redirect to home
if (!isSuperAdmin && isAdminRoute) {
void router.push("/");
return null;
}
return <>{children}</>;
}
/* otherwise don't return anything, will do a redirect from useEffect */
return null;
}
import { signIn, useSession } from "next-auth/react";
import { useRouter } from "next/router";
import { useEffect } from "react";
export function AuthGuard({ children }: { children: JSX.Element }) {
const { status, data: session } = useSession();
const router = useRouter();
const adminRoutes = ["/admin"];
const isAdminRoute = adminRoutes.some((route) =>
router.pathname.startsWith(route)
);
const isRootRoute = router.pathname === "/";
const isDashboardRouteAndIdNotSet =
router.pathname.startsWith("/dashboard") && !router.query.companySlug;
useEffect(() => {
if (status !== "loading") {
//auth is initialized and there is no user
if (!session) {
void signIn();
}
}
}, [router, status, session]);
/* show loading indicator while the auth provider is still initializing */
if (status === "loading") {
return (
<div className="flex min-h-screen items-center justify-center">
<h1 className="text-5xl">Securing route</h1>
</div>
);
}
// if auth initialized with a valid user show protected page
if (session) {
// if user tries to access root route or /dashboard without a slug and is logged in, redirect to dashboard/[companySlug]
if (isRootRoute || isDashboardRouteAndIdNotSet) {
console.log("redirecting to dashboard");
const companyName = session.user?.companies[0]?.name;
void router.push(`/dashboard/${companyName}`);
return null;
}
const isSuperAdmin = session.user?.role === "SUPERADMIN";
// if user is not admin and tries to access admin routes, redirect to home
if (!isSuperAdmin && isAdminRoute) {
void router.push("/");
return null;
}
return <>{children}</>;
}
/* otherwise don't return anything, will do a redirect from useEffect */
return null;
}