CEC-371 Update car ECUs display (#78)

* Clean up className styles
Update car status page to show update and ECUs

* Add update ecu version button
Show all ECUs on car status page
Only show car ecus for search

src/components/Contexts/VehicleContext.jsx

@@ -33,21 +33,19 @@ export const VehicleProvider = ({ children }) => {
   const [models, setModels] = useState([]);
   const [years, setYears] = useState([]);
 
-  const getVehicles = async (search, token) => {
+  const addConnections = async (cars, token) => {
     try {
-      setBusy(true);
-      const result = await api.getVehicles(search, token);
+      const vins = cars.map((car) => car.vin);
+      const result = await api.getConnections(vins, token);
+
       if (result.error) {
-        setVehicles([]);
-        throw new Error(`Get vehicles error. ${result.message}`);
+        throw new Error(`Add connections error. ${result.message}`);
       }
-      await addConnections(result.data, token);
-      setVehicles(result.data);
-      if (result.total) {
-        setTotalVehicles(result.total);
-      }
-    } finally {
-      setBusy(false);
+      cars.forEach((car) => {
+        car.connected = result[car.vin] || false;
+      });
+    } catch (e) {
+      logger.error(e.stack);
     }
   };
 
@@ -63,6 +61,41 @@ export const VehicleProvider = ({ children }) => {
     }
   };
 
+  const getConnections = async (vins, token) => {
+    try {
+      setBusy(true);
+      const result = await api.getConnections(vins, token);
+      if (result.error)
+        throw new Error(`Get connections error. ${result.message}`);
+      return result;
+    } finally {
+      setBusy(false);
+    }
+  };
+
+  const getECUs = async (search, token) => {
+    try {
+      setBusy(true);
+      const result = await api.getECUs(search, token);
+      if (result.error) throw new Error(`Get ECUs error. ${result.message}`);
+      return result;
+    } finally {
+      setBusy(false);
+    }
+  };
+
+  const getLocations = async (token) => {
+    try {
+      setBusy(true);
+      const result = await api.getLocations(token);
+      if (result.error)
+        throw new Error(`Get locations error. ${result.message}`);
+      return result;
+    } finally {
+      setBusy(false);
+    }
+  };
+
   const getModels = async (token) => {
     try {
       setBusy(true);
@@ -74,6 +107,35 @@ export const VehicleProvider = ({ children }) => {
     }
   };
 
+  const getState = async (token, vin) => {
+    try {
+      setBusy(true);
+      const result = await api.getState(token, vin);
+      if (result.error) throw new Error(`Get state error. ${result.message}`);
+      return result;
+    } finally {
+      setBusy(false);
+    }
+  };
+
+  const getVehicles = async (search, token) => {
+    try {
+      setBusy(true);
+      const result = await api.getVehicles(search, token);
+      if (result.error) {
+        setVehicles([]);
+        throw new Error(`Get vehicles error. ${result.message}`);
+      }
+      await addConnections(result.data, token);
+      setVehicles(result.data);
+      if (result.total) {
+        setTotalVehicles(result.total);
+      }
+    } finally {
+      setBusy(false);
+    }
+  };
+
   const getYears = async (token) => {
     try {
       setBusy(true);
@@ -97,74 +159,23 @@ export const VehicleProvider = ({ children }) => {
     }
   };
 
-  const addConnections = async (cars, token) => {
-    try {
-      const vins = cars.map((car) => car.vin);
-      const result = await api.getConnections(vins, token);
-
-      if (result.error) {
-        throw new Error(`Add connections error. ${result.message}`);
-      }
-      cars.forEach((car) => {
-        car.connected = result[car.vin] || false;
-      });
-    } catch (e) {
-      logger.error(e.stack);
-    }
-  };
-
-  const getConnections = async (vins, token) => {
-    try {
-      setBusy(true);
-      const result = await api.getConnections(vins, token);
-      if (result.error)
-        throw new Error(`Get connections error. ${result.message}`);
-      return result;
-    } finally {
-      setBusy(false);
-    }
-  };
-
-  const getLocations = async (token) => {
-    try {
-      setBusy(true);
-      const result = await api.getLocations(token);
-      if (result.error)
-        throw new Error(`Get locations error. ${result.message}`);
-      return result;
-    } finally {
-      setBusy(false);
-    }
-  };
-
-  const getState = async (token, vin) => {
-    try {
-      setBusy(true);
-      const result = await api.getState(token, vin);
-      if (result.error)
-        throw new Error(`Get state error. ${result.message}`);
-      return result;
-    } finally {
-      setBusy(false);
-    }
-  };
-
   return (
     <VehicleContext.Provider
       value={{
         busy,
         vehicles,
-        totalVehicles,
         models,
         years,
-        getVehicles,
+        totalVehicles,
         addVehicle,
-        getModels,
-        getYears,
-        sendCommand,
         getConnections,
+        getECUs,
         getLocations,
+        getModels,
         getState,
+        getYears,
+        getVehicles,
+        sendCommand,
       }}
     >
       {children}

src/components/Contexts/__mocks__/VehicleContext.jsx

@@ -17,19 +17,7 @@ export const useVehicleContext = () => ({
   totalVehicles,
   models,
   years,
-  getVehicles: jest.fn(() => vehicles),
   addVehicle: jest.fn(),
-  getModels: jest.fn(() => {
-    models = ["Ocean", "PEAR"];
-  }),
-  getYears: jest.fn(() => {
-    years = [2023, 2024];
-  }),
-  sendCommand: jest.fn((vins, command, parameters, token) => ({
-    vins,
-    command,
-    parameters,
-  })),
   getConnections: jest.fn((vins, token) => {
     const result = {};
 
@@ -39,9 +27,54 @@ export const useVehicleContext = () => ({
 
     return result;
   }),
-  getLocations: jest.fn().mockResolvedValue([
-    { "altitude": 5, "longitude": 10, "latitude": 15, "vin": "TESTVIN123" },
-  ])
+  getECUs: jest.fn(() => {
+    return {
+      data: [
+        {
+          boot_loader_version: "BLVERSION",
+          config: "CONFIG",
+          created: "2021-07-14T20:09:40.98187Z",
+          ecu: "ECUA",
+          fingerprint: "FINGERPRINT",
+          hw_version: "HWVERSION",
+          serial_number: "SERIAL",
+          sw_version: "SWVERSION",
+          updated: "2021-07-14T20:09:40.98187Z",
+          vendor: "VENDOR",
+        },
+        {
+          boot_loader_version: "BLVERSION",
+          config: "CONFIG",
+          created: "2021-07-14T20:09:40.98187Z",
+          ecu: "ECUB",
+          fingerprint: "FINGERPRINT",
+          hw_version: "HWVERSION",
+          serial_number: "SERIAL",
+          sw_version: "SWVERSION",
+          updated: "2021-07-14T20:09:40.98187Z",
+          vendor: "VENDOR",
+        },
+      ],
+      total: 2,
+    };
+  }),
+  getModels: jest.fn(() => {
+    models = ["Ocean", "PEAR"];
+  }),
+  getLocations: jest
+    .fn()
+    .mockResolvedValue([
+      { altitude: 5, longitude: 10, latitude: 15, vin: "TESTVIN123" },
+    ]),
+  getVehicles: jest.fn(() => vehicles),
+  getYears: jest.fn(() => {
+    years = [2023, 2024];
+  }),
+  sendCommand: jest.fn((vins, command, parameters, token) => ({
+    vins,
+    command,
+    parameters,
+  })),
 });
 
 export const setBusy = (val) => {