feat: rewrite messages page with split-pane layout, sub-nav, and search overlay

2026-07-28 10:42:12 +07:00
parent 1a0126f7b4
commit 5033161567
2 changed files with 280 additions and 165 deletions
@@ -0,0 +1,53 @@
+"use client";
+
+import { Loader2 } from "lucide-react";
+import { MessageCard } from "./message-card";
+import { Button } from "@/components/ui/button";
+import type { MessageRecord } from "@/lib/types";
+
+interface MessageListProps {
+  messages: MessageRecord[];
+  selectedId: string | null;
+  onSelect: (id: string) => void;
+  onReanalyze?: (id: string) => void;
+  hasMore?: boolean;
+  onLoadMore?: () => void;
+  isLoadingMore?: boolean;
+}
+
+export function MessageList({
+  messages,
+  selectedId: _selectedId,
+  onSelect,
+  onReanalyze,
+  hasMore,
+  onLoadMore,
+  isLoadingMore,
+}: MessageListProps) {
+  return (
+    <>
+      {messages.map((msg) => (
+        <MessageCard
+          key={msg.id}
+          message={msg}
+          onClick={onSelect}
+          onReanalyze={(id) => onReanalyze?.(id)}
+        />
+      ))}
+      {hasMore && (
+        <div className="flex justify-center py-4">
+          <Button
+            variant="outline"
+            size="sm"
+            onClick={onLoadMore}
+            disabled={isLoadingMore}
+            className="text-xs glass"
+          >
+            {isLoadingMore && <Loader2 className="size-3 animate-spin mr-1" />}
+            Load more
+          </Button>
+        </div>
+      )}
+    </>
+  );
+}