pierre/VirtWeb
1
0
Fork 0
Code Issues Pull Requests 2 Packages Projects Releases Wiki Activity

Can export networks config from UI

Browse Source
This commit is contained in:
Pierre HUBERT 2023-12-23 17:39:52 +01:00
parent 66dcf668f0
commit d053490a47
2 changed files with 27 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
virtweb_frontend/src/routes/EditNetworkRoute.tsx
View File

@ -7,13 +7,14 @@ import { AsyncWidget } from "../widgets/AsyncWidget";
import { NetworkDetails } from "../widgets/net/NetworkDetails"; import { NetworkDetails } from "../widgets/net/NetworkDetails";
import { VirtWebRouteContainer } from "../widgets/VirtWebRouteContainer"; import { VirtWebRouteContainer } from "../widgets/VirtWebRouteContainer";
import { Button } from "@mui/material"; import { Button } from "@mui/material";
import { ConfigImportExportButtons } from "../widgets/ConfigImportExportButtons";
export function CreateNetworkRoute(): React.ReactElement { export function CreateNetworkRoute(): React.ReactElement {
const alert = useAlert(); const alert = useAlert();
const snackbar = useSnackbar(); const snackbar = useSnackbar();
const navigate = useNavigate(); const navigate = useNavigate();
const [network] = React.useState<NetworkInfo>({ const [network, setNetwork] = React.useState<NetworkInfo>({
name: "NewNetwork", name: "NewNetwork",
forward_mode: "Isolated", forward_mode: "Isolated",
}); });
@ -35,6 +36,7 @@ export function CreateNetworkRoute(): React.ReactElement {
creating={true} creating={true}
onCancel={() => navigate("/net")} onCancel={() => navigate("/net")}
onSave={createNetwork} onSave={createNetwork}
onReplace={setNetwork}
/> />
); );
} }
@ -75,6 +77,7 @@ export function EditNetworkRoute(): React.ReactElement {
creating={false} creating={false}
onCancel={() => navigate(`/net/${uuid}`)} onCancel={() => navigate(`/net/${uuid}`)}
onSave={updateNetwork} onSave={updateNetwork}
onReplace={setNetwork}
/> />
)} )}
/> />
@ -86,6 +89,7 @@ function EditNetworkRouteInner(p: {
creating: boolean; creating: boolean;
onCancel: () => void; onCancel: () => void;
onSave: (vm: NetworkInfo) => Promise<void>; onSave: (vm: NetworkInfo) => Promise<void>;
onReplace: (vm: NetworkInfo) => void;
}): React.ReactElement { }): React.ReactElement {
const [changed, setChanged] = React.useState(false); const [changed, setChanged] = React.useState(false);
@ -101,6 +105,15 @@ function EditNetworkRouteInner(p: {
label={p.creating ? "Create a Network" : "Edit Network"} label={p.creating ? "Create a Network" : "Edit Network"}
actions={ actions={
<span> <span>
<ConfigImportExportButtons
currentConf={p.network}
filename={`net-${p.network.name}.json`}
importConf={(c) => {
p.onReplace(c);
valueChanged();
}}
/>
{changed && ( {changed && (
<Button <Button
variant="contained" variant="contained"

18
virtweb_frontend/src/routes/ViewNetworkRoute.tsx
View File

@ -1,6 +1,6 @@
import { mdiXml } from "@mdi/js"; import { mdiXml } from "@mdi/js";
import Icon from "@mdi/react"; import Icon from "@mdi/react";
import { Button, IconButton } from "@mui/material"; import { Button, IconButton, Tooltip } from "@mui/material";
import React from "react"; import React from "react";
import { useNavigate, useParams } from "react-router-dom"; import { useNavigate, useParams } from "react-router-dom";
import { import {
@ -15,6 +15,7 @@ import { RouterLink } from "../widgets/RouterLink";
import { VirtWebRouteContainer } from "../widgets/VirtWebRouteContainer"; import { VirtWebRouteContainer } from "../widgets/VirtWebRouteContainer";
import { NetworkDetails } from "../widgets/net/NetworkDetails"; import { NetworkDetails } from "../widgets/net/NetworkDetails";
import { NetworkStatusWidget } from "../widgets/net/NetworkStatusWidget"; import { NetworkStatusWidget } from "../widgets/net/NetworkStatusWidget";
import { ConfigImportExportButtons } from "../widgets/ConfigImportExportButtons";
export function ViewNetworkRoute() { export function ViewNetworkRoute() {
const { uuid } = useParams(); const { uuid } = useParams();
@ -47,15 +48,22 @@ function ViewNetworkRouteInner(p: {
<VirtWebRouteContainer <VirtWebRouteContainer
label={`Network ${p.network.name}`} label={`Network ${p.network.name}`}
actions={ actions={
<span> <span style={{ display: "flex", alignItems: "center" }}>
<NetworkStatusWidget net={p.network} onChange={setNetStatus} /> <NetworkStatusWidget net={p.network} onChange={setNetStatus} />
<RouterLink to={NetworkXMLURL(p.network)}> <RouterLink to={NetworkXMLURL(p.network)}>
<IconButton size="small"> <Tooltip title="View network definition">
<Icon path={mdiXml} style={{ width: "1em" }} /> <IconButton size="small">
</IconButton> <Icon path={mdiXml} style={{ width: "1em" }} />
</IconButton>
</Tooltip>
</RouterLink> </RouterLink>
<ConfigImportExportButtons
filename={`net-${p.network.name}.json`}
currentConf={p.network}
/>
{netStatus === "Stopped" && ( {netStatus === "Stopped" && (
<Button <Button
variant="contained" variant="contained"