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

- general fixes across the app

Browse Source 
- minor fixes
- code clean up and improvements
This commit is contained in:
Toba Ojo
2025-12-08 09:03:04 +00:00
parent 4c53c04767
commit 7cda7d5887
11 changed files with 24 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/features/cameras/components/CameraGrid.tsx
View File

@@ -9,12 +9,12 @@ const CameraGrid = () => {
const [tabIndex, setTabIndex] = useState(0);
return (
<div className="grid grid-cols-1 md:grid-cols-3 gap-4 p-4 h-screen max-h-screen overflow-hidden">
<div className="grid grid-cols-1 md:grid-cols-3 md:gap-4 p-4 h-screen max-h-screen">
<div className="col-span-2 flex flex-col gap-4">
<div className="shrink-0">
<div className="">
<VideoFeedGridPainter />
</div>
<div className="flex-1 overflow-hidden">
<div className="overflow-hidden">
<PlatePatch />
</div>
</div>

1
src/features/cameras/components/CameraSettings/CameraPanel.tsx
View File

@@ -39,7 +39,6 @@ const CameraPanel = ({ tabIndex }: CameraPanelProps) => {
<Tab>Target Detection</Tab>
<Tab>Camera Controls</Tab>
</TabList>
<TabPanel>
<RegionSelector
regions={regions}

2
src/features/cameras/components/CameraSettings/CameraSettings.tsx
View File

@@ -10,7 +10,7 @@ type CameraSettingsProps = {
const CameraSettings = ({ tabIndex, setTabIndex }: CameraSettingsProps) => {
return (
<Card className="p-4 w-full h-full max-h-screen ">
<Card className="p-4 w-full h-full max-h-screen">
<Tabs
selectedTabClassName="bg-gray-300 text-gray-900 font-semibold border-none rounded-sm mb-1"
className="react-tabs"

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

@@ -107,7 +107,7 @@ const RegionSelector = ({ regions, selectedRegionIndex, mode, cameraFeedID }: Re
return (
<div className="flex flex-col gap-4 max-h-[50%]">
<div className="flex flex-row gap-3">
<div className="flex flex-col md:flex-row gap-3">
<div className="p-2 border border-gray-600 rounded-lg flex flex-col h-50 w-full">
<h2 className="text-2xl mb-2">Tools</h2>
<div className="flex flex-col">

2
src/features/cameras/components/PlatePatch/SightingEntryTable.tsx
View File

@@ -12,7 +12,7 @@ const SightingEntryTable = () => {
if (isLoading) return <span className="text-slate-500">Loading Sighting data…</span>;
return (
<div className="border border-gray-600 rounded-lg overflow-hidden m-2">
<div className="border border-gray-600 rounded-lg m-2">
<div className="overflow-y-auto ">
<table className="w-full text-left text-sm">
<thead className="bg-gray-700/50 text-gray-200 sticky top-0">

4
src/features/cameras/components/PlatePatch/SightingPatch.tsx
View File

@@ -6,9 +6,9 @@ import SightingExitTable from "./SightingExitTable";
const PlatePatch = () => {
return (
<Card className="p-4 w-full max-h-[600px] overflow-hidden flex flex-col">
<Card className="p-4 w-full max-h-[600px] flex flex-col md:w-[95%]">
<CardHeader title="Entry / Exit" />
<Tabs defaultIndex={1} className="flex-1 overflow-hidden flex flex-col">
<Tabs defaultIndex={1} className="flex-1 flex flex-col">
<TabList>
<Tab>Entry Sightings</Tab>
<Tab>Exit Sightings</Tab>

13
src/features/cameras/components/Video/VideoFeedGridPainter.tsx
View File

@@ -93,9 +93,16 @@ const VideoFeedGridPainter = () => {
const width = window.innerWidth;
const aspectRatio = BACKEND_WIDTH / BACKEND_HEIGHT;
const newWidth = width * 0.6;
const newHeight = newWidth / aspectRatio;
setStageSize({ width: newWidth, height: newHeight });
console.log(window.innerWidth);
if (width < 768) {
const newWidth = width * 0.8;
const newHeight = newWidth / aspectRatio;
setStageSize({ width: newWidth, height: newHeight });
} else {
const newWidth = width * 0.6;
const newHeight = newWidth / aspectRatio;
setStageSize({ width: newWidth, height: newHeight });
}
};
handleResize();