From 07efa32cfb5bdd883534151bfc17cf24c3643e94 Mon Sep 17 00:00:00 2001
From: Marko Djordjevic <marko.homoludens@gmail.com>
Date: Fri, 20 Feb 2026 13:15:41 +0100
Subject: [PATCH] Task 8.3: Create src/app/app/layout.tsx with SessionProvider
 and nav bar

Protected app layout wrapping all /app/* pages with SessionProvider from
next-auth/react. Includes a minimal fixed nav bar with an app title link,
a settings link to /app/settings, and a placeholder slot for the user menu
dropdown (to be implemented in task 13.1).

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 openspec/changes/user-accounts/tasks.md |  2 +-
 src/app/app/layout.tsx                  | 59 +++++++++++++++++++++++++
 2 files changed, 60 insertions(+), 1 deletion(-)
 create mode 100644 src/app/app/layout.tsx

diff --git a/openspec/changes/user-accounts/tasks.md b/openspec/changes/user-accounts/tasks.md
index e4c6f06..5cfa551 100644
--- a/openspec/changes/user-accounts/tasks.md
+++ b/openspec/changes/user-accounts/tasks.md
@@ -46,7 +46,7 @@
 
 - [x] 8.1 `[haiku]` Create `src/app/(public)/layout.tsx` — minimal layout for public pages (shared fonts/theme, no sidebar)
 - [x] 8.2 `[haiku]` Move current `src/app/page.tsx` to `src/app/app/page.tsx` (workspace at `/app`)
-- [ ] 8.3 `[sonnet]` Create `src/app/app/layout.tsx` — protected layout with `SessionProvider`, user menu nav bar, sidebar with settings link
+- [x] 8.3 `[sonnet]` Create `src/app/app/layout.tsx` — protected layout with `SessionProvider`, user menu nav bar, sidebar with settings link
 - [ ] 8.4 `[haiku]` Update any hardcoded `/` links in existing components to `/app`
 
 ## 9. Landing Page
diff --git a/src/app/app/layout.tsx b/src/app/app/layout.tsx
new file mode 100644
index 0000000..312c704
--- /dev/null
+++ b/src/app/app/layout.tsx
@@ -0,0 +1,59 @@
+'use client';
+
+import { SessionProvider } from 'next-auth/react';
+import Link from 'next/link';
+import { Settings } from 'lucide-react';
+
+/**
+ * Protected app layout.
+ *
+ * Wraps all /app/* pages with SessionProvider so that auth hooks
+ * (useSession, signIn, signOut) are available throughout the workspace.
+ *
+ * Contains a minimal top nav bar with:
+ *  - App title / home link
+ *  - Settings link (→ /app/settings)
+ *  - Placeholder slot for the user menu (task 13.1)
+ *
+ * The full user-menu dropdown (avatar, sign-out, etc.) is wired up in task 13.1.
+ */
+export default function AppLayout({
+  children,
+}: Readonly<{
+  children: React.ReactNode;
+}>) {
+  return (
+    <SessionProvider>
+      {/* Minimal nav bar — user menu dropdown added in task 13.1 */}
+      <header className="fixed top-0 inset-x-0 z-50 h-10 flex items-center justify-between px-4 bg-background border-b border-border">
+        <Link
+          href="/app"
+          className="text-sm font-semibold text-foreground tracking-tight hover:opacity-80 transition-opacity"
+        >
+          Candle Annotator
+        </Link>
+
+        <nav className="flex items-center gap-2">
+          {/* Settings link */}
+          <Link
+            href="/app/settings"
+            className="flex items-center gap-1.5 px-2 py-1 text-xs text-muted-foreground hover:text-foreground rounded hover:bg-secondary/50 transition-colors"
+          >
+            <Settings className="w-3.5 h-3.5" />
+            Settings
+          </Link>
+
+          {/* User menu placeholder — implemented in task 13.1 */}
+          <div className="w-7 h-7 rounded-full bg-secondary/50 flex items-center justify-center text-xs text-muted-foreground" aria-label="User menu (coming soon)">
+            ?
+          </div>
+        </nav>
+      </header>
+
+      {/* Push content below the fixed nav bar */}
+      <div className="pt-10 h-screen">
+        {children}
+      </div>
+    </SessionProvider>
+  );
+}