Mav-Mobile-UI/src/components/CameraOverview/SnapshotContainer.tsx

import { useGetOverviewSnapshot } from "../../hooks/useGetOverviewSnapshot";
import NavigationArrow from "../UI/NavigationArrow";

type SnapshotContainerProps = {
  side: string;
};

export const SnapshotContainer = ({ side }: SnapshotContainerProps) => {
  const { canvasRef } = useGetOverviewSnapshot(side);

  return (
    <div className="relative w-full aspect-video">
      <NavigationArrow side={side} />
      <canvas ref={canvasRef} className="w-full h-full object-contain block " />
    </div>
  );
};