CEC-5356: use new can signal api

src/components/Cars/CANSignals/index.jsx

@@ -13,7 +13,7 @@ import {
 } from "../../Contexts/CANSignalsContext";
 
 const Main = ({ vin }) => {
-  const { signals, setVIN } = useCANSignalContext();
+  const { signals, setVIN, duration } = useCANSignalContext();
 
   useEffect(() => {
     setVIN(vin);
@@ -26,6 +26,8 @@ const Main = ({ vin }) => {
   if (!signals || signals.length === 0) return <h3>Loading...</h3>;
 
   return (
+    <>
+      (Received within the last {duration} seconds)
       <Table>
         <TableHead>
           <TableRow>
@@ -44,6 +46,7 @@ const Main = ({ vin }) => {
           ))}
         </TableBody>
       </Table>
+    </>
   );
 };
 

src/components/Contexts/CANSignalsContext.jsx

@@ -1,8 +1,8 @@
-import React, {useContext, useState} from "react";
+import React, { useContext, useState } from "react";
 
 import api from "../../services/vehiclesAPI";
 import { LocalDateTimeString } from "../../utils/dates";
-import {useInterval} from "usehooks-ts";
+import { useInterval } from "usehooks-ts";
 
 const CANSignalContext = React.createContext();
 
@@ -26,31 +26,44 @@ const transformSignals = (signals) =>
     .flat();
 
 export const CANSignalProvider = ({ token, children }) => {
+  // auto scale polling if not getting response
+  const durations = [10000, 30000, 60000, 120000];
+  const delays = [500, 1500, 3000, 6000];
   const [vin, setVIN] = useState(null);
   const [signals, setSignals] = useState([]);
-  const [delay, setDelay] = useState(500);
+  const [delayIndex, setDelayIndex] = useState(0);
 
   useInterval(
     () => {
       getCANSignals()
-    }, vin?delay:null
+    }, vin ? delays[delayIndex] : null
   )
 
   const getCANSignals = async () => {
     try {
       if (!vin) return;
 
-      const result = await api.getCANSignals(vin, token);
+      const date = new Date();
+      date.setUTCSeconds(date.getUTCSeconds() - durations[delayIndex]);
+
+      const result = await api.getCANSignals(vin, {
+        after_utc: date,
+      }, token);
       if (result.error)
         throw new Error(`Get CAN signals error. ${result.message}`);
 
       const items = transformSignals(result.data);
 
       if (items.length > 0) {
-        setDelay(500);
+        setDelayIndex(0);
         setSignals(items);
       } else {
-        setDelay(1000);
+        setDelayIndex((index) => {
+          if (index < delays.length - 1) {
+            return index += 1;
+          }
+          return index;
+        });
         setSignals([BlankSignal("No signals")]);
       }
     } catch (e) {
@@ -61,6 +74,7 @@ export const CANSignalProvider = ({ token, children }) => {
   return (
     <CANSignalContext.Provider
       value={{
+        duration: durations[delayIndex] / 1000,
         signals,
         setVIN,
       }}

src/services/vehiclesAPI.js

@@ -213,8 +213,23 @@ const vehiclesAPI = {
       .then(fetchRespHandler)
       .catch(errorHandler),
 
-  getCANSignals: async (vin, token) =>
+  /**
-    fetch(`${API_ENDPOINT}/cansignals/${vin}`, {
+   * 
+   * @param {String} vin The VIN of the car
+   * @param {Object} filter 
+   * @param {Date} filter.after_utc Point in time to begin signal response
+   * @param {Integer} filter.limit Max number of CAN Signals to return
+   * @param {String} token 
+   * @returns {Array}
+   */
+  getCANSignals: async (vin, filter = {}, token) => {
+    if (filter.after_utc instanceof Date && !isNaN(filter.after_utc)) {
+      filter.after_utc = filter.after_utc.getTime();
+    }
+
+    const url = addQueryParams(`${API_ENDPOINT}/cansignals/${vin}`, filter);
+    console.log(url)
+    return fetch(url, {
       method: "GET",
       headers: Object.assign(
         { "Content-Type": "application/json" },
@@ -222,7 +237,8 @@ const vehiclesAPI = {
       ),
     })
       .then(fetchRespHandler)
-      .catch(errorHandler),
+      .catch(errorHandler);
+  },
 
   getTRexLogs: async (vin, date, offset, count, direction, token, controller) =>
     fetch(`${API_ENDPOINT}/vehicle/${vin}/trex-logs?date=${date}&offset=${offset}&count=${count}&direction=${direction}`, {