Can update VM settings

virtweb_frontend/src/routes/EditVMRoute.tsx

@@ -1,5 +1,5 @@
 import React, { PropsWithChildren } from "react";
-import { useNavigate } from "react-router-dom";
+import { useNavigate, useParams } from "react-router-dom";
 import { VMApi, VMInfo } from "../api/VMApi";
 import { useSnackbar } from "../hooks/providers/SnackbarProvider";
 import { VirtWebRouteContainer } from "../widgets/VirtWebRouteContainer";
@@ -9,6 +9,8 @@ import { ServerApi } from "../api/ServerApi";
 import { validate as validateUUID } from "uuid";
 import { SelectInput } from "../widgets/forms/SelectInput";
 import { CheckboxInput } from "../widgets/forms/CheckboxInput";
+import { useAlert } from "../hooks/providers/AlertDialogProvider";
+import { AsyncWidget } from "../widgets/AsyncWidget";
 
 export function CreateVMRoute(): React.ReactElement {
   const snackbar = useSnackbar();
@@ -17,10 +19,15 @@ export function CreateVMRoute(): React.ReactElement {
   const [vm] = React.useState(VMInfo.NewEmpty);
 
   const create = async (v: VMInfo) => {
-    const res = await VMApi.Create(v);
-    snackbar("The virtual machine was successfully created!");
-    v.uuid = res.uuid;
-    navigate(v.ViewURL);
+    try {
+      const res = await VMApi.Create(v);
+      snackbar("The virtual machine was successfully created!");
+      v.uuid = res.uuid;
+      navigate(v.ViewURL);
+    } catch (e) {
+      console.error(e);
+      alert("Failed to create VM!");
+    }
   };
 
   return (
@@ -34,7 +41,53 @@ export function CreateVMRoute(): React.ReactElement {
 }
 
 export function EditVMRoute(): React.ReactElement {
-  return <>todo</>;
+  const navigate = useNavigate();
+  const alert = useAlert();
+  const snackbar = useSnackbar();
+
+  const { uuid } = useParams();
+
+  const [vm, setVM] = React.useState<VMInfo | undefined>(undefined);
+
+  const load = async () => {
+    const vm = await VMApi.GetSingle(uuid!);
+    setVM(vm);
+
+    const state = await VMApi.GetState(vm);
+    if (state !== "Shutdown" && state !== "Shutoff") {
+      await alert("The Virtual machine is running, you cannot edit it!");
+      navigate(vm.ViewURL);
+    }
+  };
+
+  const save = async (v: VMInfo) => {
+    try {
+      await VMApi.UpdateSingle(v);
+      snackbar("The virtual machine was successfully updated!");
+      navigate(v.ViewURL);
+    } catch (e) {
+      console.error(e);
+      alert("Failed to update VM info!");
+    }
+  };
+
+  return (
+    <AsyncWidget
+      loadKey={uuid}
+      load={load}
+      errMsg="Failed to get VM information!"
+      build={() => (
+        <EditVMInner
+          vm={vm!}
+          isCreating={false}
+          onCancel={() => {
+            navigate(vm!.ViewURL);
+          }}
+          onSave={save}
+        />
+      )}
+    />
+  );
 }
 
 function EditVMInner(p: {