Can delete the VM from the WebUI

virtweb_frontend/src/widgets/BaseAuthenticatedPage.tsx

@@ -35,7 +35,7 @@ export function BaseAuthenticatedPage(): React.ReactElement {
           dense
           component="nav"
           sx={{
-            minWidth: "180px",
+            minWidth: "200px",
             backgroundColor: "background.paper",
           }}
         >
@@ -45,7 +45,7 @@ export function BaseAuthenticatedPage(): React.ReactElement {
             icon={<Icon path={mdiHome} size={1} />}
           />
           <NavLink
-            label="Virtual machines"
+            label="Virtual Machines"
             uri="/vms"
             icon={<Icon path={mdiBoxShadow} size={1} />}
           />

virtweb_frontend/src/widgets/VirtWebRouteContainer.tsx

@@ -1,16 +1,25 @@
 import { Typography } from "@mui/material";
-import { PropsWithChildren } from "react";
+import React, { PropsWithChildren } from "react";
 
 export function VirtWebRouteContainer(
   p: {
     label: string;
+    actions?: React.ReactElement;
   } & PropsWithChildren
 ): React.ReactElement {
   return (
     <div style={{ margin: "50px" }}>
-      <Typography variant="h4" style={{ marginBottom: "20px" }}>
-        {p.label}
-      </Typography>
+      <div
+        style={{
+          display: "flex",
+          justifyContent: "space-between",
+          alignItems: "center",
+          marginBottom: "20px",
+        }}
+      >
+        <Typography variant="h4">{p.label}</Typography>
+        {p.actions ?? <></>}
+      </div>
 
       {p.children}
     </div>

virtweb_frontend/src/widgets/vms/VMStatusWidget.tsx

@@ -0,0 +1,8 @@
+import { VMInfo } from "../../api/VMApi";
+
+export function VMStatusWidget(p: {
+  d: VMInfo;
+  onChange?: () => void;
+}): React.ReactElement {
+  return <>TODO</>;
+}