From abd9682f5e51e2e5ed271ac0e03fff411e8211a5 Mon Sep 17 00:00:00 2001
From: Ajax Davis <thomasalwyndavis@gmail.com>
Date: Fri, 2 Jan 2026 02:52:17 +1000
Subject: [PATCH] fix: add AppHeader to dashboard pages for consistent
 navigation

- Add AppHeader component to dashboard main page
- Add AppHeader to collections list page (loading, error, and main states)
- Add AppHeader to collection detail page (loading, error, and main states)

Ensures top navigation menu is visible on all dashboard pages for
both authenticated and unauthenticated users.
---
 apps/web/src/app/dashboard/collections/[id]/page.tsx | 4 ++++
 apps/web/src/app/dashboard/collections/page.tsx      | 4 ++++
 apps/web/src/app/dashboard/page.tsx                  | 2 ++
 3 files changed, 10 insertions(+)

diff --git a/apps/web/src/app/dashboard/collections/[id]/page.tsx b/apps/web/src/app/dashboard/collections/[id]/page.tsx
index a158527..5337279 100644
--- a/apps/web/src/app/dashboard/collections/[id]/page.tsx
+++ b/apps/web/src/app/dashboard/collections/[id]/page.tsx
@@ -6,6 +6,7 @@ import { Icon } from '@tpmjs/ui/Icon/Icon';
 import Link from 'next/link';
 import { useParams, useRouter } from 'next/navigation';
 import { useCallback, useEffect, useState } from 'react';
+import { AppHeader } from '~/components/AppHeader';
 import { AddToolSearch } from '~/components/collections/AddToolSearch';
 import { CollectionForm } from '~/components/collections/CollectionForm';
 import { CollectionToolList } from '~/components/collections/CollectionToolList';
@@ -221,6 +222,7 @@ export default function CollectionDetailPage(): React.ReactElement {
   if (isLoading) {
     return (
       <div className="min-h-screen bg-background">
+        <AppHeader />
         <div className="max-w-4xl mx-auto py-12 px-4">
           <div className="animate-pulse">
             <div className="h-8 bg-surface-secondary rounded w-48 mb-4" />
@@ -240,6 +242,7 @@ export default function CollectionDetailPage(): React.ReactElement {
   if (error || !collection) {
     return (
       <div className="min-h-screen bg-background">
+        <AppHeader />
         <div className="max-w-4xl mx-auto py-12 px-4">
           <div className="text-center py-16">
             <Icon icon="alertCircle" size="lg" className="mx-auto text-error mb-4" />
@@ -258,6 +261,7 @@ export default function CollectionDetailPage(): React.ReactElement {
 
   return (
     <div className="min-h-screen bg-background">
+      <AppHeader />
       <div className="max-w-4xl mx-auto py-12 px-4">
         {/* Header */}
         <div className="flex items-center gap-4 mb-6">
diff --git a/apps/web/src/app/dashboard/collections/page.tsx b/apps/web/src/app/dashboard/collections/page.tsx
index 97725f5..3e865d7 100644
--- a/apps/web/src/app/dashboard/collections/page.tsx
+++ b/apps/web/src/app/dashboard/collections/page.tsx
@@ -5,6 +5,7 @@ import { Icon } from '@tpmjs/ui/Icon/Icon';
 import Link from 'next/link';
 import { useRouter } from 'next/navigation';
 import { useCallback, useEffect, useState } from 'react';
+import { AppHeader } from '~/components/AppHeader';
 import { CollectionForm } from '~/components/collections/CollectionForm';
 import { CollectionList } from '~/components/collections/CollectionList';
 
@@ -110,6 +111,7 @@ export default function CollectionsPage(): React.ReactElement {
   if (isLoading) {
     return (
       <div className="min-h-screen bg-background">
+        <AppHeader />
         <div className="max-w-6xl mx-auto py-12 px-4">
           <div className="animate-pulse">
             <div className="h-8 bg-surface-secondary rounded w-48 mb-8" />
@@ -127,6 +129,7 @@ export default function CollectionsPage(): React.ReactElement {
   if (error) {
     return (
       <div className="min-h-screen bg-background">
+        <AppHeader />
         <div className="max-w-6xl mx-auto py-12 px-4">
           <div className="text-center py-16">
             <Icon icon="alertCircle" size="lg" className="mx-auto text-error mb-4" />
@@ -141,6 +144,7 @@ export default function CollectionsPage(): React.ReactElement {
 
   return (
     <div className="min-h-screen bg-background">
+      <AppHeader />
       <div className="max-w-6xl mx-auto py-12 px-4">
         {/* Header */}
         <div className="flex items-center justify-between mb-8">
diff --git a/apps/web/src/app/dashboard/page.tsx b/apps/web/src/app/dashboard/page.tsx
index 14a76f3..fff6c0c 100644
--- a/apps/web/src/app/dashboard/page.tsx
+++ b/apps/web/src/app/dashboard/page.tsx
@@ -1,3 +1,4 @@
+import { AppHeader } from '@/components/AppHeader';
 import { SignOutButton } from '@/components/auth/SignOutButton';
 import { auth } from '@/lib/auth';
 import { Icon } from '@tpmjs/ui/Icon/Icon';
@@ -16,6 +17,7 @@ export default async function DashboardPage() {
 
   return (
     <div className="min-h-screen bg-background">
+      <AppHeader />
       <div className="max-w-4xl mx-auto py-12 px-4">
         <div className="flex items-center justify-between mb-8">
           <h1 className="text-2xl font-bold text-foreground">Dashboard</h1>