feat: implement sharing page

app/share/[id]/page.tsx

@@ -1,10 +1,11 @@
 import { type Metadata } from 'next'
-import { auth } from '@clerk/nextjs'
-
-import { Chat } from '@/components/chat'
-import { getChat, getSharedChat } from '@/app/actions'
 import { notFound } from 'next/navigation'
 
+import { formatDate } from '@/lib/utils'
+import { getSharedChat } from '@/app/actions'
+import { ChatList } from '@/components/chat-list'
+import { FooterText } from '@/components/footer'
+
 // export const runtime = 'edge'
 export const preferredRegion = 'home'
 
@@ -17,8 +18,8 @@ export interface SharePageProps {
 export async function generateMetadata({
   params
 }: SharePageProps): Promise<Metadata> {
-  const { user } = await auth()
-  const chat = await getChat(params.id, user?.id ?? '')
+  const chat = await getSharedChat(params.id)
+
   return {
     title: chat?.title.slice(0, 50) ?? 'Chat'
   }
@@ -31,5 +32,22 @@ export default async function SharePage({ params }: SharePageProps) {
     notFound()
   }
 
-  return <Chat id={chat.id} initialMessages={chat.messages} />
+  return (
+    <>
+      <div className="flex-1 space-y-6">
+        <div className="border-b bg-background px-4 py-6 md:px-6 md:py-8">
+          <div className="mx-auto max-w-2xl md:px-6">
+            <div className="space-y-1">
+              <h1 className="text-2xl font-bold">{chat.title}</h1>
+              <div className="text-sm text-muted-foreground">
+                {formatDate(chat.createdAt)} · {chat.messages.length} messages
+              </div>
+            </div>
+          </div>
+        </div>
+        <ChatList messages={chat.messages} />
+      </div>
+      <FooterText className="py-8" />
+    </>
+  )
 }