Add PetMode plugin and integrate it into home page

This commit is contained in:
Ceda EI 2021-01-02 04:05:03 +05:30
parent facd8d912f
commit cfd0056197
4 changed files with 43 additions and 3 deletions

View File

@ -28,8 +28,8 @@ function Core() {
<Clock size="xxlarge" />
<Clock size="xxlarge" type="digital" />
<Box direction="row" margin="1.5em" wrap={true}>
<Button onClick={() => dispatch(setPlugin("sideMirrors"))} primary
label="Side Mirrors" />
<Button onClick={() => dispatch(setPlugin("petMode"))} primary
label="Pet Mode" />
{dummyButtons.map(i =>
<Button primary label={i} key={i} margin="0 0 0 1em" />
)}

37
src/plugins/PetMode.js Normal file
View File

@ -0,0 +1,37 @@
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 ? "#E30000": "plain"} size="xlarge" />}
close={props.close}
/>);
}
PetMode.propTypes = {
close: PropTypes.func
};
PetMode.pluginName = "Temperature";
export default PetMode;

View File

@ -2,10 +2,12 @@ import Warning from "./Warning";
import Manual from "./Manual";
import Temperature from "./Temperature";
import Accident from "./Accident";
import PetMode from "./PetMode";
export default {
warning: Warning,
manual: Manual,
temperature: Temperature,
accident: Accident,
petMode: PetMode,
};

View File

@ -1,5 +1,6 @@
const WS_BASE = "http://localhost:5050/";
const TG_API = "xxxxxxxxx:xxxxxxxxxxxxxxxxxxxxxx";
const TG_USERID = 123456789;
const CAR_API = "http://localhost:5000/";
export { WS_BASE, TG_API, TG_USERID };
export { WS_BASE, TG_API, TG_USERID, CAR_API };