- fixed but to delete specific alert item

- need to remove rawcamebase from config in prod

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) => (
             <div key={index} className="flex flex-row space-x-2">
               <AlertItem item={alertItem} />
-              <button onClick={() => handleDeleteClick(alertItem, index)}>
+              <button onClick={() => handleDeleteClick(alertItem)}>
                 <div className="p-4">
                   <FontAwesomeIcon icon={faTrash} size="2x" />
                 </div>