Add the logic which will call disk image conversion from disk image route

virtweb_frontend/src/routes/DiskImagesRoute.tsx

@@ -1,6 +1,7 @@
 import DeleteIcon from "@mui/icons-material/Delete";
 import DownloadIcon from "@mui/icons-material/Download";
 import RefreshIcon from "@mui/icons-material/Refresh";
+import LoopIcon from "@mui/icons-material/Loop";
 import {
   Alert,
   Button,
@@ -25,6 +26,7 @@ import { FileInput } from "../widgets/forms/FileInput";
 import { VirtWebPaper } from "../widgets/VirtWebPaper";
 import { VirtWebRouteContainer } from "../widgets/VirtWebRouteContainer";
 import { downloadBlob } from "../utils/FilesUtils";
+import { ConvertDiskImageDialog } from "../dialogs/ConvertDiskImageDialog";
 
 export function DiskImagesRoute(): React.ReactElement {
   const [list, setList] = React.useState<DiskImage[] | undefined>();
@@ -162,8 +164,16 @@ function DiskImageList(p: {
   const confirm = useConfirm();
   const loadingMessage = useLoadingMessage();
 
+  const [currConversion, setCurrConversion] = React.useState<
+    DiskImage | undefined
+  >();
   const [dlProgress, setDlProgress] = React.useState<undefined | number>();
 
+  // Convert disk image file
+  const convertDiskImage = async (entry: DiskImage) => {
+    setCurrConversion(entry);
+  };
+
   // Download disk image file
   const downloadDiskImage = async (entry: DiskImage) => {
     setDlProgress(0);
@@ -236,11 +246,16 @@ function DiskImageList(p: {
     {
       field: "actions",
       headerName: "",
-      width: 120,
+      width: 140,
       renderCell(params) {
         return (
           <>
-            <Tooltip title="Download image">
+            <Tooltip title="Convert disk image">
+              <IconButton onClick={() => convertDiskImage(params.row)}>
+                <LoopIcon />
+              </IconButton>
+            </Tooltip>
+            <Tooltip title="Download disk image">
               <IconButton onClick={() => downloadDiskImage(params.row)}>
                 <DownloadIcon />
               </IconButton>
@@ -281,6 +296,20 @@ function DiskImageList(p: {
           </div>
         </Alert>
       )}
+
+      {/* Disk image conversion dialog */}
+      {currConversion && (
+        <ConvertDiskImageDialog
+          image={currConversion}
+          onCancel={() => setCurrConversion(undefined)}
+          onFinished={() => {
+            setCurrConversion(undefined);
+            p.onReload();
+          }}
+        />
+      )}
+
+      {/* The table itself */}
       <DataGrid getRowId={(c) => c.file_name} rows={p.list} columns={columns} />
     </>
   );