Can edit more network settings

virtweb_frontend/src/routes/ViewNetworkRoute.tsx

@@ -1,10 +1,16 @@
 import React from "react";
-import { NetworkApi, NetworkInfo } from "../api/NetworksApi";
+import {
+  NetworkApi,
+  NetworkInfo,
+  NetworkStatus,
+  NetworkURL,
+} from "../api/NetworksApi";
 import { AsyncWidget } from "../widgets/AsyncWidget";
 import { useNavigate, useParams } from "react-router-dom";
 import { VirtWebRouteContainer } from "../widgets/VirtWebRouteContainer";
 import { Button } from "@mui/material";
 import { NetworkDetails } from "../widgets/net/NetworkDetails";
+import { NetworkStatusWidget } from "../widgets/net/NetworkStatusWidget";
 
 export function ViewNetworkRoute() {
   const { uuid } = useParams();
@@ -31,18 +37,25 @@ function ViewNetworkRouteInner(p: {
 }): React.ReactElement {
   const navigate = useNavigate();
 
+  const [netStatus, setNetStatus] = React.useState<NetworkStatus | undefined>();
+
   return (
     <VirtWebRouteContainer
       label={`Network ${p.network.name}`}
       actions={
-        /* TODO: show only if network is stopped */
-        <Button
-          variant="contained"
-          style={{ marginLeft: "15px" }}
-          onClick={() => navigate(`/net/${p.network.uuid}/edit`)}
-        >
-          Edit
-        </Button>
+        <span>
+          <NetworkStatusWidget net={p.network} onChange={setNetStatus} />
+
+          {netStatus === "Stopped" && (
+            <Button
+              variant="contained"
+              style={{ marginLeft: "15px" }}
+              onClick={() => navigate(NetworkURL(p.network, true))}
+            >
+              Edit
+            </Button>
+          )}
+        </span>
       }
     >
       <NetworkDetails net={p.network} editable={false} />