refactor(frontend): improve save dialog label

2 files changed, 37 insertions, 25 deletions

diff --git a/subprojects/frontend/src/graph/export/exportDiagram.tsx b/subprojects/frontend/src/graph/export/exportDiagram.tsx
index 685b6ace..d2af52d9 100644
--- a/subprojects/frontend/src/graph/export/exportDiagram.tsx
+++ b/subprojects/frontend/src/graph/export/exportDiagram.tsx
@@ -340,7 +340,17 @@ export default async function exportDiagram(
 
   if (settings.format === 'pdf') {
     const pdf = await serializePDF(copyOfSVG, settings);
-    await saveBlob(pdf, 'graph.pdf', 'application/pdf', EXPORT_ID);
+    await saveBlob(pdf, 'graph.pdf', {
+      id: EXPORT_ID,
+      types: [
+        {
+          description: 'PDF files',
+          accept: {
+            'application/pdf': ['.pdf', '.PDF'],
+          },
+        },
+      ],
+    });
     return;
   }
   const serializedSVG = serializeSVG(svgDocument);
@@ -349,11 +359,31 @@ export default async function exportDiagram(
     if (mode === 'copy') {
       await copyBlob(png);
     } else {
-      await saveBlob(png, 'graph.png', PNG_CONTENT_TYPE, EXPORT_ID);
+      await saveBlob(png, 'graph.png', {
+        id: EXPORT_ID,
+        types: [
+          {
+            description: 'PNG graphics',
+            accept: {
+              [PNG_CONTENT_TYPE]: ['.png', '.PNG'],
+            },
+          },
+        ],
+      });
     }
   } else if (mode === 'copy') {
     await copyBlob(serializedSVG);
   } else {
-    await saveBlob(serializedSVG, 'graph.svg', SVG_CONTENT_TYPE, EXPORT_ID);
+    await saveBlob(serializedSVG, 'graph.svg', {
+      id: EXPORT_ID,
+      types: [
+        {
+          description: 'SVG graphics',
+          accept: {
+            [SVG_CONTENT_TYPE]: ['.svg', '.SVG'],
+          },
+        },
+      ],
+    });
   }
 }
diff --git a/subprojects/frontend/src/utils/fileIO.ts b/subprojects/frontend/src/utils/fileIO.ts
index abcc43eb..4f376882 100644
--- a/subprojects/frontend/src/utils/fileIO.ts
+++ b/subprojects/frontend/src/utils/fileIO.ts
@@ -7,28 +7,13 @@
 export async function saveBlob(
   blob: Blob,
   name: string,
-  mimeType: string,
-  id?: string,
+  options: FilePickerOptions,
 ): Promise<void> {
   if ('showSaveFilePicker' in window) {
-    const options: FilePickerOptions = {
+    const handle = await window.showSaveFilePicker({
+      ...options,
       suggestedName: name,
-    };
-    if (id !== undefined) {
-      options.id = id;
-    }
-    const extensionIndex = name.lastIndexOf('.');
-    if (extensionIndex >= 0) {
-      options.types = [
-        {
-          description: `${name.substring(extensionIndex + 1)} files`,
-          accept: {
-            [mimeType]: [name.substring(extensionIndex)],
-          },
-        },
-      ];
-    }
-    const handle = await window.showSaveFilePicker(options);
+    });
     const writable = await handle.createWritable();
     try {
       await writable.write(blob);
@@ -42,12 +27,9 @@ export async function saveBlob(
   try {
     link.href = url;
     link.download = name;
-    link.style.display = 'none';
-    document.body.appendChild(link);
     link.click();
   } finally {
     window.URL.revokeObjectURL(url);
-    document.body.removeChild(link);
   }
 }