diff --git a/src/components/Cars/Status/DigitalTwinTab.jsx b/src/components/Cars/Status/DigitalTwinTab.jsx index f49acd7..40673d3 100644 --- a/src/components/Cars/Status/DigitalTwinTab.jsx +++ b/src/components/Cars/Status/DigitalTwinTab.jsx @@ -1,16 +1,18 @@ -import React, { useEffect, useState } from "react"; -import clsx from "clsx"; import { Typography } from "@material-ui/core"; +import clsx from "clsx"; +import React, { useEffect, useState } from "react"; -import useStyles from "../../useStyles"; -import DigitalTwin from "../../DigitalTwin"; -import { - useVehicleContext, - VehicleProvider, -} from "../../Contexts/VehicleContext"; +import { logger } from "../../../services/monitoring"; import { useStatusContext } from "../../Contexts/StatusContext"; import { useUserContext } from "../../Contexts/UserContext"; -import { logger } from "../../../services/monitoring"; +import { + useVehicleContext, + VehicleProvider +} from "../../Contexts/VehicleContext"; +import DigitalTwin from "../../DigitalTwin"; +import useStyles from "../../useStyles"; + +const REQUEST_INTERVAL = 10000; const Main = (props) => { const { getState } = useVehicleContext(); @@ -26,18 +28,22 @@ const Main = (props) => { useEffect(() => { if (!vin) return; - (async () => { - try { - const result = await getState(token, vin); - setCarState(result.data); - } catch (e) { - setMessage(e.message); - logger.warn(e.stack); - } - })(); + getCarState(); + const interval = setInterval(getCarState, REQUEST_INTERVAL); + return () => { clearInterval(interval); } // eslint-disable-next-line react-hooks/exhaustive-deps }, [vin]); + const getCarState = async () => { + try { + const result = await getState(token, vin); + setCarState(result.data); + } catch (e) { + setMessage(e.message); + logger.warn(e.stack); + } + }; + return (