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

Show loading message when saving network / vm configuration

Browse Source
This commit is contained in:
Pierre HUBERT 2024-01-03 12:02:49 +01:00
parent ffac6991c4
commit 706bce0fd8
4 changed files with 29 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -1,13 +1,14 @@
import { Button } from "@mui/material";
import React from "react";
import { useNavigate, useParams } from "react-router-dom";
import { NetworkApi, NetworkInfo, NetworkURL } from "../api/NetworksApi";
import { useAlert } from "../hooks/providers/AlertDialogProvider";
import { useLoadingMessage } from "../hooks/providers/LoadingMessageProvider";
import { useSnackbar } from "../hooks/providers/SnackbarProvider";
import React from "react";
import { AsyncWidget } from "../widgets/AsyncWidget";
import { NetworkDetails } from "../widgets/net/NetworkDetails";
import { VirtWebRouteContainer } from "../widgets/VirtWebRouteContainer";
import { Button } from "@mui/material";
import { ConfigImportExportButtons } from "../widgets/ConfigImportExportButtons";
import { VirtWebRouteContainer } from "../widgets/VirtWebRouteContainer";
import { NetworkDetails } from "../widgets/net/NetworkDetails";
export function CreateNetworkRoute(): React.ReactElement {
const alert = useAlert();
@ -91,6 +92,8 @@ function EditNetworkRouteInner(p: {
onSave: (vm: NetworkInfo) => Promise<void>;
onReplace: (vm: NetworkInfo) => void;
}): React.ReactElement {
const loadingMessage = useLoadingMessage();
const [changed, setChanged] = React.useState(false);
const [, updateState] = React.useState<any>();
@ -100,6 +103,13 @@ function EditNetworkRouteInner(p: {
setChanged(true);
forceUpdate();
};
const save = async () => {
loadingMessage.show("Saving network configuration...");
await p.onSave(p.network);
loadingMessage.hide();
};
return (
<VirtWebRouteContainer
label={p.creating ? "Create a Network" : "Edit Network"}
@ -117,7 +127,7 @@ function EditNetworkRouteInner(p: {
{changed && (
<Button
variant="contained"
onClick={() => p.onSave(p.network)}
onClick={save}
style={{ marginRight: "10px" }}
>
{p.creating ? "Create" : "Save"}

12
virtweb_frontend/src/routes/EditVMRoute.tsx
View File

@ -8,6 +8,7 @@ import { AsyncWidget } from "../widgets/AsyncWidget";
import { ConfigImportExportButtons } from "../widgets/ConfigImportExportButtons";
import { VirtWebRouteContainer } from "../widgets/VirtWebRouteContainer";
import { VMDetails } from "../widgets/vms/VMDetails";
import { useLoadingMessage } from "../hooks/providers/LoadingMessageProvider";
export function CreateVMRoute(): React.ReactElement {
const snackbar = useSnackbar();
@ -97,6 +98,8 @@ function EditVMInner(p: {
onSave: (vm: VMInfo) => Promise<void>;
onReplace: (vm: VMInfo) => void;
}): React.ReactElement {
const loadingMessage = useLoadingMessage();
const [changed, setChanged] = React.useState(false);
const [, updateState] = React.useState<any>();
@ -106,6 +109,13 @@ function EditVMInner(p: {
setChanged(true);
forceUpdate();
};
const save = async () => {
loadingMessage.show("Saving VM configuration...");
await p.onSave(p.vm);
loadingMessage.hide();
};
return (
<VirtWebRouteContainer
label={p.isCreating ? "Create a Virtual Machine" : "Edit Virtual Machine"}
@ -122,7 +132,7 @@ function EditVMInner(p: {
{changed && (
<Button
variant="contained"
onClick={() => p.onSave(p.vm)}
onClick={save}
style={{ marginRight: "10px" }}
>
{p.isCreating ? "Create" : "Save"}

5
virtweb_frontend/src/routes/VMRoute.tsx
View File

@ -1,12 +1,9 @@
import { mdiXml } from "@mdi/js";
import Icon from "@mdi/react";
import { Button, IconButton, Tooltip } from "@mui/material";
import { Button } from "@mui/material";
import React from "react";
import { useNavigate, useParams } from "react-router-dom";
import { VMApi, VMInfo, VMState } from "../api/VMApi";
import { AsyncWidget } from "../widgets/AsyncWidget";
import { ConfigImportExportButtons } from "../widgets/ConfigImportExportButtons";
import { RouterLink } from "../widgets/RouterLink";
import { VirtWebRouteContainer } from "../widgets/VirtWebRouteContainer";
import { VMDetails } from "../widgets/vms/VMDetails";
import { VMStatusWidget } from "../widgets/vms/VMStatusWidget";

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

@ -1,6 +1,4 @@
import { mdiXml } from "@mdi/js";
import Icon from "@mdi/react";
import { Button, IconButton, Tooltip } from "@mui/material";
import { Button } from "@mui/material";
import React from "react";
import { useNavigate, useParams } from "react-router-dom";
import {
@ -8,14 +6,12 @@ import {
NetworkInfo,
NetworkStatus,
NetworkURL,
NetworkXMLURL,
} from "../api/NetworksApi";
import { AsyncWidget } from "../widgets/AsyncWidget";
import { RouterLink } from "../widgets/RouterLink";
import { ConfigImportExportButtons } from "../widgets/ConfigImportExportButtons";
import { VirtWebRouteContainer } from "../widgets/VirtWebRouteContainer";
import { NetworkDetails } from "../widgets/net/NetworkDetails";
import { NetworkStatusWidget } from "../widgets/net/NetworkStatusWidget";
import { ConfigImportExportButtons } from "../widgets/ConfigImportExportButtons";
export function ViewNetworkRoute() {
const { uuid } = useParams();