added status plenum to display plenum data, added pulseBox to extend the mui box and give it a pulsing animation of a given color

This commit is contained in:
Carter 2025-03-31 13:57:54 -06:00
parent 6d21ec0fc6
commit 14c1acd17c
6 changed files with 121 additions and 20 deletions

View file

@ -22,6 +22,7 @@ import BindaptIcon from "products/Bindapt/BindaptIcon";
import { describePower } from "pbHelpers/Power";
import { Tag as TagUI } from "common/Tag";
import moment from "moment";
import StatusPlenum from "common/StatusPlenum";
const useStyles = makeStyles((theme: Theme) => {
return ({
@ -214,6 +215,8 @@ export default function Devices() {
).then(resp => {
let newDevices: Device[] = []
resp.data.devices.forEach(device => {
console.log(device.status)
console.log(device.status?.plenum?.overlays)
if (device.status?.plenum?.temperature) {
setHasPlenums(true)
}
@ -325,18 +328,9 @@ export default function Devices() {
render: (device: Device) => {
if (device.status.plenum?.temperature) {
return (
<Grid2 container direction="column" marginLeft={2}>
<Grid2>
<Typography variant="body2" style={{ color: orange[300]}}>
{device.status.plenum.temperature.toFixed(1)}°C
</Typography>
</Grid2>
<Grid2>
<Typography variant="body2" color="info">
{device.status.plenum.humidity.toFixed(1)}%
</Typography>
</Grid2>
</Grid2>
<Box sx={{ marginLeft: 1 }}>
<StatusPlenum device={device} />
</Box>
)
} else {
return (