import { useState } from "react";

import VideoFeedGridPainter from "./Video/VideoFeedGridPainter";
import CameraSettings from "./CameraSettings/CameraSettings";

import PlatePatch from "./PlatePatch/SightingPatch";

const CameraGrid = () => {
  const [tabIndex, setTabIndex] = useState(0);

  return (
    <div className="grid grid-cols-1 md:grid-cols-5 md:grid-rows-5 max-h-screen">
      <VideoFeedGridPainter />
      <CameraSettings tabIndex={tabIndex} setTabIndex={setTabIndex} />
      <PlatePatch />
    </div>
  );
};

export default CameraGrid;
