diff --git a/js/src/features/particles/particle-list-view.tsx b/js/src/features/particles/particle-list-view.tsx index 529fd20..ae9d1a4 100644 --- a/js/src/features/particles/particle-list-view.tsx +++ b/js/src/features/particles/particle-list-view.tsx @@ -28,8 +28,38 @@ import { isParticleDeleted, type Particle, type StreamProperties } from "@/api/t import type { StreamParticle } from "@/hooks/use-stream-particles"; import { useNetwork } from "@/hooks/use-networks"; import { useStreamAutoplay } from "@/hooks/use-stream-autoplay"; +import { useDownloadUrl } from "@/hooks/use-download-url"; import { StreamContextMenu } from "@/features/particles/stream-context-menu"; +function VideoThumbnail({ + objectId, + isUnseen, +}: { + objectId: string; + isUnseen: boolean; +}) { + const { data: url } = useDownloadUrl(objectId); + return ( +
+ {url && ( +
+ ); +} + function getParticleTypeIcon(particle: Particle): LucideIcon { if (isParticleDeleted(particle)) return Trash2; switch (particle.type) { @@ -156,6 +186,14 @@ const StreamRow = memo(function StreamRow({ const TypeIcon = latestChild ? getParticleTypeIcon(latestChild) : Radio; + const videoThumbObjectId = + latestChild && + !isParticleDeleted(latestChild) && + latestChild.type === "media" && + latestChild.properties.mime_type.startsWith("video/") + ? latestChild.properties.object_id + : null; + return (
)} - - - {initials} - - + {videoThumbObjectId ? ( + + ) : ( + + + {initials} + + + )}