refactor: organize desktop vs. mobile into separate folders

2026-04-29 08:42:56 -07:00
parent 3d9fe67936
commit 3a11a82cd3
194 changed files with 213 additions and 213 deletions
@@ -0,0 +1,65 @@
+import type { Particle } from "@/api/types";
+import {
+  Card,
+  CardContent,
+  CardDescription,
+  CardHeader,
+  CardTitle,
+} from "@/components/ui/card";
+import { FileIcon, HelpCircleIcon, ScrollTextIcon, BookOpenIcon } from "lucide-react";
+import { useNetwork } from "@/hooks/use-networks";
+import { resolveHumanDisplay } from "@/lib/humans";
+
+const TYPE_META: Record<string, { icon: typeof FileIcon; label: string }> = {
+  quest: { icon: ScrollTextIcon, label: "Quest" },
+  paper: { icon: BookOpenIcon, label: "Paper" },
+  file: { icon: FileIcon, label: "File" },
+};
+
+interface FallbackParticleViewProps {
+  particle: Particle;
+  networkId: string;
+}
+
+export function FallbackParticleView({ particle, networkId }: FallbackParticleViewProps) {
+  const network = useNetwork(networkId);
+  const creator = resolveHumanDisplay(particle.created_by_human_id, network?.humans);
+  const meta = TYPE_META[particle.type] ?? {
+    icon: HelpCircleIcon,
+    label: particle.type,
+  };
+  const Icon = meta.icon;
+  const title = (() => {
+    switch (particle.type) {
+      case "quest":
+        return particle.properties.title;
+      case "paper":
+        return particle.properties.title;
+      case "file":
+        return particle.properties.filename;
+      case "folder":
+        return particle.properties.name;
+      default:
+        return null;
+    }
+  })();
+
+  return (
+    <div className="flex h-full w-full items-center justify-center p-8">
+      <Card className="w-full max-w-sm">
+        <CardHeader className="flex flex-row items-center gap-3">
+          <Icon className="text-muted-foreground h-6 w-6 shrink-0" />
+          <div>
+            <CardTitle className="text-base">{meta.label}</CardTitle>
+            {title && <CardDescription>{title}</CardDescription>}
+          </div>
+        </CardHeader>
+        <CardContent>
+          <p className="text-muted-foreground text-xs">
+            From {creator.displayName}
+          </p>
+        </CardContent>
+      </Card>
+    </div>
+  );
+}