Add support for legacy relays API

This commit is contained in:
2024-10-12 20:53:23 +02:00
parent 5408cd3a9c
commit 13f8b5a592
13 changed files with 148 additions and 18 deletions

View File

@ -3,6 +3,7 @@ import { APIClient } from "./ApiClient";
export interface ServerConfig {
auth_disabled: boolean;
constraints: ServerConstraint;
unsecure_origin: string;
}
export interface ServerConstraint {

View File

@ -129,7 +129,9 @@ export function DeviceRelays(p: {
);
}
function RelayEntryStatus(p: { relay: DeviceRelay }): React.ReactElement {
function RelayEntryStatus(
p: Readonly<{ relay: DeviceRelay }>
): React.ReactElement {
const [state, setState] = React.useState<RelayStatus | undefined>();
const load = async () => {

View File

@ -1,3 +1,4 @@
import LinkIcon from "@mui/icons-material/Link";
import RefreshIcon from "@mui/icons-material/Refresh";
import {
IconButton,
@ -19,6 +20,8 @@ import { AsyncWidget } from "../widgets/AsyncWidget";
import { BoolText } from "../widgets/BoolText";
import { SolarEnergyRouteContainer } from "../widgets/SolarEnergyRouteContainer";
import { TimeWidget } from "../widgets/TimeWidget";
import { CopyToClipboard } from "../widgets/CopyToClipboard";
import { ServerApi } from "../api/ServerApi";
export function RelaysListRoute(p: {
homeWidget?: boolean;
@ -101,6 +104,7 @@ function RelaysList(p: {
<TableCell>Priority</TableCell>
<TableCell>Consumption</TableCell>
<TableCell>Status</TableCell>
<TableCell></TableCell>
</TableRow>
</TableHead>
<TableBody>
@ -125,6 +129,20 @@ function RelaysList(p: {
/>{" "}
for <TimeWidget diff time={p.status.get(row.id)!.for} />
</TableCell>
<TableCell>
<Tooltip title="Copy legacy api status">
<CopyToClipboard
content={
ServerApi.Config.unsecure_origin +
`/relay/${row.id}/legacy_state`
}
>
<IconButton>
<LinkIcon />
</IconButton>
</CopyToClipboard>
</Tooltip>
</TableCell>
</TableRow>
))}
</TableBody>

View File

@ -0,0 +1,30 @@
import { ButtonBase } from "@mui/material";
import { PropsWithChildren } from "react";
import { useSnackbar } from "../hooks/context_providers/SnackbarProvider";
export function CopyToClipboard(
p: PropsWithChildren<{ content: string }>
): React.ReactElement {
const snackbar = useSnackbar();
const copy = () => {
navigator.clipboard.writeText(p.content);
snackbar(`${p.content} copied to clipboard.`);
};
return (
<ButtonBase
onClick={copy}
style={{
display: "inline-block",
alignItems: "unset",
textAlign: "unset",
position: "relative",
padding: "0px",
}}
disableRipple
>
{p.children}
</ButtonBase>
);
}