diff --git a/src/components/HistoryList/AlertItem.tsx b/src/components/HistoryList/AlertItem.tsx index ccae950..cc75e13 100644 --- a/src/components/HistoryList/AlertItem.tsx +++ b/src/components/HistoryList/AlertItem.tsx @@ -9,7 +9,7 @@ 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"; -import { checkIsHotListHit } from "../../utils/utils"; +import { checkIsHotListHit, getNPEDCategory } from "../../utils/utils"; type AlertItemProps = { item: SightingType; @@ -24,9 +24,10 @@ const AlertItem = ({ item }: AlertItemProps) => { const motionAway = (item?.motion ?? "").toUpperCase() === "AWAY"; const isHotListHit = checkIsHotListHit(item); - const isNPEDHitA = item?.metadata?.npedJSON?.["NPED CATEGORY"] === "A"; - const isNPEDHitB = item?.metadata?.npedJSON?.["NPED CATEGORY"] === "B"; - const isNPEDHitC = item?.metadata?.npedJSON?.["NPED CATEGORY"] === "C"; + const cat = getNPEDCategory(item); + const isNPEDHitA = cat === "A"; + const isNPEDHitB = cat === "B"; + const isNPEDHitC = cat === "C"; const handleClick = () => { setIsModalOpen(true); diff --git a/src/components/SightingModal/SightingModal.tsx b/src/components/SightingModal/SightingModal.tsx index a9fa5b7..81d1c3f 100644 --- a/src/components/SightingModal/SightingModal.tsx +++ b/src/components/SightingModal/SightingModal.tsx @@ -10,7 +10,7 @@ import HotListImg from "/Hotlist_Hit.svg"; 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"; -import { checkIsHotListHit } from "../../utils/utils"; +import { checkIsHotListHit, getNPEDCategory } from "../../utils/utils"; type SightingModalProps = { isSightingModalOpen: boolean; @@ -68,9 +68,10 @@ const SightingModal = ({ const motionAway = (sighting?.motion ?? "").toUpperCase() === "AWAY"; const isHotListHit = checkIsHotListHit(sighting); - const isNPEDHitA = sighting?.metadata?.npedJSON?.["NPED CATEGORY"] === "A"; - const isNPEDHitB = sighting?.metadata?.npedJSON?.["NPED CATEGORY"] === "B"; - const isNPEDHitC = sighting?.metadata?.npedJSON?.["NPED CATEGORY"] === "C"; + const cat = getNPEDCategory(sighting); + const isNPEDHitA = cat === "A"; + const isNPEDHitB = cat === "B"; + const isNPEDHitC = cat === "C"; return ( <> diff --git a/src/components/SightingsWidget/InfoBar.tsx b/src/components/SightingsWidget/InfoBar.tsx index b19f192..d40e998 100644 --- a/src/components/SightingsWidget/InfoBar.tsx +++ b/src/components/SightingsWidget/InfoBar.tsx @@ -5,8 +5,6 @@ type InfoBarprops = { obj: SightingType; }; const InfoBar = ({ obj }: InfoBarprops) => { - const isNPEDHitD = obj?.metadata?.npedJSON?.["NPED CATEGORY"] === "D"; - return (
@@ -18,13 +16,7 @@ const InfoBar = ({ obj }: InfoBarprops) => {
-
- {isNPEDHitD ? ( - NPED HIT CAT D - ) : ( - "" - )} -
+
); }; diff --git a/src/components/SightingsWidget/SightingWidget.tsx b/src/components/SightingsWidget/SightingWidget.tsx index 1e730f7..731166d 100644 --- a/src/components/SightingsWidget/SightingWidget.tsx +++ b/src/components/SightingsWidget/SightingWidget.tsx @@ -18,7 +18,7 @@ import { useSound } from "react-sounds"; import { useNPEDContext } from "../../context/NPEDUserContext"; import { useSoundContext } from "../../context/SoundContext"; import Loading from "../UI/Loading"; -import { checkIsHotListHit } from "../../utils/utils"; +import { checkIsHotListHit, getNPEDCategory } from "../../utils/utils"; function useNow(tickMs = 1000) { const [, setNow] = useState(() => Date.now()); @@ -68,6 +68,11 @@ export default function SightingHistoryWidget({ const { dispatch } = useAlertHitContext(); const { sessionStarted, setSessionList, sessionList } = useNPEDContext(); + const processedRefs = useRef>(new Set()); + + const hasAutoOpenedRef = useRef(false); + const npedRef = useRef(false); + const reduceObject = (obj: SightingType): ReducedSightingType => { return { vrm: obj.vrm, @@ -84,9 +89,6 @@ export default function SightingHistoryWidget({ // eslint-disable-next-line react-hooks/exhaustive-deps }, [mostRecent, sessionStarted, setSessionList]); - const hasAutoOpenedRef = useRef(false); - const npedRef = useRef(false); - const onRowClick = useCallback( (sighting: SightingType) => { if (!sighting) return; @@ -102,11 +104,45 @@ export default function SightingHistoryWidget({ ); useEffect(() => { - rows?.forEach((obj) => { - const isNPEDHitA = obj?.metadata?.npedJSON?.["NPED CATEGORY"] === "A"; - const isNPEDHitB = obj?.metadata?.npedJSON?.["NPED CATEGORY"] === "B"; - const isNPEDHitC = obj?.metadata?.npedJSON?.["NPED CATEGORY"] === "C"; + if (!rows?.length) return; + for (const sighting of rows) { + const id = sighting.vrm; + + if (processedRefs.current.has(id)) continue; + const isHot = checkIsHotListHit(sighting); + const cat = sighting?.metadata?.npedJSON?.["NPED CATEGORY"]; + + if (cat === "A" || cat === "B" || cat === "C") { + npedSound(); + setSelectedSighting(sighting); + setSightingModalOpen(true); + processedRefs.current.add(id); + break; // stop after one new open per render cycle + } + + if (isHot) { + hotlistsound(); + setSelectedSighting(sighting); + setSightingModalOpen(true); + processedRefs.current.add(id); + break; + } + } + }, [ + rows, + hotlistsound, + npedSound, + setSightingModalOpen, + setSelectedSighting, + ]); + + useEffect(() => { + rows?.forEach((obj) => { + const cat = getNPEDCategory(obj); + const isNPEDHitA = cat === "A"; + const isNPEDHitB = cat === "B"; + const isNPEDHitC = cat === "C"; if (isNPEDHitA || isNPEDHitB || isNPEDHitC) { dispatch({ type: "ADD", @@ -119,9 +155,10 @@ export default function SightingHistoryWidget({ useEffect(() => { if (hasAutoOpenedRef.current || npedRef.current) return; const firstNPED = rows.find((r) => { - const isNPEDHitA = r?.metadata?.npedJSON?.["NPED CATEGORY"] === "A"; - const isNPEDHitB = r?.metadata?.npedJSON?.["NPED CATEGORY"] === "B"; - const isNPEDHitC = r?.metadata?.npedJSON?.["NPED CATEGORY"] === "C"; + const cat = getNPEDCategory(r); + const isNPEDHitA = cat === "A"; + const isNPEDHitB = cat === "B"; + const isNPEDHitC = cat === "C"; return isNPEDHitA || isNPEDHitB || isNPEDHitC; }); const firstHot = rows?.find((r) => { @@ -132,7 +169,6 @@ export default function SightingHistoryWidget({ if (firstNPED) { setSelectedSighting(firstNPED); - console.log("first"); npedSound(); setSightingModalOpen(true); npedRef.current = true; @@ -144,13 +180,7 @@ export default function SightingHistoryWidget({ setSightingModalOpen(true); hasAutoOpenedRef.current = true; } - }, [ - hotlistsound, - npedSound, - rows, - setSelectedSighting, - setSightingModalOpen, - ]); + }, [hotlistsound, npedSound, setSelectedSighting]); const handleClose = () => { setSightingModalOpen(false); @@ -173,12 +203,10 @@ export default function SightingHistoryWidget({ {/* Rows */}
{rows?.map((obj) => { - const isNPEDHitA = - obj?.metadata?.npedJSON?.["NPED CATEGORY"] === "A"; - const isNPEDHitB = - obj?.metadata?.npedJSON?.["NPED CATEGORY"] === "B"; - const isNPEDHitC = - obj?.metadata?.npedJSON?.["NPED CATEGORY"] === "C"; + const cat = getNPEDCategory(obj); + const isNPEDHitA = cat === "A"; + const isNPEDHitB = cat === "B"; + const isNPEDHitC = cat === "C"; const motionAway = (obj?.motion ?? "").toUpperCase() === "AWAY"; const isHotListHit = checkIsHotListHit(obj); return ( diff --git a/src/utils/utils.ts b/src/utils/utils.ts index 8394450..4e031ec 100644 --- a/src/utils/utils.ts +++ b/src/utils/utils.ts @@ -140,3 +140,6 @@ export const checkIsHotListHit = (sigthing: SightingType | null) => { return isHotListHit; } }; + +export const getNPEDCategory = (r?: SightingType | null) => + r?.metadata?.npedJSON?.["NPED CATEGORY"] as "A" | "B" | "C" | undefined;