TobaOjo/BayIQ-UI
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

- addressing feedback

Browse Source
This commit is contained in:
Toba Ojo
2025-12-04 19:14:14 +00:00
parent 3af4e585e7
commit 9208470e53
13 changed files with 229 additions and 48 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
src/features/cameras/components/CameraSettings/RegionSelector.tsx
View File

@@ -43,14 +43,29 @@ const RegionSelector = ({ regions, selectedRegionIndex, mode, cameraFeedID }: Re
});
};
const handleAddRegionClick = () => {
const regionName = `Bay ${regions.length + 1}`;
dispatch({
type: "ADD_NEW_REGION",
payload: { cameraFeedID: cameraFeedID, regionName: regionName, brushColour: "#ffffff" },
});
};
const handleRemoveClick = () => {
dispatch({
type: "REMOVE_REGION",
payload: { cameraFeedID: cameraFeedID, regionName: regions[selectedRegionIndex].name },
});
};
const handleSaveclick = () => {
const regions: ColourData[] = [];
const test = Array.from(paintedCells.entries());
const region1 = test.filter(([, cell]) => cell.region.name === "Region 1");
const region2 = test.filter(([, cell]) => cell.region.name === "Region 2");
const region3 = test.filter(([, cell]) => cell.region.name === "Region 3");
const region4 = test.filter(([, cell]) => cell.region.name === "Region 4");
const region5 = test.filter(([, cell]) => cell.region.name === "Region 5");
const region1 = test.filter(([, cell]) => cell.region.name === "Bay 1");
const region2 = test.filter(([, cell]) => cell.region.name === "Bay 2");
const region3 = test.filter(([, cell]) => cell.region.name === "Bay 3");
const region4 = test.filter(([, cell]) => cell.region.name === "Bay 4");
const region5 = test.filter(([, cell]) => cell.region.name === "Bay 5");
const region1Data = {
id: 1,
cells: region1.map(([key]) => [parseInt(key.split("-")[1]), parseInt(key.split("-")[0])]),
@@ -130,7 +145,7 @@ const RegionSelector = ({ regions, selectedRegionIndex, mode, cameraFeedID }: Re
</div>
</div>
<div className="p-2 border border-gray-600 rounded-lg flex flex-col">
<h2 className="text-2xl mb-2">Region Select</h2>
<h2 className="text-2xl mb-2">Bay Select</h2>
<>
{regions?.map((region, idx) => {
const isSelected = selectedRegionIndex === idx;
@@ -162,6 +177,14 @@ const RegionSelector = ({ regions, selectedRegionIndex, mode, cameraFeedID }: Re
);
})}
</>
<div className="flex flex-col gap-4 mt-4">
<button className="border border-blue-900 bg-blue-700 px-4 py-1 rounded-md" onClick={handleAddRegionClick}>
Add Bay
</button>
<button className="border border-red-900 bg-red-700 px-4 py-1 rounded-md" onClick={handleRemoveClick}>
Remove Bay
</button>
</div>
</div>
<div className="p-2 border border-gray-600 rounded-lg flex flex-col md:col-span-2 h-50">