From db49221a2b3d67e81a2b438b416fc5c976ef64cd Mon Sep 17 00:00:00 2001 From: Toba Ojo Date: Wed, 10 Sep 2025 09:05:47 +0100 Subject: [PATCH] apply stashed change before merge bradley --- .../CameraOverview/SnapshotContainer.tsx | 5 +++- .../CameraSettings/CameraSettingFields.tsx | 30 +++++-------------- .../SettingForms/NPED/NPEDFields.tsx | 4 +-- .../SightingsWidget/SightingWidget.tsx | 1 - src/components/UI/CardHeader.tsx | 2 +- src/hooks/useGetOverviewSnapshot.ts | 3 +- src/hooks/useNPEDAuth.ts | 8 ++--- src/pages/RearCamera.tsx | 2 ++ 8 files changed, 21 insertions(+), 34 deletions(-) diff --git a/src/components/CameraOverview/SnapshotContainer.tsx b/src/components/CameraOverview/SnapshotContainer.tsx index f9605ae..c112bcd 100644 --- a/src/components/CameraOverview/SnapshotContainer.tsx +++ b/src/components/CameraOverview/SnapshotContainer.tsx @@ -10,7 +10,10 @@ export const SnapshotContainer = ({ side, settingsPage, }: SnapshotContainerProps) => { - const { canvasRef } = useGetOverviewSnapshot(side); + const { canvasRef, isError, isPending } = useGetOverviewSnapshot(side); + + if (isError) return <>An error occurred; + if (isPending) return <>loading...; return (
diff --git a/src/components/CameraSettings/CameraSettingFields.tsx b/src/components/CameraSettings/CameraSettingFields.tsx index f81f1e4..e9eb762 100644 --- a/src/components/CameraSettings/CameraSettingFields.tsx +++ b/src/components/CameraSettings/CameraSettingFields.tsx @@ -16,15 +16,20 @@ const CameraSettingFields = () => { const validateValues = (values: CameraSettingValues) => { const errors: CameraSettingErrorValues = {}; + // if (Object.keys(errors).length === 0) { + // toast.error("Please fill in required fields"); + // } if (!values.friendlyName) errors.friendlyName = "Required"; if (!values.cameraAddress) errors.cameraAddress = "Required"; if (!values.userName) errors.userName = "Required"; if (!values.password) errors.password = "Required"; + return errors; }; const handleSubmit = (values: CameraSettingValues) => { // post values to endpoint + console.log(values); toast("Settings Saved"); }; @@ -35,10 +40,10 @@ const CameraSettingFields = () => { validate={validateValues} validateOnChange={false} > - {({ errors, touched, setFieldValue }) => ( + {({ errors, touched }) => (
- + {touched.friendlyName && errors.friendlyName && ( {errors.friendlyName} @@ -53,24 +58,6 @@ const CameraSettingFields = () => { />
-
- - ) => - setFieldValue("setupCamera", parseInt(e.target.value, 10)) - } - > - - - - - -
-
{touched.cameraAddress && errors.cameraAddress && ( @@ -83,8 +70,7 @@ const CameraSettingFields = () => { name="cameraAddress" type="text" className="p-2 border border-gray-400 rounded-lg" - placeholder="123, London Road..." - autoComplete="street-address" + placeholder="RTSP://..." />
diff --git a/src/components/SettingForms/NPED/NPEDFields.tsx b/src/components/SettingForms/NPED/NPEDFields.tsx index dd1cff1..5ad1a22 100644 --- a/src/components/SettingForms/NPED/NPEDFields.tsx +++ b/src/components/SettingForms/NPED/NPEDFields.tsx @@ -6,7 +6,6 @@ import { toast } from "sonner"; const NPEDFields = () => { const { signIn, user, signOut } = useNPEDAuth(); - const initialValues = user ? { username: user.propUsername.value, @@ -28,7 +27,7 @@ const NPEDFields = () => { ...values, }; signIn(valuesToSend); - toast.success("Signed in successfully"); + toast.success("Signed into NPED Successfully"); }; const validateValues = (values: NPEDFieldType) => { @@ -41,6 +40,7 @@ const NPEDFields = () => { const handleLogoutClick = () => { signOut(); + toast.warning("logged out of NPED"); }; return ( diff --git a/src/components/SightingsWidget/SightingWidget.tsx b/src/components/SightingsWidget/SightingWidget.tsx index 65d5d20..ff76aab 100644 --- a/src/components/SightingsWidget/SightingWidget.tsx +++ b/src/components/SightingsWidget/SightingWidget.tsx @@ -50,7 +50,6 @@ export default function SightingHistoryWidget({ {/* Rows */}
{rows?.map((obj, idx) => { - console.log(obj); const isNPEDHit = obj?.metadata?.npedJSON?.status_code === 201; const isSelected = obj?.ref === selectedRef; const motionAway = (obj?.motion ?? "").toUpperCase() === "AWAY"; diff --git a/src/components/UI/CardHeader.tsx b/src/components/UI/CardHeader.tsx index cefeeb6..eca4ed3 100644 --- a/src/components/UI/CardHeader.tsx +++ b/src/components/UI/CardHeader.tsx @@ -12,7 +12,7 @@ const CardHeader = ({ title, icon }: CameraOverviewHeaderProps) => { return (
{icon && } diff --git a/src/hooks/useGetOverviewSnapshot.ts b/src/hooks/useGetOverviewSnapshot.ts index 5db572c..11953d5 100644 --- a/src/hooks/useGetOverviewSnapshot.ts +++ b/src/hooks/useGetOverviewSnapshot.ts @@ -36,6 +36,7 @@ export function useGetOverviewSnapshot(cameraSide: string) { data: snapshotBlob, isError, error, + isPending, } = useQuery({ queryKey: ["overviewSnapshot", cameraSide], queryFn: () => fetchSnapshot(cameraSide), @@ -79,5 +80,5 @@ export function useGetOverviewSnapshot(cameraSide: string) { console.error("Snapshot error:", error); } - return { canvasRef }; + return { canvasRef, isError, isPending }; } diff --git a/src/hooks/useNPEDAuth.ts b/src/hooks/useNPEDAuth.ts index 962d075..3e411cc 100644 --- a/src/hooks/useNPEDAuth.ts +++ b/src/hooks/useNPEDAuth.ts @@ -8,8 +8,7 @@ async function fetchNPEDDetails() { const fetchUrl = `${base_url}/fetch-config?id=NPED`; const response = await fetch(fetchUrl); if (!response.ok) throw new Error("Cannot reach fetch-config endpoint"); - const data = await response.json(); - console.log(data); + return response.json(); } @@ -99,10 +98,7 @@ export const useNPEDAuth = () => { useEffect(() => { if (fetchdataQuery.isSuccess && fetchdataQuery.data) { setUser(fetchdataQuery.data); - } else if ( - !fetchdataQuery?.data?.propUsername?.value && - !fetchdataQuery?.data?.propClientID?.value - ) { + } else { setUser(null); } }, [fetchdataQuery.data, fetchdataQuery.isSuccess, setUser]); diff --git a/src/pages/RearCamera.tsx b/src/pages/RearCamera.tsx index 34b3c99..6d361e2 100644 --- a/src/pages/RearCamera.tsx +++ b/src/pages/RearCamera.tsx @@ -2,6 +2,7 @@ import { useNavigate } from "react-router"; import { useSwipeable } from "react-swipeable"; import OverviewVideoContainer from "../components/FrontCameraSettings/OverviewVideoContainer"; import CameraSettings from "../components/CameraSettings/CameraSettings"; +import { Toaster } from "sonner"; const RearCamera = () => { const navigate = useNavigate(); @@ -21,6 +22,7 @@ const RearCamera = () => { side={"TargetDetectionRear"} settingsPage={true} /> +
); };