e1d2bf11da
Lets a particle's creator delete their own message from the TopBar dropdown. Other viewers see a "This particle was deleted" tombstone in place and playback auto-advances after ~2s, keeping indices stable for concurrent watchers. - Add optional deleted_at / deleted_by_human_id to non-container particle variants and isParticleDeleted helper. - Add softDeleteParticle Firestore helper. - New DeleteParticleOverlay confirmation and DeletedParticleView tombstone. - Hide reactions (bar + 1-7 keybinding) on tombstoned particles. - Show "Deleted particle" + Trash2 icon in the stream list preview. Closes #146 https://claude.ai/code/session_01M2ShnZPvWfQzzvuu3Xm8b9 Co-authored-by: Claude <[email protected]>
51 lines
1.5 KiB
TypeScript
51 lines
1.5 KiB
TypeScript
import { useEffect } from "react";
|
|
import { Trash2 } from "lucide-react";
|
|
import type { Particle } from "@/api/types";
|
|
import { useNetwork } from "@/hooks/use-networks";
|
|
|
|
// 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
|
|
? network?.humans?.find((h) => h.id === deleterId)
|
|
: undefined;
|
|
|
|
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.email_prefix}</p>
|
|
)}
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|