Files
BayIQ-UI/src/features/cameras/components/CameraSettings/CameraPanel.tsx
Toba Ojo eb5eb69c28 - added zoom options per camera and oneshot button
- enhanced to remove painting when in zoom mode
2026-01-12 15:10:40 +00:00

68 lines
2.0 KiB
TypeScript

import { Tabs, Tab, TabList, TabPanel } from "react-tabs";
import { useEffect, useState } from "react";
import { useCameraFeedContext } from "../../../../app/context/CameraFeedContext";
import RegionSelector from "./RegionSelector";
import CameraControls from "./cameraControls/CameraControls";
type CameraPanelProps = {
tabIndex: number;
isResetAllModalOpen: boolean;
handleClose: () => void;
setIsResetModalOpen: React.Dispatch<React.SetStateAction<boolean>>;
};
const CameraPanel = ({ tabIndex, isResetAllModalOpen, handleClose, setIsResetModalOpen }: CameraPanelProps) => {
const { state, dispatch } = useCameraFeedContext();
const [subTabIndex, setSubTabIndex] = useState(0);
const cameraFeedID = state.cameraFeedID;
const regions = state.regionsByCamera[cameraFeedID];
const selectedRegionIndex = state.selectedRegionIndex;
const mode = state.modeByCamera[cameraFeedID];
useEffect(() => {
const mapIndextoCameraId = () => {
switch (tabIndex) {
case 0:
return "A";
case 1:
return "B";
case 2:
return "C";
//Add more cases if more cameras are added
default:
return "A";
}
};
const cameraId = mapIndextoCameraId();
dispatch({ type: "SET_CAMERA_FEED", payload: cameraId });
}, [dispatch, tabIndex]);
return (
<Tabs onSelect={(index) => setSubTabIndex(index)}>
<TabList>
<Tab>Target Detection</Tab>
<Tab>Camera Controls</Tab>
</TabList>
<TabPanel>
<RegionSelector
regions={regions}
selectedRegionIndex={selectedRegionIndex}
mode={mode}
cameraFeedID={cameraFeedID}
isResetAllModalOpen={isResetAllModalOpen}
handleClose={handleClose}
setIsResetModalOpen={setIsResetModalOpen}
subTabIndex={subTabIndex}
/>
</TabPanel>
<TabPanel>
<CameraControls cameraFeedID={cameraFeedID} subTabIndex={subTabIndex} />
</TabPanel>
</Tabs>
);
};
export default CameraPanel;