diff --git a/.prettierrc b/.prettierrc new file mode 100644 index 0000000..963354f --- /dev/null +++ b/.prettierrc @@ -0,0 +1,3 @@ +{ + "printWidth": 120 +} diff --git a/TODO.txt b/TODO.txt deleted file mode 100644 index 8f76759..0000000 --- a/TODO.txt +++ /dev/null @@ -1,19 +0,0 @@ -TODO: - -Hotlist upload (Question for Dion about API) and hits popping up in sighting stack. -NPED API working and catagories popping up in sighting stack. Images added to public folder. -Make the friendly name of each camera permeate throughout. -Make favicon MAV logo. -Swipe down to get to session page. -I have made an error I don't know how to fix in SightingFeedProvider.tsx -There is a bug in /front-camera-settings where the navigation arrow doesn't have a transparent background. I don't know why it is only that one and I can't find out why. Very strange. -The selected sighting in the sighting stack seems a tad buggy. Sometimes multiple get selected. -Can the selected sighting be shown in full detail. How this will look is still up for debate. Either as a pop up card as in AiQ Flexi, or in the OVerview card?? -How do you know if the time has sync? Make UTC red if not sync. -Can the relative aspect ratio in SightingOverview.tsx be the ratio of image pixel size of the image to best take advantage of the space? -obscure details on dashboard to a toggle - - -FYI: - -Session, WiFi and Modem stuff isn't implimented in the backend. Those are just placeholders for now. diff --git a/src/components/CameraSettings/CameraSettingFields.tsx b/src/components/CameraSettings/CameraSettingFields.tsx index 8c5836b..1cb3786 100644 --- a/src/components/CameraSettings/CameraSettingFields.tsx +++ b/src/components/CameraSettings/CameraSettingFields.tsx @@ -1,10 +1,5 @@ import { Formik, Field, Form } from "formik"; -import type { - CameraConfig, - CameraSettingErrorValues, - CameraSettingValues, - ZoomInOptions, -} from "../../types/types"; +import type { CameraConfig, CameraSettingErrorValues, CameraSettingValues, ZoomInOptions } from "../../types/types"; import { useEffect, useMemo, useState } from "react"; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import { faEye, faEyeSlash } from "@fortawesome/free-regular-svg-icons"; @@ -28,8 +23,7 @@ const CameraSettingFields = ({ updateCameraConfigError, }: CameraSettingsProps) => { const [showPwd, setShowPwd] = useState(false); - const cameraControllerSide = - initialData?.id === "CameraA" ? "CameraControllerA" : "CameraControllerB"; + const cameraControllerSide = initialData?.id === "CameraA" ? "CameraControllerA" : "CameraControllerB"; const { mutation, query } = useCameraZoom({ camera: cameraControllerSide }); const zoomOptions = [1, 2, 4, 8]; @@ -109,9 +103,7 @@ const CameraSettingFields = ({
{touched.friendlyName && errors.friendlyName && ( - - {errors.friendlyName} - + {errors.friendlyName} )} {touched.cameraAddress && errors.cameraAddress && ( - - {errors.cameraAddress} - + {errors.cameraAddress} )} {touched.userName && errors.userName && ( - - {errors.userName} - + {errors.userName} )} {touched.password && errors.password && ( - - {errors.password} - + {errors.password} )}
{updateCameraConfigError ? ( - ) : ( diff --git a/src/components/CameraSettings/CameraSettings.tsx b/src/components/CameraSettings/CameraSettings.tsx index 7f371c9..c491f6c 100644 --- a/src/components/CameraSettings/CameraSettings.tsx +++ b/src/components/CameraSettings/CameraSettings.tsx @@ -15,8 +15,7 @@ const CameraSettings = ({ zoomLevel?: number; onZoomLevelChange?: (level: number) => void; }) => { - const { data, updateCameraConfig, updateCameraConfigError } = - useFetchCameraConfig(side); + const { data, updateCameraConfig, updateCameraConfigError } = useFetchCameraConfig(side); return ( diff --git a/src/components/FrontCameraOverview/FrontCameraOverviewCard.tsx b/src/components/FrontCameraOverview/FrontCameraOverviewCard.tsx index 75503b1..0aa1787 100644 --- a/src/components/FrontCameraOverview/FrontCameraOverviewCard.tsx +++ b/src/components/FrontCameraOverview/FrontCameraOverviewCard.tsx @@ -14,11 +14,7 @@ const FrontCameraOverviewCard = () => { }); return ( - +
diff --git a/src/components/FrontCameraSettings/OverviewVideoContainer.tsx b/src/components/FrontCameraSettings/OverviewVideoContainer.tsx index 1a0b7a8..379f95b 100644 --- a/src/components/FrontCameraSettings/OverviewVideoContainer.tsx +++ b/src/components/FrontCameraSettings/OverviewVideoContainer.tsx @@ -30,11 +30,7 @@ const OverviewVideoContainer = ({ trackMouse: true, }); return ( - +
{ const { dispatch } = useAlertHitContext(); const { mutation } = useCameraBlackboard(); - // const {d} = useCameraBlackboard(); const motionAway = (item?.motion ?? "").toUpperCase() === "AWAY"; const isHotListHit = checkIsHotListHit(item); @@ -43,9 +45,7 @@ const AlertItem = ({ item }: AlertItemProps) => { path: "alertHistory", }); const oldArray = res?.result; - const updatedArray = oldArray?.filter( - (item: SightingType) => item?.ref !== deletedItem?.ref - ); + const updatedArray = oldArray?.filter((item: SightingType) => item?.ref !== deletedItem?.ref); mutation.mutate({ operation: "INSERT", @@ -55,49 +55,26 @@ const AlertItem = ({ item }: AlertItemProps) => { dispatch({ type: "REMOVE", payload: item }); }; return ( -
-
- -
- {isHotListHit && ( - hotlistHit - )} - {isNPEDHitA && ( - NPEDHITicon - )} - {isNPEDHitB && ( - NPEDHITicon - )} - {isNPEDHitC && ( - NPEDHITicon - )} +
+
+
+ +
+ -
- MAKE: {item.make} - MODEL: {item.model} - COLOUR: {item.color} +
+ {isHotListHit && hotlistHit} + {isNPEDHitA && NPEDHITicon} + {isNPEDHitB && NPEDHITicon} + {isNPEDHitC && NPEDHITicon} + +
+
- -
{ const { state, dispatch, isLoading, error } = useAlertHitContext(); const { mutation } = useCameraBlackboard(); - 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) => { dispatch({ type: "DELETE", payload: [] }); mutation.mutate({ @@ -38,7 +18,7 @@ const HistoryList = () => { }; return ( - + -
- )) +
+ {state?.alertList?.map((alertItem) => ( + + ))} +
) : ( -

No Alert results

+
+
+ No Alert Results +
+

+ Alerts will appear here in real-time once there are Hotlist or{" "} + NPED hits. Use{" "} + Start Session to begin capturing results, or add a{" "} + Sighting from the sighting list. +

+
)}
diff --git a/src/components/RearCameraOverview/RearCameraOverviewCard.tsx b/src/components/RearCameraOverview/RearCameraOverviewCard.tsx index 55afe4e..883d096 100644 --- a/src/components/RearCameraOverview/RearCameraOverviewCard.tsx +++ b/src/components/RearCameraOverview/RearCameraOverviewCard.tsx @@ -18,18 +18,9 @@ const RearCameraOverviewCard = ({ className }: CardProps) => { }); const { mostRecent } = useSightingFeedContext(); return ( - +
- +
diff --git a/src/components/SessionForm/HitSearchCard.tsx b/src/components/SessionForm/HitSearchCard.tsx index 745a182..4282ac9 100644 --- a/src/components/SessionForm/HitSearchCard.tsx +++ b/src/components/SessionForm/HitSearchCard.tsx @@ -9,38 +9,36 @@ const SessionCard = () => { const { dispatch } = useAlertHitContext(); return ( - +
+ - -
+
setSearchTerm(e.target.value)} /> + +
- {searchTerm && (
    -
  • Number of Vehicles: {dedupedSightings.length}
    • -
  • Vehicles without Tax: {vehicles.notTaxed.length}
    • -
  • Vehicles without MOT: {vehicles.notMOT.length}
    • -
  • Vehicles with NPED Cat A: {vehicles.npedCatA.length}
    • -
  • Vehicles with NPED Cat B: {vehicles.npedCatB.length}
    • -
  • Vehicles with NPED Cat C: {vehicles.npedCatC.length}
    • +
  • +

    Number of Vehicles:

    + {dedupedSightings.length} +
    • +
  • +

    Vehicles without Tax:

    + {vehicles.notTaxed.length} +
    • +
  • +

    Vehicles without MOT:

    {" "} + {vehicles.notMOT.length} +
    • +
  • +

    Vehicles with NPED Cat A:

    + {vehicles.npedCatA.length} +
    • +
  • +

    Vehicles with NPED Cat B:

    {" "} + {vehicles.npedCatB.length} +
    • +
  • + Vehicles with NPED Cat C:{" "} + {vehicles.npedCatC.length} +
diff --git a/src/components/SettingForms/Channel1-JSON/ChannelFields.tsx b/src/components/SettingForms/Channel1-JSON/ChannelFields.tsx index 387eec0..5fe42fe 100644 --- a/src/components/SettingForms/Channel1-JSON/ChannelFields.tsx +++ b/src/components/SettingForms/Channel1-JSON/ChannelFields.tsx @@ -120,24 +120,27 @@ const ChannelFields = () => { - - setShowPwd((s) => !s)} - icon={showPwd ? faEyeSlash : faEye} - /> +
+ + setShowPwd((s) => !s)} + icon={showPwd ? faEyeSlash : faEye} + /> +
+ - {touched.password && errors.password && ( - - {errors.password} - - )} - - setShowPwd((s) => !s)} - icon={showPwd ? faEyeSlash : faEye} - /> +
+ + {touched.password && errors.password && ( + + {errors.password} + + )} + setShowPwd((s) => !s)} + icon={showPwd ? faEyeSlash : faEye} + /> +
diff --git a/src/components/SettingForms/WiFi&Modem/ModemSettings.tsx b/src/components/SettingForms/WiFi&Modem/ModemSettings.tsx index c031de8..15ed3cc 100644 --- a/src/components/SettingForms/WiFi&Modem/ModemSettings.tsx +++ b/src/components/SettingForms/WiFi&Modem/ModemSettings.tsx @@ -4,9 +4,12 @@ import type { ModemSettingsType } from "../../../types/types"; import { useWifiAndModem } from "../../../hooks/useCameraWifiandModem"; import { useEffect, useState } from "react"; import ModemToggle from "./ModemToggle"; +import { faEyeSlash, faEye } from "@fortawesome/free-solid-svg-icons"; +import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; const ModemSettings = () => { const [showSettings, setShowSettings] = useState(false); + const [showPwd, setShowPwd] = useState(false); const { modemQuery, modemMutation } = useWifiAndModem(); const apn = modemQuery?.data?.propAPN?.value; @@ -102,13 +105,21 @@ const ModemSettings = () => { > Password - +
+ + setShowPwd((s) => !s)} + icon={showPwd ? faEyeSlash : faEye} + /> +
- - setShowPwd((s) => !s)} - icon={showPwd ? faEyeSlash : faEye} - /> +
+ + setShowPwd((s) => !s)} + icon={showPwd ? faEyeSlash : faEye} + /> +