KindeK
Kinde•2y ago•
2 replies
Woet

Next.js app router: is it safe to do the authenticated check in the layout?

In my current project I have added all the pages that need to be protected in the (firm) directory.

Is it safe to perform the isAuthenticated check within the layout for all these pages?

My use of the middleware would be a little more complicated, since I'm already adding a CSP configuration there that needs to be applied to both protected and non-protected pages. So if this would also be a safe option, it would make it a lot more simple for me, but I'm not sure if I'm overlooking some security implications here. 

import SideBar from "@/features/navigation/components/Sidebar";
import { getKindeServerSession } from "@kinde-oss/kinde-auth-nextjs/server";
import { redirect } from "next/navigation";

import getCurrentUser from "@/features/authentication/data/getCurrentUser";

export default async function FirmLayout({
  children,
}: {
  children: React.ReactNode;
}) {
  const { isAuthenticated, getPermission } = getKindeServerSession();
  const loggedIn = await isAuthenticated();
  const adminRead = (await getPermission("admin:read"))?.isGranted ?? false;

  if (!loggedIn) {
    redirect("/api/auth/login");
  }

  const { data } = await getCurrentUser();
  const { user } = data ?? {};

  return (
    <>
      <SideBar user={user} adminRead={adminRead}></SideBar>
      <main className="lg:pl-72">
        <div className="container mx-auto px-4 sm:px-6 lg:px-8">{children}</div>
      </main>
    </>
  );
}
image.png
Was this page helpful?