CEC-2384 Vehicle details show associated fleets (#203)

src/components/Contexts/VehicleContext.jsx

@@ -31,6 +31,8 @@ export const VehicleProvider = ({ children }) => {
   const [vehicle, setVehicle] = useState({});
   const [vehicles, setVehicles] = useState([]);
   const [totalVehicles, setTotalVehicles] = useState(0);
+  const [fleets, setFleets] = useState([]);
+  const [totalFleets, setTotalFleets] = useState(0);
   const [models, setModels] = useState([]);
   const [years, setYears] = useState([]);
 
@@ -220,6 +222,25 @@ export const VehicleProvider = ({ children }) => {
     }
   };
 
+  const getFleets = async (vin, search, token) => {
+    try {
+      setBusy(true);
+      validateVIN(vin);
+
+      const result = await api.getFleets(vin, search, token);
+      if (result.error) {
+        setFleets([]);
+        throw new Error(`Get Fleets of vehicle`)
+      }
+      setFleets(result.data ?? []);
+      if (result.total) {
+        setTotalFleets(result.total);
+      }
+    } finally {
+      setBusy(false)
+    }
+  }
+
   return (
     <VehicleContext.Provider
       value={{
@@ -229,6 +250,8 @@ export const VehicleProvider = ({ children }) => {
         vehicle,
         vehicles,
         years,
+        fleets,
+        totalFleets,
         addVehicle,
         deleteVehicle,
         getConnections,
@@ -242,6 +265,7 @@ export const VehicleProvider = ({ children }) => {
         getVehicles,
         sendCommand,
         updateVehicle,
+        getFleets,
       }}
     >
       {children}

src/components/Contexts/VehicleContext.test.jsx

@@ -20,12 +20,57 @@ const checkVehiclesResult = (error, busy, vehicles) => {
   expect(screen.getByTestId("vehicles").innerHTML).toEqual(vehicles);
 };
 
+const checkFleetsResult = (error, busy, fleets) => {
+  checkBaseResults(error, busy);
+  expect(screen.getByTestId("fleets").innerHTML).toEqual(fleets);
+}
+
 const checkBaseResults = (error, busy) => {
   expect(screen.getByTestId("error").innerHTML).toEqual(error);
   expect(screen.getByTestId("busy").innerHTML).toEqual(busy);
 };
 
 describe("VehicleContext", () => {
+  describe("getFleets", () => {
+    beforeEach(() => {
+      const TestComp = () => {
+        const { busy, error, fleets, getFleets } = useVehicleContext();
+
+        return (
+          <>
+            <div data-testid="error">{error}</div>
+            <div data-testid="busy">{busy.toString()}</div>
+            <div data-testid="fleets">{JSON.stringify(fleets)}</div>
+            <button
+              data-testid="getFleets"
+              onClick={() => getFleets("3C4PDCBG0ET127145")}
+            />
+          </>
+        );
+      };
+      render(
+        <VehicleProvider>
+          <TestComp />
+        </VehicleProvider>
+      );
+    });
+    afterEach(() => {
+      cleanup();
+    });
+
+    it("Initial state", () => {
+      checkFleetsResult("", "false", "[]");
+    });
+
+    it("getFleets", async () => {
+      fireEvent.click(screen.getByTestId("getFleets"));
+      await waitFor(() =>
+        expect(screen.getByTestId("fleets").innerHTML).not.toBe("[]")
+      );
+      checkFleetsResult("", "false", JSON.stringify(["fleet1", "fleet2"]));
+    });
+  })
+
   describe("getVehicles", () => {
     beforeEach(() => {
       const TestComp = () => {

src/components/Contexts/__mocks__/VehicleContext.jsx

@@ -77,6 +77,8 @@ let vehicles = [];
 let models = ["Ocean", "PEAR"];
 let years = [2023, 2024];
 let totalVehicles = 0;
+let fleets = ["fleet1", "fleet2"];
+let totalFleets = 2;
 let error = null;
 
 export const VehicleProvider = ({ children }) => {
@@ -86,6 +88,8 @@ export const VehicleProvider = ({ children }) => {
 export const useVehicleContext = () => ({
   busy,
   models,
+  fleets,
+  totalFleets,
   totalVehicles,
   vehicle,
   vehicles,
@@ -141,6 +145,10 @@ export const useVehicleContext = () => ({
     command,
     parameters,
   })),
+  getFleets: jest.fn((vin, search,_token) => {return {
+    data: ["fleet1", "fleet2"],
+    total: 2,
+  }}),
 });
 
 export const setBusy = (val) => {