test

app/dashboard/chats/[id]/page.tsx

@@ -0,0 +1,18 @@
+import React from "react";
+import { Metadata } from "next";
+import ChatDetail from "@/components/dashboard/ChatDetail";
+
+export const metadata: Metadata = {
+  title: "Chat Conversation",
+  description: "View and respond to customer messages",
+};
+
+export default function ChatDetailPage({ params }: { params: { id: string } }) {
+  return (
+    <div className="container mx-auto py-6 space-y-6">
+      <div className="grid grid-cols-1 gap-6">
+        <ChatDetail chatId={params.id} />
+      </div>
+    </div>
+  );
+} 

app/dashboard/chats/new/page.tsx

@@ -0,0 +1,18 @@
+import React from "react";
+import { Metadata } from "next";
+import NewChatForm from "@/components/dashboard/NewChatForm";
+
+export const metadata: Metadata = {
+  title: "Start New Chat",
+  description: "Begin a new conversation with a customer",
+};
+
+export default function NewChatPage() {
+  return (
+    <div className="container mx-auto py-6 space-y-6">
+      <div className="grid grid-cols-1 gap-6">
+        <NewChatForm />
+      </div>
+    </div>
+  );
+} 

app/dashboard/chats/page.tsx

@@ -0,0 +1,22 @@
+import React from "react";
+import { Metadata } from "next";
+import ChatList from "@/components/dashboard/ChatList";
+
+export const metadata: Metadata = {
+  title: "Customer Chats",
+  description: "Manage conversations with your customers",
+};
+
+export default function ChatsPage() {
+  return (
+    <div className="container mx-auto py-6 space-y-6">
+      <div className="flex items-center justify-between">
+        <h1 className="text-3xl font-bold tracking-tight">Customer Chats</h1>
+      </div>
+      
+      <div className="grid grid-cols-1 gap-6">
+        <ChatList />
+      </div>
+    </div>
+  );
+}