From 44962e7d81f96b5f25c571f91da24165937c5468 Mon Sep 17 00:00:00 2001 From: Toba Ojo Date: Mon, 13 Oct 2025 11:48:10 +0100 Subject: [PATCH 1/4] - fixed but to delete specific alert item - need to remove rawcamebase from config in prod --- src/components/HistoryList/AlertItem.tsx | 26 +++++++++++++++---- src/components/HistoryList/HistoryList.tsx | 21 ++++++++++++--- .../SightingModal/SightingModal.tsx | 11 ++++---- src/utils/config.ts | 5 +--- src/utils/utils.ts | 1 + 5 files changed, 46 insertions(+), 18 deletions(-) diff --git a/src/components/HistoryList/AlertItem.tsx b/src/components/HistoryList/AlertItem.tsx index 48c12ce..ccae950 100644 --- a/src/components/HistoryList/AlertItem.tsx +++ b/src/components/HistoryList/AlertItem.tsx @@ -5,6 +5,7 @@ import InfoBar from "../SightingsWidget/InfoBar"; import { useState } from "react"; import HotListImg from "/Hotlist_Hit.svg"; import { useAlertHitContext } from "../../context/AlertHitContext"; +import { useCameraBlackboard } from "../../hooks/useCameraBlackboard"; import NPED_CAT_A from "/NPED_Cat_A.svg"; import NPED_CAT_B from "/NPED_Cat_B.svg"; import NPED_CAT_C from "/NPED_Cat_C.svg"; @@ -17,6 +18,7 @@ type AlertItemProps = { const AlertItem = ({ item }: AlertItemProps) => { const [isModalOpen, setIsModalOpen] = useState(false); const { dispatch } = useAlertHitContext(); + const { mutation } = useCameraBlackboard(); // const {d} = useCameraBlackboard(); const motionAway = (item?.motion ?? "").toUpperCase() === "AWAY"; @@ -34,12 +36,26 @@ const AlertItem = ({ item }: AlertItemProps) => { setIsModalOpen(false); }; - const handleDelete = () => { + const handleDelete = async (deletedItem: SightingType | null) => { + const res = await mutation.mutateAsync({ + operation: "VIEW", + path: "alertHistory", + }); + const oldArray = res?.result; + const updatedArray = oldArray?.filter( + (item: SightingType) => item?.ref !== deletedItem?.ref + ); + + mutation.mutate({ + operation: "INSERT", + path: "alertHistory", + value: updatedArray, + }); dispatch({ type: "REMOVE", payload: item }); }; return (
-
+
{ {isNPEDHitA && ( hotlistHit )} {isNPEDHitB && ( hotlistHit )} {isNPEDHitC && ( hotlistHit )} diff --git a/src/components/HistoryList/HistoryList.tsx b/src/components/HistoryList/HistoryList.tsx index 81f958f..1cd3735 100644 --- a/src/components/HistoryList/HistoryList.tsx +++ b/src/components/HistoryList/HistoryList.tsx @@ -11,9 +11,22 @@ const HistoryList = () => { const { state, dispatch, isLoading, error } = useAlertHitContext(); const { mutation } = useCameraBlackboard(); - const handleDeleteClick = (alertItem: SightingType, idx?: number) => { - dispatch({ type: "REMOVE", payload: alertItem }); - mutation.mutate({ operation: "POP", path: "alertHistory", value: idx }); + const handleDeleteClick = async (deletedItem: SightingType) => { + const res = await mutation.mutateAsync({ + operation: "VIEW", + path: "alertHistory", + }); + const oldArray = res?.result; + const updatedArray = oldArray?.filter( + (item: SightingType) => item?.ref !== deletedItem?.ref + ); + + mutation.mutate({ + operation: "INSERT", + path: "alertHistory", + value: updatedArray, + }); + dispatch({ type: "REMOVE", payload: deletedItem }); }; const handleClearListClick = (listName: CameraBlackBoardOptions) => { @@ -40,7 +53,7 @@ const HistoryList = () => { state?.alertList?.map((alertItem, index) => (
-
@@ -153,6 +154,7 @@ const CameraSettingFields = ({ className="p-2 border border-gray-400 rounded-lg" placeholder="Enter user name" autoComplete="username" + disabled />
@@ -170,7 +172,7 @@ const CameraSettingFields = ({ type={showPwd ? "text" : "password"} className="p-2 border border-gray-400 rounded-lg w-full " placeholder="Enter password" - autoComplete="new-password" + disabled />
{updateCameraConfigError ? ( - ) : ( )}
diff --git a/src/hooks/useCameraConfig.ts b/src/hooks/useCameraConfig.ts index 1dc9c0f..65d43eb 100644 --- a/src/hooks/useCameraConfig.ts +++ b/src/hooks/useCameraConfig.ts @@ -17,6 +17,7 @@ const fetchCameraSideConfig = async ({ queryKey }: { queryKey: string[] }) => { const updateCamerasideConfig = async (data: { id: string | number; friendlyName: string; + cameraAddress: string; }) => { const updateUrl = `${base_url}/update-config?id=${data.id}`; @@ -24,16 +25,17 @@ const updateCamerasideConfig = async (data: { id: data.friendlyName, fields: [ { - property: "id", - value: data.friendlyName, + property: "propURI", + value: data.cameraAddress, }, ], }; + console.log(updateConfigPayload); const response = await fetch(updateUrl, { method: "POST", body: JSON.stringify(updateConfigPayload), }); - if (!response.ok) throw new Error("Cannot reach update camera endpoint"); + if (!response.ok) throw new Error("Feature unavailable: Coming soon"); }; export const useFetchCameraConfig = (cameraSide: string) => { From 6ab10341b41331f21f55927f08ec6a224188218a Mon Sep 17 00:00:00 2001 From: Toba Ojo Date: Mon, 13 Oct 2025 12:21:13 +0000 Subject: [PATCH 3/4] .env edited online with Bitbucket --- .env | 9 --------- 1 file changed, 9 deletions(-) delete mode 100644 .env diff --git a/.env b/.env deleted file mode 100644 index 6c5ddb9..0000000 --- a/.env +++ /dev/null @@ -1,9 +0,0 @@ -VITE_BASEURL=http://192.168.75.11/ -VITE_CAM_BASE=http://100.118.196.113:8080 -VITE_FOLKESTONE_BASE=http://100.116.253.81 -VITE_TESTURL=http://100.82.205.44/SightingListRear/sightingSummary?mostRecentRef=-1 -VITE_OUTSIDE_BASEURL=http://100.82.205.44 -VITE_FOLKESTONE_URL=http://100.116.253.81/mergedHistory/sightingSummary?mostRecentRef= -VITE_MAV_URL=http://192.168.75.11/SightingListFront/sightingSummary?mostRecentRef= - -VITE_AGX_BOX_URL=http://100.118.196.113:8080 From 9334154603dfe4c3a45ab816d5f4505ca497ec53 Mon Sep 17 00:00:00 2001 From: Toba Ojo Date: Mon, 13 Oct 2025 13:58:10 +0100 Subject: [PATCH 4/4] - Improved development environment --- src/hooks/useCameraBlackboard.ts | 6 ++++-- src/utils/config.ts | 5 +++-- 2 files changed, 7 insertions(+), 4 deletions(-) diff --git a/src/hooks/useCameraBlackboard.ts b/src/hooks/useCameraBlackboard.ts index 487b641..f3fcf44 100644 --- a/src/hooks/useCameraBlackboard.ts +++ b/src/hooks/useCameraBlackboard.ts @@ -4,8 +4,10 @@ import type { CameraBlackBoardOptions } from "../types/types"; import { useEffect } from "react"; import { toast } from "sonner"; +const camBase = import.meta.env.MODE !== "development" ? CAM_BASE : ""; + const getAllBlackboardData = async () => { - const response = await fetch(`${CAM_BASE}/api/blackboard`, { + const response = await fetch(`${camBase}/api/blackboard`, { signal: AbortSignal.timeout(500), }); if (!response.ok) { @@ -15,7 +17,7 @@ const getAllBlackboardData = async () => { }; const viewBlackboardData = async (options: CameraBlackBoardOptions) => { - const response = await fetch(`${CAM_BASE}/api/blackboard`, { + const response = await fetch(`/${camBase}api/blackboard`, { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify(options), diff --git a/src/utils/config.ts b/src/utils/config.ts index cdede39..c75f5a1 100644 --- a/src/utils/config.ts +++ b/src/utils/config.ts @@ -1,4 +1,5 @@ const rawCamBase = import.meta.env.VITE_AGX_BOX_URL; -export const CAM_BASE = rawCamBase ? rawCamBase : window.location.origin; +const environment = import.meta.env.MODE; -export const OUTSIDE_CAM_BASE = import.meta.env.VITE_OUTSIDE_BASEURL; +export const CAM_BASE = + environment === "development" ? rawCamBase : window.location.origin;