diff --git a/web/src/components/camera/CameraImage.tsx b/web/src/components/camera/CameraImage.tsx index ab0bfdf08..b4fb707bc 100644 --- a/web/src/components/camera/CameraImage.tsx +++ b/web/src/components/camera/CameraImage.tsx @@ -2,6 +2,7 @@ import { useApiHost } from "@/api"; import { useEffect, useRef, useState } from "react"; import useSWR from "swr"; import ActivityIndicator from "../indicators/activity-indicator"; +import { useResizeObserver } from "@/hooks/resize-observer"; type CameraImageProps = { className?: string; @@ -24,6 +25,7 @@ export default function CameraImage({ const { name } = config ? config.cameras[camera] : ""; const enabled = config ? config.cameras[camera].enabled : "True"; + const [isPortraitImage, setIsPortraitImage] = useState(false); useEffect(() => { if (!config || !imgRef.current) { @@ -35,15 +37,25 @@ export default function CameraImage({ }`; }, [apiHost, name, imgRef, searchParams, config]); + const [{ width: containerWidth, height: containerHeight }] = + useResizeObserver(containerRef); + return (