Move to clerk

app/chat/[id]/page.tsx

@@ -1,8 +1,9 @@
 import { type Metadata } from 'next'
-import { auth } from '@/auth'
 
 import { Chat } from '@/components/chat'
 import { getChat } from '@/app/actions'
+import { Header } from '@/components/header'
+import { auth } from '@clerk/nextjs'
 
 // export const runtime = 'edge'
 export const preferredRegion = 'home'
@@ -16,16 +17,24 @@ export interface ChatPageProps {
 export async function generateMetadata({
   params
 }: ChatPageProps): Promise<Metadata> {
-  const session = await auth()
-  const chat = await getChat(params.id, session?.user?.email ?? '')
+  const { user } = await auth()
+  const chat = await getChat(params.id, user?.id ?? '')
   return {
     title: chat?.title.slice(0, 50) ?? 'Chat'
   }
 }
 
 export default async function ChatPage({ params }: ChatPageProps) {
-  const session = await auth()
-  const chat = await getChat(params.id, session?.user?.email ?? '')
+  const { user } = await auth()
+  const chat = await getChat(params.id, user?.id ?? '')
 
-  return <Chat id={chat.id} initialMessages={chat.messages} />
+  return (
+    <div className="flex flex-col min-h-screen">
+      {/* @ts-ignore */}
+      <Header />
+      <main className="flex-1 bg-muted/50">
+        <Chat id={chat.id} initialMessages={chat.messages} />
+      </main>
+    </div>
+  )
 }