diff --git a/.agents/skills/clerk-nextjs-patterns/templates/nextjs-basic-auth/app/layout.tsx b/.agents/skills/clerk-nextjs-patterns/templates/nextjs-basic-auth/app/layout.tsx index aec51d9..b13ee1e 100644 --- a/.agents/skills/clerk-nextjs-patterns/templates/nextjs-basic-auth/app/layout.tsx +++ b/.agents/skills/clerk-nextjs-patterns/templates/nextjs-basic-auth/app/layout.tsx @@ -1,5 +1,15 @@ import { ClerkProvider, Show, SignInButton, SignUpButton, UserButton } from '@clerk/nextjs' +/** + * Wraps the application with the root HTML structure and Clerk authentication provider. + * + * Renders an and , nests a ClerkProvider that supplies auth state, displays + * sign-in and sign-up controls when the user is signed out and a user menu when signed in, + * then renders the provided children beneath the header. + * + * @param children - The page or app content to render inside the layout + * @returns The top-level HTML element containing the ClerkProvider, header, and `children` + */ export default function RootLayout({ children }: { children: React.ReactNode }) { return ( diff --git a/.agents/skills/clerk-nextjs-patterns/templates/nextjs-basic-auth/app/page.tsx b/.agents/skills/clerk-nextjs-patterns/templates/nextjs-basic-auth/app/page.tsx index 3e62e69..e163515 100644 --- a/.agents/skills/clerk-nextjs-patterns/templates/nextjs-basic-auth/app/page.tsx +++ b/.agents/skills/clerk-nextjs-patterns/templates/nextjs-basic-auth/app/page.tsx @@ -1,3 +1,8 @@ +/** + * Render the Home page. + * + * @returns A React element containing an `

` with the text "Home". + */ export default function Home() { return

Home

} diff --git a/app/editor/layout.tsx b/app/editor/layout.tsx index 57821e6..04cc517 100644 --- a/app/editor/layout.tsx +++ b/app/editor/layout.tsx @@ -1,5 +1,10 @@ import { EditorLayout } from "@/components/editor/editor-layout" +/** + * Wraps its children inside the EditorLayout component. + * + * @returns A React element rendering `EditorLayout` containing the given `children`. + */ export default function ProtectedEditorLayout({ children, }: Readonly<{ diff --git a/app/editor/page.tsx b/app/editor/page.tsx index 3465017..1d3736a 100644 --- a/app/editor/page.tsx +++ b/app/editor/page.tsx @@ -1,3 +1,11 @@ +/** + * Page component that renders a centered "Ghost AI" heading. + * + * Renders a full-height flex container that centers its content and displays + * the heading text "Ghost AI" with prominent styling. + * + * @returns A JSX element containing the centered container and heading. + */ export default function EditorPage() { return (
diff --git a/app/layout.tsx b/app/layout.tsx index f29c0e5..167d5ab 100644 --- a/app/layout.tsx +++ b/app/layout.tsx @@ -40,6 +40,12 @@ const clerkAppearance = { }, }; +/** + * Root layout component that wraps the application with Clerk authentication and global styles. + * + * @param children - The page content to render inside the layout + * @returns The React element rendering the app wrapped in a `ClerkProvider` and an `html`/`body` scaffold with configured fonts and dark-theme classes + */ export default function RootLayout({ children, }: Readonly<{ diff --git a/app/page.tsx b/app/page.tsx index 6ead600..680c3b6 100644 --- a/app/page.tsx +++ b/app/page.tsx @@ -1,6 +1,11 @@ import { auth } from "@clerk/nextjs/server"; import { redirect } from "next/navigation"; +/** + * Redirects the request to "/editor" when a user is authenticated, otherwise redirects to "/sign-in". + * + * The function decides the destination solely from the current authentication state and performs an immediate navigation redirect. + */ export default async function Home() { const { userId } = await auth(); diff --git a/app/sign-in/[[...sign-in]]/page.tsx b/app/sign-in/[[...sign-in]]/page.tsx index a2fddb8..6418679 100644 --- a/app/sign-in/[[...sign-in]]/page.tsx +++ b/app/sign-in/[[...sign-in]]/page.tsx @@ -2,6 +2,16 @@ import { SignIn } from "@clerk/nextjs" import { AuthPageShell } from "@/components/auth/auth-page-shell" +/** + * Renders the sign-in page using the AuthPageShell and Clerk's SignIn component. + * + * The embedded SignIn is configured to use path-based routing at `/sign-in`, will + * redirect to `/editor` when no target is determined, and uses the + * `NEXT_PUBLIC_CLERK_SIGN_UP_URL` environment variable for the sign-up URL if set, + * falling back to `/sign-up` otherwise. + * + * @returns The React element for the sign-in page. + */ export default function SignInPage() { return ( diff --git a/components/editor/editor-navbar.tsx b/components/editor/editor-navbar.tsx index bca4572..fb15a3e 100644 --- a/components/editor/editor-navbar.tsx +++ b/components/editor/editor-navbar.tsx @@ -12,6 +12,16 @@ type EditorNavbarProps = { className?: string } +/** + * Renders the editor top navbar with a sidebar toggle and user account button. + * + * Renders a header containing a left-aligned sidebar toggle button (icon and ARIA state reflect `isSidebarOpen`), an empty center region, and a right-aligned Clerk `UserButton`. The `onSidebarToggle` callback is invoked when the toggle button is clicked. + * + * @param isSidebarOpen - Whether the projects sidebar is currently open; controls the toggle icon and `aria-pressed` state. + * @param onSidebarToggle - Click handler invoked to toggle the sidebar state. + * @param className - Optional additional CSS classes applied to the header container. + * @returns The navbar header element containing the toggle button and user button. + */ function EditorNavbar({ isSidebarOpen, onSidebarToggle,