CEC-5432: expand bulk-action to add, remove, and move vehicles between fleets (#484)

* battery indicator

* optimistic response remove from fleet

* update api to use params

* expand add to fleet to also remove

* typo

* update to post request

* CEC-5432: remove unused deps

* update mocks for delete

src/components/Contexts/FleetContext.jsx

@@ -239,26 +239,39 @@ export const FleetProvider = ({ children }) => {
     }
   };
 
-  const deleteFleetVehicle = async (name, vehicle, token) => {
+  const deleteFleetVehicles = async (name, vins, token) => {
+    if (!Array.isArray(vins)) {
+      throw new Error(`VINs are required`);
+    }
+
     try {
       setBusy(true);
 
       validateFleetName(name);
-      validateVIN(vehicle.vin);
+      for (let i = 0; i < vins.length; i++) {
+        validateVIN(vins[0]);
+      }
 
-      const result = await api.deleteFleetVehicle(name, vehicle, token);
-      if (result.error) {
+      const result = await api.deleteFleetVehicles(name, vins, token);
+      if (result?.error) {
         throw new Error(`Delete fleet vehicle error. ${result.message}`);
       }
 
-      const index = fleetVehicles.findIndex(element => element === vehicle.vin);
-      if (index >= 0) fleetVehicles.splice(index, 1);
-      return result;
+      removeFleetVehiclesLocal(vins);
     } finally {
       setBusy(false);
     }
   };
 
+  const removeFleetVehiclesLocal = (vins = []) => {
+    setFleetVehicles((fleetVehicles) => {
+      return fleetVehicles.filter((element) => !vins.includes(element.vin));
+    });
+    setTotalFleetVehicles((totalFleetVehicles) => {
+      return totalFleetVehicles - vins.length;
+    });
+  }
+
   const getFleetCANFilters = async (name, search, token) => {
     try {
       setBusy(true);
@@ -358,7 +371,8 @@ export const FleetProvider = ({ children }) => {
         watchFleetVehicles,
         getFleetVehicles,
         addFleetVehicles,
-        deleteFleetVehicle,
+        deleteFleetVehicles,
+        removeFleetVehiclesLocal,
 
         fleetCANFilters,
         totalFleetCANFilters,

src/components/Contexts/FleetContext.test.jsx

@@ -465,14 +465,14 @@ describe("FleetContext", () => {
     });
   });
 
-  describe("deleteFleetVehicle", () => {
+  describe("deleteFleetVehicles", () => {
     beforeEach(async () => {
       const TestComp = () => {
-        const { busy, deleteFleetVehicle } = useFleetContext();
+        const { busy, deleteFleetVehicles } = useFleetContext();
         const { message, setMessage } = useStatusContext();
-        const deleteFV = async (name, vehicle) => {
+        const deleteFV = async (name, vins) => {
           try {
-            await deleteFleetVehicle(name, vehicle);
+            await deleteFleetVehicles(name, vins);
           } catch (e) {
             setMessage(e.message);
           }
@@ -488,11 +488,11 @@ describe("FleetContext", () => {
             />
             <button
               data-testid="deleteFleetVehicleInvalid"
-              onClick={() => deleteFV("US-WEST", "INVALID")}
+              onClick={() => deleteFV("US-WEST", ["INVALID"])}
             />
             <button
-              data-testid="deleteFleetVehicle"
-              onClick={() => deleteFV("US-WEST", { vin: "USWESTVIN12345678" })}
+              data-testid="deleteFleetVehicles"
+              onClick={() => deleteFV("US-WEST", ["USWESTVIN12345678"])}
             />
           </>
         );
@@ -519,10 +519,7 @@ describe("FleetContext", () => {
       await waitFor(() =>
         expect(screen.getByTestId("busy").innerHTML).toEqual("false")
       );
-      checkBaseResults(
-        "Cannot read properties of null (reading 'vin')",
-        "false"
-      );
+      checkBaseResults("VINs are required", "false");
     });
 
     it("deleteFleetVehicleNonexistent", async () => {
@@ -533,8 +530,8 @@ describe("FleetContext", () => {
       checkBaseResults("Invalid VIN", "false");
     });
 
-    it("deleteFleetVehicle", async () => {
-      fireEvent.click(screen.getByTestId("deleteFleetVehicle"));
+    it("deleteFleetVehicles", async () => {
+      fireEvent.click(screen.getByTestId("deleteFleetVehicles"));
       await waitFor(() =>
         expect(screen.getByTestId("busy").innerHTML).toEqual("false")
       );

src/components/Contexts/__mocks__/FleetContext.jsx

@@ -93,7 +93,7 @@ export const useFleetContext = () => ({
     return Promise.resolve(result);
   }),
   addFleetVehicles: jest.fn(),
-  deleteFleetVehicle: jest.fn(),
+  deleteFleetVehicles: jest.fn(),
 
   fleetCANFilters,
   totalFleetCANFilters,