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,51 @@
+import { useEffect } from "react";
+import { Trash2 } from "lucide-react";
+import type { Particle } from "@/api/types";
+import { useNetwork } from "@/hooks/use-networks";
+import { resolveHumanDisplay } from "@/lib/humans";
+
+// How long to linger on a tombstone before auto-advancing. Matches the
+// "reading" cadence of a short text particle.
+const TOMBSTONE_DURATION_MS = 2000;
+
+interface DeletedParticleViewProps {
+  particle: Particle;
+  networkId: string;
+  paused: boolean;
+  onEnded: () => void;
+}
+
+export function DeletedParticleView({
+  particle,
+  networkId,
+  paused,
+  onEnded,
+}: DeletedParticleViewProps) {
+  const network = useNetwork(networkId);
+  const deleterId =
+    "deleted_by_human_id" in particle ? particle.deleted_by_human_id : undefined;
+  const deleter = deleterId
+    ? resolveHumanDisplay(deleterId, network?.humans)
+    : null;
+
+  useEffect(() => {
+    if (paused) return;
+
+    const timeout = setTimeout(onEnded, TOMBSTONE_DURATION_MS);
+    return () => clearTimeout(timeout);
+  }, [paused, onEnded, particle.id]);
+
+  return (
+    <div className="flex h-full w-full items-center justify-center bg-gradient-to-b from-black/40 via-black/20 to-black/40 px-8">
+      <div className="flex flex-col items-center gap-3 text-center">
+        <Trash2 className="text-white/40 size-6" />
+        <p className="text-white/70 text-base font-medium">
+          This particle was deleted
+        </p>
+        {deleter && (
+          <p className="text-white/40 text-xs">by {deleter.displayName}</p>
+        )}
+      </div>
+    </div>
+  );
+}