"use client";

import { useEffect } from "react";
import { useRouter } from "next/navigation";
import { useAuth } from "@/hooks/use-auth";
import { WorkspaceShell } from "@/components/layout/workspace-shell";

/**
 * (app) group layout: client-side session gate. The middleware already
 * redirects unauthenticated visitors; this hook double-checks (e.g. expired
 * token discovered by the API) and bails to /login with the current path.
 */
export default function AppLayout({ children }: { children: React.ReactNode }) {
  const { user, initializing } = useAuth();
  const router = useRouter();

  useEffect(() => {
    if (!initializing && !user) {
      const next = window.location.pathname + window.location.search;
      router.replace(`/login?next=${encodeURIComponent(next)}`);
    }
  }, [initializing, user, router]);

  if (initializing || !user) {
    return (
      <div className="flex min-h-screen items-center justify-center bg-background">
        <div className="flex items-center gap-3 text-sm text-muted-foreground" role="status">
          <span className="size-4 animate-spin rounded-full border-2 border-muted-foreground/30 border-t-foreground" />
          Loading workspace…
        </div>
      </div>
    );
  }

  return <WorkspaceShell>{children}</WorkspaceShell>;
}