update camera base URL, enhance alert context, and improve history list functionality

src/context/AlertHitContext.ts

@@ -5,6 +5,9 @@ type AlertHitContextValueType = {
   state: AlertState;
   action?: AlertPayload;
   dispatch: React.Dispatch<AlertPayload>;
+  isLoading?: boolean;
+  isError?: boolean;
+  error?: Error | null;
 };
 
 export const AlertHitContext = createContext<

src/context/providers/AlertHitProvider.tsx

@@ -1,6 +1,8 @@
-import { useReducer, type ReactNode } from "react";
+import { useEffect, useReducer, type ReactNode } from "react";
 import AlertHitContext from "../AlertHitContext";
 import { reducer, initalState } from "../reducers/AlertReducers";
+import { useCameraBlackboard } from "../../hooks/useCameraBlackboard";
+import type { SightingType } from "../../types/types";
 
 type AlertHitProviderTypeProps = {
   children: ReactNode;
@@ -8,9 +10,30 @@ type AlertHitProviderTypeProps = {
 
 export const AlertHitProvider = ({ children }: AlertHitProviderTypeProps) => {
   const [state, dispatch] = useReducer(reducer, initalState);
+  const { query } = useCameraBlackboard();
+
+  useEffect(() => {
+    if (query.data) {
+      query?.data?.alertHistory?.forEach((element: SightingType) => {
+        dispatch({ type: "ADD", payload: element });
+      });
+    } else if (query.error) {
+      console.error("Error fetching alert hits:", query.error);
+    } else {
+      console.log("Loading alert hits...");
+    }
+  }, [query.data, query.error, query.isLoading]);
 
   return (
-    <AlertHitContext.Provider value={{ state, dispatch }}>
+    <AlertHitContext.Provider
+      value={{
+        state,
+        dispatch,
+        isLoading: query.isLoading,
+        isError: query.isError,
+        error: query.error,
+      }}
+    >
       {children}
     </AlertHitContext.Provider>
   );

src/context/reducers/AlertReducers.ts

@@ -50,6 +50,13 @@ export function reducer(state: AlertState, action: AlertPayload) {
       };
     }
 
+    case "DELETE": {
+      return {
+        ...state,
+        alertList: action.payload,
+      };
+    }
+
     default:
       return { ...state };
   }