improve window management and title bar

2026-02-21 12:42:43 -08:00
parent 59b973802d
commit 8546260493
26 changed files with 229 additions and 25 deletions
@@ -0,0 +1,93 @@
+import type { StreamParticle } from "@/api/types";
+import { getParticleData } from "@/api/types";
+import {
+  MessageSquare,
+  Video,
+  Mic,
+  ScrollText,
+  BookOpen,
+  FileIcon,
+  FolderIcon,
+} from "lucide-react";
+
+interface ParticlePreviewProps {
+  particle: StreamParticle;
+}
+
+export function ParticlePreview({ particle }: ParticlePreviewProps) {
+  switch (particle.type) {
+    case "text": {
+      const data = getParticleData(particle, "text");
+      return (
+        <div className="flex items-start gap-2">
+          <MessageSquare className="text-muted-foreground mt-0.5 h-3.5 w-3.5 shrink-0" />
+          <p className="text-muted-foreground line-clamp-2 text-xs">
+            {data.content}
+          </p>
+        </div>
+      );
+    }
+    case "media": {
+      const data = getParticleData(particle, "media");
+      const isVideo = data.mime_type.startsWith("video");
+      const Icon = isVideo ? Video : Mic;
+      const label = isVideo ? "Video" : "Audio";
+      const seconds = Math.round(data.duration_ms / 1000);
+      return (
+        <div className="flex items-center gap-2">
+          <Icon className="text-muted-foreground h-3.5 w-3.5 shrink-0" />
+          <span className="text-muted-foreground text-xs">
+            {label} · {seconds}s
+          </span>
+        </div>
+      );
+    }
+    case "quest": {
+      const data = getParticleData(particle, "quest");
+      return (
+        <div className="flex items-center gap-2">
+          <ScrollText className="text-muted-foreground h-3.5 w-3.5 shrink-0" />
+          <span className="text-muted-foreground truncate text-xs">
+            {data.title}
+            {data.status && ` · ${data.status}`}
+          </span>
+        </div>
+      );
+    }
+    case "paper": {
+      const data = getParticleData(particle, "paper");
+      return (
+        <div className="flex items-center gap-2">
+          <BookOpen className="text-muted-foreground h-3.5 w-3.5 shrink-0" />
+          <span className="text-muted-foreground truncate text-xs">
+            {data.title}
+          </span>
+        </div>
+      );
+    }
+    case "file": {
+      const data = getParticleData(particle, "file");
+      return (
+        <div className="flex items-center gap-2">
+          <FileIcon className="text-muted-foreground h-3.5 w-3.5 shrink-0" />
+          <span className="text-muted-foreground truncate text-xs">
+            {data.filename}
+          </span>
+        </div>
+      );
+    }
+    case "folder": {
+      const data = getParticleData(particle, "folder");
+      return (
+        <div className="flex items-center gap-2">
+          <FolderIcon className="text-muted-foreground h-3.5 w-3.5 shrink-0" />
+          <span className="text-muted-foreground truncate text-xs">
+            {data.name}
+          </span>
+        </div>
+      );
+    }
+    default:
+      return null;
+  }
+}