Minor refacto
This commit is contained in:
parent
e0f0067e89
commit
821b4644a2
@ -3,7 +3,7 @@ import { TableCell, TableRow } from "@mui/material";
|
||||
export function DeviceInfoProperty(p: {
|
||||
icon?: React.ReactElement;
|
||||
label: string;
|
||||
value: string;
|
||||
value: string | React.ReactElement;
|
||||
color?: string;
|
||||
}): React.ReactElement {
|
||||
return (
|
||||
|
@ -1,10 +1,11 @@
|
||||
import { Table, TableBody } from "@mui/material";
|
||||
import React from "react";
|
||||
import { Device, DeviceApi, DeviceState } from "../../api/DeviceApi";
|
||||
import { AsyncWidget } from "../../widgets/AsyncWidget";
|
||||
import { DeviceRouteCard } from "./DeviceRouteCard";
|
||||
import { Table, TableBody } from "@mui/material";
|
||||
import { DeviceInfoProperty } from "./DeviceInfoProperty";
|
||||
import { BoolText } from "../../widgets/BoolText";
|
||||
import { timeDiff } from "../../widgets/TimeWidget";
|
||||
import { DeviceInfoProperty } from "./DeviceInfoProperty";
|
||||
import { DeviceRouteCard } from "./DeviceRouteCard";
|
||||
|
||||
export function DeviceStateBlock(p: { device: Device }): React.ReactElement {
|
||||
const [state, setState] = React.useState<DeviceState>();
|
||||
@ -32,7 +33,13 @@ function DeviceStateInner(p: { state: DeviceState }): React.ReactElement {
|
||||
<TableBody>
|
||||
<DeviceInfoProperty
|
||||
label="Status"
|
||||
value={p.state.online ? "Online" : "Offline"}
|
||||
value={
|
||||
<BoolText
|
||||
val={p.state.online}
|
||||
positive="ONLINE"
|
||||
negative="Offline"
|
||||
/>
|
||||
}
|
||||
/>
|
||||
<DeviceInfoProperty
|
||||
label="Last ping"
|
||||
|
@ -3,6 +3,7 @@ import { IconButton, Table, TableBody, Tooltip } from "@mui/material";
|
||||
import React from "react";
|
||||
import { Device } from "../../api/DeviceApi";
|
||||
import { EditDeviceMetadataDialog } from "../../dialogs/EditDeviceMetadataDialog";
|
||||
import { BoolText } from "../../widgets/BoolText";
|
||||
import { formatDate } from "../../widgets/TimeWidget";
|
||||
import { DeviceInfoProperty } from "./DeviceInfoProperty";
|
||||
import { DeviceRouteCard } from "./DeviceRouteCard";
|
||||
@ -55,8 +56,9 @@ export function GeneralDeviceInfo(p: {
|
||||
/>
|
||||
<DeviceInfoProperty
|
||||
label="Enabled"
|
||||
value={p.device.enabled ? "YES" : "NO"}
|
||||
color={p.device.enabled ? "green" : "red"}
|
||||
value={
|
||||
<BoolText val={p.device.enabled} positive="YES" negative="NO" />
|
||||
}
|
||||
/>
|
||||
<DeviceInfoProperty
|
||||
label="Maximum number of relays"
|
||||
|
@ -15,6 +15,7 @@ import React from "react";
|
||||
import { Link, useNavigate } from "react-router-dom";
|
||||
import { Device, DeviceApi, DevicesState, DeviceURL } from "../api/DeviceApi";
|
||||
import { AsyncWidget } from "../widgets/AsyncWidget";
|
||||
import { BoolText } from "../widgets/BoolText";
|
||||
import { SolarEnergyRouteContainer } from "../widgets/SolarEnergyRouteContainer";
|
||||
import { TimeWidget } from "../widgets/TimeWidget";
|
||||
|
||||
@ -109,11 +110,11 @@ function ValidatedDevicesList(p: {
|
||||
<TimeWidget time={dev.time_update} />
|
||||
</TableCell>
|
||||
<TableCell align="center">
|
||||
{p.states.get(dev.id)!.online ? (
|
||||
<strong>Online</strong>
|
||||
) : (
|
||||
<em>Offline</em>
|
||||
)}
|
||||
<BoolText
|
||||
val={p.states.get(dev.id)!.online}
|
||||
positive="Online"
|
||||
negative="Offline"
|
||||
/>
|
||||
<br />
|
||||
<TimeWidget diff time={p.states.get(dev.id)!.last_ping} />
|
||||
</TableCell>
|
||||
|
Loading…
Reference in New Issue
Block a user