import { useEffect } from "react";
import { useCameraFeedContext } from "../../../../app/context/CameraFeedContext";

type CameraPanelProps = {
  tabIndex: number;
};

const CameraPanel = ({ tabIndex }: CameraPanelProps) => {
  const { dispatch } = useCameraFeedContext();
  const mapIndextoCameraId = () => {
    switch (tabIndex) {
      case 1:
        return "A";
      case 2:
        return "B";
      case 3:
        return "C";
      default:
        return null;
    }
  };

  useEffect(() => {
    const cameraId = mapIndextoCameraId();

    dispatch({ type: "SET_CAMERA_FEED", payload: cameraId });
  }, [tabIndex]);

  return <div>CameraPanel</div>;
};

export default CameraPanel;