Add checkbox for sparse file conversion

virtweb_frontend/src/dialogs/ConvertDiskImageDialog.tsx

@@ -6,17 +6,16 @@ import {
   DialogContentText,
   DialogTitle,
 } from "@mui/material";
-import { DiskImage, DiskImageApi, DiskImageFormat } from "../api/DiskImageApi";
 import React from "react";
-import { FileDiskImageWidget } from "../widgets/FileDiskImageWidget";
-import { FileInput } from "../widgets/forms/FileInput";
-import { TextInput } from "../widgets/forms/TextInput";
+import { DiskImage, DiskImageApi, DiskImageFormat } from "../api/DiskImageApi";
 import { ServerApi } from "../api/ServerApi";
-import { SelectInput } from "../widgets/forms/SelectInput";
+import { useAlert } from "../hooks/providers/AlertDialogProvider";
 import { useLoadingMessage } from "../hooks/providers/LoadingMessageProvider";
 import { useSnackbar } from "../hooks/providers/SnackbarProvider";
-import { useAlert } from "../hooks/providers/AlertDialogProvider";
-import { useConfirm } from "../hooks/providers/ConfirmDialogProvider";
+import { FileDiskImageWidget } from "../widgets/FileDiskImageWidget";
+import { CheckboxInput } from "../widgets/forms/CheckboxInput";
+import { SelectInput } from "../widgets/forms/SelectInput";
+import { TextInput } from "../widgets/forms/TextInput";
 
 export function ConvertDiskImageDialog(p: {
   image: DiskImage;
@@ -85,6 +84,18 @@ export function ConvertDiskImageDialog(p: {
           ]}
         />
 
+        {/* Check for sparse file */}
+        {format.format === "Raw" && (
+          <CheckboxInput
+            editable
+            label="Sparse file"
+            checked={format.is_sparse === true}
+            onValueChange={(c) => {
+              setFormat({ format: "Raw", is_sparse: c });
+            }}
+          />
+        )}
+
         {/* New image name */}
         <TextInput
           editable