fix: update layouts for chat pages

app/chat/[id]/page.tsx

@@ -3,7 +3,6 @@ import { auth } from '@clerk/nextjs'
 
 import { Chat } from '@/components/chat'
 import { getChat } from '@/app/actions'
-import { Header } from '@/components/header'
 
 // export const runtime = 'edge'
 export const preferredRegion = 'home'
@@ -28,13 +27,5 @@ export default async function ChatPage({ params }: ChatPageProps) {
   const { user } = await auth()
   const chat = await getChat(params.id, user?.id ?? '')
 
-  return (
+  return <Chat id={chat.id} initialMessages={chat.messages} />
-    <div className="flex min-h-screen flex-col">
-      {/* @ts-ignore */}
-      <Header />
-      <main className="flex-1 bg-muted/50">
-        <Chat id={chat.id} initialMessages={chat.messages} />
-      </main>
-    </div>
-  )
 }

app/layout.tsx

@@ -1,12 +1,13 @@
 import { Metadata } from 'next'
 
+import { ClerkProvider } from '@clerk/nextjs'
+
 import '@/app/globals.css'
 import { fontMono, fontSans } from '@/lib/fonts'
 import { cn } from '@/lib/utils'
-import { Header } from '@/components/header'
 import { TailwindIndicator } from '@/components/tailwind-indicator'
 import { ThemeProvider } from '@/components/theme-provider'
-import { ClerkProvider } from '@clerk/nextjs'
+import { Header } from '@/components/header'
 
 export const metadata: Metadata = {
   title: {
@@ -42,7 +43,11 @@ export default function RootLayout({ children }: RootLayoutProps) {
           )}
         >
           <ThemeProvider attribute="class" defaultTheme="system" enableSystem>
-            {children}
+            <div className="flex min-h-screen flex-col">
+              {/* @ts-ignore */}
+              <Header />
+              <main className="flex-1 bg-muted/50">{children}</main>
+            </div>
             <TailwindIndicator />
           </ThemeProvider>
         </body>

app/page.tsx

@@ -1,6 +1,5 @@
 import { nanoid } from '@/lib/utils'
 import { Chat } from '@/components/chat'
-import { Header } from '@/components/header'
 
 // export const runtime = 'edge'
 export const preferredRegion = 'home'
@@ -8,13 +7,5 @@ export const preferredRegion = 'home'
 export default function IndexPage() {
   const id = nanoid()
 
-  return (
+  return <Chat id={id} />
-    <div className="flex min-h-screen flex-col">
-      {/* @ts-ignore */}
-      <Header />
-      <main className="flex-1 bg-muted/50">
-        <Chat id={id} />
-      </main>
-    </div>
-  )
 }