diff --git a/web/src/components/image/AnimatedEventThumbnail.tsx b/web/src/components/image/AnimatedEventThumbnail.tsx index 176b02a30..6c4762a83 100644 --- a/web/src/components/image/AnimatedEventThumbnail.tsx +++ b/web/src/components/image/AnimatedEventThumbnail.tsx @@ -4,15 +4,12 @@ import TimeAgo from "../dynamic/TimeAgo"; import { Tooltip, TooltipContent, TooltipTrigger } from "../ui/tooltip"; import { useMemo } from "react"; import { useApiHost } from "@/api"; -import useSWR from "swr"; -import { FrigateConfig } from "@/types/frigateConfig"; type AnimatedEventThumbnailProps = { event: FrigateEvent; }; export function AnimatedEventThumbnail({ event }: AnimatedEventThumbnailProps) { const apiHost = useApiHost(); - const { data: config } = useSWR("config"); const imageUrl = useMemo(() => { if (Date.now() / 1000 < event.start_time + 20) { @@ -22,32 +19,11 @@ export function AnimatedEventThumbnail({ event }: AnimatedEventThumbnailProps) { return `${baseUrl}api/events/${event.id}/preview.gif`; }, [event]); - const aspect = useMemo(() => { - if (!config) { - return ""; - } - - const detect = config.cameras[event.camera].detect; - const aspect = detect.width / detect.height; - - if (aspect > 2) { - return "aspect-wide"; - } else if (aspect < 1) { - return "aspect-[9/16]"; - } else { - return "aspect-video"; - } - }, [config, event]); - return ( -
+
+