refactor: enhance organization redirection logic across dashboard lay…

apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/frameworks/layout.tsx

@@ -1,23 +1,8 @@
-import { getI18n } from "@/locales/server";
-import { auth } from "@/utils/auth";
-import { headers } from "next/headers";
-import { redirect } from "next/navigation";
-
 export default async function Layout({
 	children,
 }: {
 	children: React.ReactNode;
 }) {
-	const t = await getI18n();
-	const session = await auth.api.getSession({
-		headers: await headers(),
-	});
-
-	if (!session?.session?.activeOrganizationId) {
-		console.log("Redirect on layout.tsx");
-		redirect("/auth");
-	}
-
 	return (
 		<div className="max-w-[1200px] mx-auto">
 			<main className="mt-8">{children}</main>

apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/frameworks/page.tsx

@@ -2,9 +2,9 @@ import { getI18n } from "@/locales/server";
 import { auth } from "@/utils/auth";
 import { headers } from "next/headers";
 import { redirect } from "next/navigation";
+import PageWithBreadcrumb from "../../../../../../components/pages/PageWithBreadcrumb";
 import { FrameworksOverview } from "./components/FrameworksOverview";
 import { getAllFrameworkInstancesWithControls } from "./data/getAllFrameworkInstancesWithControls";
-import PageWithBreadcrumb from "../../../../../../components/pages/PageWithBreadcrumb";
 
 export async function generateMetadata() {
 	const t = await getI18n();

apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/layout.tsx

@@ -38,6 +38,10 @@ export default async function Layout({
 		redirect("/");
 	}
 
+	if (!session?.session.activeOrganizationId) {
+		redirect("/");
+	}
+
 	return (
 		<SidebarProvider initialIsCollapsed={isCollapsed}>
 			<AnimatedLayout sidebar={<Sidebar />} isCollapsed={isCollapsed}>

apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/page.tsx

@@ -1,17 +1,11 @@
-import { auth } from "@/utils/auth";
-import { headers } from "next/headers";
 import { redirect } from "next/navigation";
 
-export default async function DashboardPage() {
-	const session = await auth.api.getSession({
-		headers: await headers(),
-	});
-
-	const organizationId = session?.session.activeOrganizationId;
-
-	if (!organizationId) {
-		redirect("/");
-	}
+export default async function DashboardPage({
+	params,
+}: {
+	params: Promise<{ orgId: string }>;
+}) {
+	const organizationId = (await params).orgId;
 
 	redirect(`/${organizationId}/frameworks`);
 }

apps/app/src/app/[locale]/(app)/setup/page.tsx

@@ -1,4 +1,4 @@
-import { Onboarding } from "@/components/forms/create-organization-form";
+import { OnboardingClient } from "@/components/forms/create-organization-form";
 import { auth } from "@/utils/auth";
 import { db } from "@comp/db";
 import type { Metadata } from "next";
@@ -11,16 +11,15 @@ export const metadata: Metadata = {
 };
 
 export default async function Page() {
+	const headersList = await headers();
+
 	const session = await auth.api.getSession({
-		headers: await headers(),
+		headers: headersList,
 	});
 
-	const hasInvite = await db.invitation.findFirst({
-		where: {
-			email: session?.user.email,
-			status: "pending",
-		},
-	});
+	if (session?.session?.activeOrganizationId) {
+		redirect(`/${session.session.activeOrganizationId}/frameworks`);
+	}
 
 	const organization = await db.organization.findFirst({
 		where: {
@@ -34,23 +33,24 @@ export default async function Page() {
 
 	if (!session?.session?.activeOrganizationId && organization?.id) {
 		await auth.api.setActiveOrganization({
-			headers: await headers(),
+			headers: headersList,
 			body: {
 				organizationId: organization.id,
 			},
 		});
-		redirect("/");
-	} else if (session?.session?.activeOrganizationId) {
-		redirect("/");
+		redirect(`/${organization.id}/frameworks`);
 	}
 
-	if (session?.session?.activeOrganizationId) {
-		redirect("/");
-	}
+	const hasInvite = await db.invitation.findFirst({
+		where: {
+			email: session?.user.email,
+			status: "pending",
+		},
+	});
 
 	if (hasInvite) {
 		return <AcceptInvite inviteCode={hasInvite.id} />;
 	}
 
-	return <Onboarding />;
+	return <OnboardingClient />;
 }

apps/app/src/app/[locale]/(public)/auth/page.tsx

@@ -5,52 +5,51 @@ import type { Metadata } from "next";
 import Link from "next/link";
 
 export const metadata: Metadata = {
-  title: "Login | Comp AI",
+	title: "Login | Comp AI",
 };
 
 export default async function Page({
-  searchParams,
+	searchParams,
 }: {
-  searchParams: Promise<{ inviteCode?: string }>;
+	searchParams: Promise<{ inviteCode?: string }>;
 }) {
-  const t = await getI18n();
-
-  const { inviteCode } = await searchParams;
-
-  const defaultSignInOptions = (
-    <div className="flex flex-col space-y-2">
-      <GoogleSignIn inviteCode={inviteCode} />
-    </div>
-  );
-
-
-  return (
-    <>
-      <div className="flex min-h-[calc(100vh-15rem)] items-center justify-center overflow-hidden p-6 md:p-0">
-        <div className="relative z-20 m-auto flex w-full max-w-[380px] flex-col py-8">
-          <div className="relative flex w-full flex-col">
-            <div className="inline-block from-primary bg-clip-text pb-4">
-              <div className="flex flex-row items-center gap-2">
-                <Link href="/" className="flex flex-row items-center gap-2">
-                  <h1 className="font-mono text-xl font-semibold">Comp AI</h1>
-                </Link>
-              </div>
-              <h2 className="mt-4 text-lg font-medium">{t("auth.title")}</h2>
-              <div className="mt-2">
-                <span className="text-xs text-muted-foreground">
-                  {t("auth.description")}
-                </span>
-              </div>
-            </div>
-
-            <div className="pointer-events-auto mb-6 flex flex-col">
-              {defaultSignInOptions}
-            </div>
-
-            <p className="text-xs text-muted-foreground">{t("auth.terms")}</p>
-          </div>
-        </div>
-      </div>
-    </>
-  );
+	const t = await getI18n();
+
+	const { inviteCode } = await searchParams;
+
+	const defaultSignInOptions = (
+		<div className="flex flex-col space-y-2">
+			<GoogleSignIn inviteCode={inviteCode} />
+		</div>
+	);
+
+	return (
+		<>
+			<div className="flex min-h-[calc(100vh-15rem)] items-center justify-center overflow-hidden p-6 md:p-0">
+				<div className="relative z-20 m-auto flex w-full max-w-[380px] flex-col p-8 border">
+					<div className="relative flex w-full flex-col">
+						<div className="inline-block from-primary bg-clip-text pb-4">
+							<div className="flex flex-row items-center gap-2">
+								<Link href="/" className="flex flex-row items-center gap-2">
+									<h1 className="font-mono text-xl font-semibold">Comp AI</h1>
+								</Link>
+							</div>
+							<h2 className="mt-4 text-lg font-medium">{t("auth.title")}</h2>
+							<div className="mt-2">
+								<span className="text-xs text-muted-foreground">
+									{t("auth.description")}
+								</span>
+							</div>
+						</div>
+
+						<div className="pointer-events-auto mb-6 flex flex-col">
+							{defaultSignInOptions}
+						</div>
+
+						<p className="text-xs text-muted-foreground">{t("auth.terms")}</p>
+					</div>
+				</div>
+			</div>
+		</>
+	);
 }

apps/app/src/components/forms/create-organization-form.tsx

@@ -29,19 +29,15 @@ import { toast } from "sonner";
 import type { z } from "zod";
 import { LogoSpinner } from "../logo-spinner";
 
-function OnboardingClient() {
+export function OnboardingClient() {
 	const [isCreatingOrganization, setIsCreatingOrganization] = useState(false);
 	const router = useRouter();
-
 	const t = useI18n();
 
 	const createOrganization = useAction(createOrganizationAction, {
 		onSuccess: async () => {
 			toast.success(t("onboarding.success"));
-
-			setTimeout(() => {
-				router.push("/");
-			}, 2000);
+			router.push("/");
 		},
 		onError: () => {
 			toast.error(t("common.actions.error"));
@@ -51,17 +47,8 @@ function OnboardingClient() {
 		},
 	});
 
-	const form = useForm<z.infer<typeof organizationSchema>>({
-		resolver: zodResolver(organizationSchema),
-		defaultValues: {
-			name: "",
-			frameworks: [],
-		},
-		mode: "onChange",
-	});
-
 	const onSubmit = async (data: z.infer<typeof organizationSchema>) => {
-		const organization = await authClient.organization.create({
+		await authClient.organization.create({
 			name: data.name,
 			slug: data.name,
 		});
@@ -71,6 +58,15 @@ function OnboardingClient() {
 		});
 	};
 
+	const form = useForm<z.infer<typeof organizationSchema>>({
+		resolver: zodResolver(organizationSchema),
+		defaultValues: {
+			name: "",
+			frameworks: [],
+		},
+		mode: "onChange",
+	});
+
 	if (isCreatingOrganization) {
 		return (
 			<div className="flex min-h-screen items-center justify-center bg-background p-6 md:p-8">
@@ -216,7 +212,3 @@ function OnboardingClient() {
 		</div>
 	);
 }
-
-export function Onboarding() {
-	return <OnboardingClient />;
-}

apps/app/src/components/google-sign-in.tsx

@@ -2,12 +2,11 @@
 
 import { ButtonIcon } from "@/components/ui/button-icon";
 import { useI18n } from "@/locales/client";
+import { authClient } from "@/utils/auth-client";
 import { Button } from "@comp/ui/button";
 import { Icons } from "@comp/ui/icons";
 import { Loader2 } from "lucide-react";
-import { authClient } from "@/utils/auth-client";
 import { useState } from "react";
-import router from "next/router";
 
 export function GoogleSignIn({
 	inviteCode,