From 7cda7d5887a6907dfc52be3b76d530ec11331fa8 Mon Sep 17 00:00:00 2001 From: Toba Ojo Date: Mon, 8 Dec 2025 09:03:04 +0000 Subject: [PATCH] - general fixes across the app - minor fixes - code clean up and improvements --- src/features/cameras/components/CameraGrid.tsx | 6 +++--- .../components/CameraSettings/CameraPanel.tsx | 1 - .../components/CameraSettings/CameraSettings.tsx | 2 +- .../components/CameraSettings/RegionSelector.tsx | 2 +- .../components/PlatePatch/SightingEntryTable.tsx | 2 +- .../cameras/components/PlatePatch/SightingPatch.tsx | 4 ++-- .../components/Video/VideoFeedGridPainter.tsx | 13 ++++++++++--- src/features/cameras/hooks/useGetVideoFeed.ts | 2 +- src/features/output/components/OSDFields.tsx | 5 ++++- src/features/output/components/OutputForms.tsx | 2 +- src/features/output/hooks/useOSDConfig.ts | 1 - 11 files changed, 24 insertions(+), 16 deletions(-) diff --git a/src/features/cameras/components/CameraGrid.tsx b/src/features/cameras/components/CameraGrid.tsx index e31ff39..541ae1c 100644 --- a/src/features/cameras/components/CameraGrid.tsx +++ b/src/features/cameras/components/CameraGrid.tsx @@ -9,12 +9,12 @@ const CameraGrid = () => { const [tabIndex, setTabIndex] = useState(0); return ( -
+
-
+
-
+
diff --git a/src/features/cameras/components/CameraSettings/CameraPanel.tsx b/src/features/cameras/components/CameraSettings/CameraPanel.tsx index bacfc8b..51250c5 100644 --- a/src/features/cameras/components/CameraSettings/CameraPanel.tsx +++ b/src/features/cameras/components/CameraSettings/CameraPanel.tsx @@ -39,7 +39,6 @@ const CameraPanel = ({ tabIndex }: CameraPanelProps) => { Target Detection Camera Controls - { return ( - + -
+

Tools

diff --git a/src/features/cameras/components/PlatePatch/SightingEntryTable.tsx b/src/features/cameras/components/PlatePatch/SightingEntryTable.tsx index 49edebd..a674cca 100644 --- a/src/features/cameras/components/PlatePatch/SightingEntryTable.tsx +++ b/src/features/cameras/components/PlatePatch/SightingEntryTable.tsx @@ -12,7 +12,7 @@ const SightingEntryTable = () => { if (isLoading) return Loading Sighting data…; return ( -
+
diff --git a/src/features/cameras/components/PlatePatch/SightingPatch.tsx b/src/features/cameras/components/PlatePatch/SightingPatch.tsx index 31b037d..d598eb8 100644 --- a/src/features/cameras/components/PlatePatch/SightingPatch.tsx +++ b/src/features/cameras/components/PlatePatch/SightingPatch.tsx @@ -6,9 +6,9 @@ import SightingExitTable from "./SightingExitTable"; const PlatePatch = () => { return ( - + - + Entry Sightings Exit Sightings diff --git a/src/features/cameras/components/Video/VideoFeedGridPainter.tsx b/src/features/cameras/components/Video/VideoFeedGridPainter.tsx index 3a566dc..4e20a59 100644 --- a/src/features/cameras/components/Video/VideoFeedGridPainter.tsx +++ b/src/features/cameras/components/Video/VideoFeedGridPainter.tsx @@ -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(); diff --git a/src/features/cameras/hooks/useGetVideoFeed.ts b/src/features/cameras/hooks/useGetVideoFeed.ts index 03b9603..660458a 100644 --- a/src/features/cameras/hooks/useGetVideoFeed.ts +++ b/src/features/cameras/hooks/useGetVideoFeed.ts @@ -2,7 +2,7 @@ import { useQuery } from "@tanstack/react-query"; import { CAMBASE } from "../../../utils/config"; const getfeed = async (cameraFeedID: "A" | "B" | "C" | null) => { - const response = await fetch(`${CAMBASE}TargetDetectionColour${cameraFeedID}-preview`, { + const response = await fetch(`${CAMBASE}/TargetDetectionColour${cameraFeedID}-preview`, { signal: AbortSignal.timeout(300000), cache: "no-store", }); diff --git a/src/features/output/components/OSDFields.tsx b/src/features/output/components/OSDFields.tsx index 3669445..6e0f25f 100644 --- a/src/features/output/components/OSDFields.tsx +++ b/src/features/output/components/OSDFields.tsx @@ -2,6 +2,7 @@ import { Field, useFormikContext } from "formik"; import { useOSDConfig } from "../hooks/useOSDConfig"; import OSDFieldToggle from "./OSDFieldToggle"; import type { OSDConfigFields } from "../../../types/types"; +import { toast } from "sonner"; type OSDFieldsProps = { isOSDLoading: boolean; @@ -15,7 +16,9 @@ const OSDFields = ({ isOSDLoading }: OSDFieldsProps) => { const handleSubmit = async (values: OSDConfigFields) => { const result = await osdMutation.mutateAsync(values); - console.log(result); + if (result?.id) { + toast.success("OSD Config updated successfully"); + } }; if (isOSDLoading) { diff --git a/src/features/output/components/OutputForms.tsx b/src/features/output/components/OutputForms.tsx index cea3a01..58faa66 100644 --- a/src/features/output/components/OutputForms.tsx +++ b/src/features/output/components/OutputForms.tsx @@ -24,7 +24,7 @@ const OutputForms = () => { const includeCameraName = osdQuery?.data?.propIncludeCameraName?.value.toLowerCase() === "true"; const overlayPosition = osdQuery?.data?.propOverlayPosition?.value; const OSDTimestampFormat = osdQuery?.data?.propTimestampFormat?.value; - console.log(includeVRM); + const format = dispatcherQuery?.data?.propFormat?.value; const { optionalConstantsQuery, optionalConstantsMutation } = useOptionalConstants(format?.toLowerCase()); const FFID = optionalConstantsQuery?.data?.propFeedIdentifier?.value; diff --git a/src/features/output/hooks/useOSDConfig.ts b/src/features/output/hooks/useOSDConfig.ts index 6fc0206..7208a44 100644 --- a/src/features/output/hooks/useOSDConfig.ts +++ b/src/features/output/hooks/useOSDConfig.ts @@ -26,7 +26,6 @@ const postOSDConfig = async (data: OSDConfigFields) => { fields: fields, }; - console.log(osdConfigPayload); const response = await fetch(`${CAMBASE}/api/update-config`, { method: "POST", body: JSON.stringify(osdConfigPayload),