38 lines
1.0 KiB
JavaScript
38 lines
1.0 KiB
JavaScript
import React, { useState, useEffect } from "react";
|
|
import PropTypes from "prop-types";
|
|
import GenericPageWithIcon from "./GenericPageWithIcon";
|
|
import { Sun } from "grommet-icons";
|
|
import axios from "axios";
|
|
import { CAR_API } from "../config";
|
|
|
|
function PetMode(props) {
|
|
const [ temp, setTemp ] = useState(null);
|
|
useEffect(() => {
|
|
axios.get(`${CAR_API}data/InsideTemperature`)
|
|
.then(resp => setTemp(resp.data.value));
|
|
const id = setInterval(
|
|
() => axios.get(`${CAR_API}data/InsideTemperature`)
|
|
.then(resp => setTemp(resp.data.value)),
|
|
1000
|
|
);
|
|
return () => clearInterval(id);
|
|
}, []);
|
|
if (temp === null)
|
|
return <></>;
|
|
return (
|
|
<GenericPageWithIcon
|
|
title={temp === null ? "Fetching temperature": `${temp}°C`}
|
|
description={`The temperature inside is ${temp}°C. The pet / child is ${temp > 35 ? "un": ""}safe.`}
|
|
icon={<Sun color={temp > 35 ? "status-critical": "plain"} size="xlarge" />}
|
|
close={props.close}
|
|
/>);
|
|
}
|
|
|
|
PetMode.propTypes = {
|
|
close: PropTypes.func
|
|
};
|
|
|
|
PetMode.pluginName = "Temperature";
|
|
|
|
export default PetMode;
|