From fc08a98532eed84db73e4193e7c02b3e8f0fe545 Mon Sep 17 00:00:00 2001 From: Kristóf Marussy Date: Sat, 24 Feb 2024 01:06:34 +0100 Subject: refactor(frontend): improve save dialog label --- .../frontend/src/graph/export/exportDiagram.tsx | 36 ++++++++++++++++++++-- subprojects/frontend/src/utils/fileIO.ts | 26 +++------------- 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 { 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); } } -- cgit v1.2.3-70-g09d2