Turn XML routes into tabs

virtweb_frontend/src/widgets/vms/VMDetails.tsx

@@ -21,6 +21,7 @@ import { VMDisksList } from "../forms/VMDisksList";
 import { VMNetworksList } from "../forms/VMNetworksList";
 import { VMSelectIsoInput } from "../forms/VMSelectIsoInput";
 import { VMScreenshot } from "./VMScreenshot";
+import { XMLAsyncWidget } from "../XMLWidget";
 
 interface DetailsProps {
   vm: VMInfo;
@@ -68,6 +69,7 @@ enum VMTab {
   General = 0,
   Storage,
   Network,
+  XML,
   Danger,
 }
 
@@ -90,6 +92,11 @@ function VMDetailsInner(p: DetailsInnerProps): React.ReactElement {
           { label: "General", value: VMTab.General, visible: true },
           { label: "Storage", value: VMTab.Storage, visible: true },
           { label: "Network", value: VMTab.Network, visible: true },
+          {
+            label: "XML",
+            value: VMTab.XML,
+            visible: !p.editable,
+          },
           {
             label: "Danger zone",
             value: VMTab.Danger,
@@ -102,6 +109,7 @@ function VMDetailsInner(p: DetailsInnerProps): React.ReactElement {
       {currTab === VMTab.General && <VMDetailsTabGeneral {...p} />}
       {currTab === VMTab.Storage && <VMDetailsTabStorage {...p} />}
       {currTab === VMTab.Network && <VMDetailsTabNetwork {...p} />}
+      {currTab === VMTab.XML && <VMDetailsTabXML {...p} />}
       {currTab === VMTab.Danger && <VMDetailsTabDanger {...p} />}
     </>
   );
@@ -293,6 +301,16 @@ function VMDetailsTabNetwork(p: DetailsInnerProps): React.ReactElement {
   return <VMNetworksList {...p} />;
 }
 
+function VMDetailsTabXML(p: DetailsInnerProps): React.ReactElement {
+  return (
+    <XMLAsyncWidget
+      errMsg="Failed to load VM XML source definition!"
+      identifier={p.vm.uuid!}
+      load={() => VMApi.GetSingleXML(p.vm.uuid!)}
+    />
+  );
+}
+
 function VMDetailsTabDanger(p: DetailsInnerProps): React.ReactElement {
   const confirm = useConfirm();
   const alert = useAlert();