pierre/SolarEnergy
1
0
Fork 0
Code Issues 2 Pull Requests 5 Actions Packages Projects Releases 2 Wiki Activity

Minor refacto

Browse Source
This commit is contained in:
Pierre HUBERT 2024-09-25 22:00:36 +02:00
parent e0f0067e89
commit 821b4644a2
4 changed files with 22 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
central_frontend/src/routes/DeviceRoute/DeviceInfoProperty.tsx
View File

@ -3,7 +3,7 @@ import { TableCell, TableRow } from "@mui/material";
export function DeviceInfoProperty(p: { export function DeviceInfoProperty(p: {
icon?: React.ReactElement; icon?: React.ReactElement;
label: string; label: string;
value: string; value: string | React.ReactElement;
color?: string; color?: string;
}): React.ReactElement { }): React.ReactElement {
return ( return (

15
central_frontend/src/routes/DeviceRoute/DeviceStateBlock.tsx
View File

@ -1,10 +1,11 @@
import { Table, TableBody } from "@mui/material";
import React from "react"; import React from "react";
import { Device, DeviceApi, DeviceState } from "../../api/DeviceApi"; import { Device, DeviceApi, DeviceState } from "../../api/DeviceApi";
import { AsyncWidget } from "../../widgets/AsyncWidget"; import { AsyncWidget } from "../../widgets/AsyncWidget";
import { DeviceRouteCard } from "./DeviceRouteCard"; import { BoolText } from "../../widgets/BoolText";
import { Table, TableBody } from "@mui/material";
import { DeviceInfoProperty } from "./DeviceInfoProperty";
import { timeDiff } from "../../widgets/TimeWidget"; import { timeDiff } from "../../widgets/TimeWidget";
import { DeviceInfoProperty } from "./DeviceInfoProperty";
import { DeviceRouteCard } from "./DeviceRouteCard";
export function DeviceStateBlock(p: { device: Device }): React.ReactElement { export function DeviceStateBlock(p: { device: Device }): React.ReactElement {
const [state, setState] = React.useState<DeviceState>(); const [state, setState] = React.useState<DeviceState>();
@ -32,7 +33,13 @@ function DeviceStateInner(p: { state: DeviceState }): React.ReactElement {
<TableBody> <TableBody>
<DeviceInfoProperty <DeviceInfoProperty
label="Status" label="Status"
value={p.state.online ? "Online" : "Offline"} value={
<BoolText
val={p.state.online}
positive="ONLINE"
negative="Offline"
/>
}
/> />
<DeviceInfoProperty <DeviceInfoProperty
label="Last ping" label="Last ping"

6
central_frontend/src/routes/DeviceRoute/GeneralDeviceInfo.tsx
View File

@ -3,6 +3,7 @@ import { IconButton, Table, TableBody, Tooltip } from "@mui/material";
import React from "react"; import React from "react";
import { Device } from "../../api/DeviceApi"; import { Device } from "../../api/DeviceApi";
import { EditDeviceMetadataDialog } from "../../dialogs/EditDeviceMetadataDialog"; import { EditDeviceMetadataDialog } from "../../dialogs/EditDeviceMetadataDialog";
import { BoolText } from "../../widgets/BoolText";
import { formatDate } from "../../widgets/TimeWidget"; import { formatDate } from "../../widgets/TimeWidget";
import { DeviceInfoProperty } from "./DeviceInfoProperty"; import { DeviceInfoProperty } from "./DeviceInfoProperty";
import { DeviceRouteCard } from "./DeviceRouteCard"; import { DeviceRouteCard } from "./DeviceRouteCard";
@ -55,8 +56,9 @@ export function GeneralDeviceInfo(p: {
/> />
<DeviceInfoProperty <DeviceInfoProperty
label="Enabled" label="Enabled"
value={p.device.enabled ? "YES" : "NO"} value={
color={p.device.enabled ? "green" : "red"} <BoolText val={p.device.enabled} positive="YES" negative="NO" />
}
/> />
<DeviceInfoProperty <DeviceInfoProperty
label="Maximum number of relays" label="Maximum number of relays"

11
central_frontend/src/routes/DevicesRoute.tsx
View File

@ -15,6 +15,7 @@ import React from "react";
import { Link, useNavigate } from "react-router-dom"; import { Link, useNavigate } from "react-router-dom";
import { Device, DeviceApi, DevicesState, DeviceURL } from "../api/DeviceApi"; import { Device, DeviceApi, DevicesState, DeviceURL } from "../api/DeviceApi";
import { AsyncWidget } from "../widgets/AsyncWidget"; import { AsyncWidget } from "../widgets/AsyncWidget";
import { BoolText } from "../widgets/BoolText";
import { SolarEnergyRouteContainer } from "../widgets/SolarEnergyRouteContainer"; import { SolarEnergyRouteContainer } from "../widgets/SolarEnergyRouteContainer";
import { TimeWidget } from "../widgets/TimeWidget"; import { TimeWidget } from "../widgets/TimeWidget";
@ -109,11 +110,11 @@ function ValidatedDevicesList(p: {
<TimeWidget time={dev.time_update} /> <TimeWidget time={dev.time_update} />
</TableCell> </TableCell>
<TableCell align="center"> <TableCell align="center">
{p.states.get(dev.id)!.online ? ( <BoolText
<strong>Online</strong> val={p.states.get(dev.id)!.online}
) : ( positive="Online"
<em>Offline</em> negative="Offline"
)} />
<br /> <br />
<TimeWidget diff time={p.states.get(dev.id)!.last_ping} /> <TimeWidget diff time={p.states.get(dev.id)!.last_ping} />
</TableCell> </TableCell>