Browse Source

Merge pull request #17721 from Classic298/fix-image-download-filename

fix: Use generic filename for downloaded images
Tim Jaeryang Baek 2 weeks ago
parent
commit
b8a51de977

+ 15 - 10
src/lib/components/common/ImagePreview.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import { onDestroy, onMount } from 'svelte';
+	import { onDestroy, onMount, getContext } from 'svelte';
 	import panzoom, { type PanZoom } from 'panzoom';
 
 	import fileSaver from 'file-saver';
@@ -11,6 +11,8 @@
 	export let src = '';
 	export let alt = '';
 
+	const i18n = getContext('i18n');
+
 	let mounted = false;
 
 	let previewElement = null;
@@ -100,9 +102,10 @@
 
 							const mimeType = blob.type || 'image/png';
 							// create file name based on the MIME type, alt should be a valid file name with extension
-							const fileName = alt
-								? `${alt.replaceAll('.', '')}.${mimeType.split('/')[1]}`
-								: 'download.png';
+							const fileName = `${$i18n
+								.t('Generated Image')
+								.toLowerCase()
+								.replace(/ /g, '_')}.${mimeType.split('/')[1]}`;
 
 							// Use FileSaver to save the blob
 							saveAs(blob, fileName);
@@ -119,9 +122,10 @@
 									const blobWithType = new Blob([blob], { type: mimeType });
 
 									// create file name based on the MIME type, alt should be a valid file name with extension
-									const fileName = alt
-										? `${alt.replaceAll('.', '')}.${mimeType.split('/')[1]}`
-										: 'download.png';
+									const fileName = `${$i18n
+										.t('Generated Image')
+										.toLowerCase()
+										.replace(/ /g, '_')}.${mimeType.split('/')[1]}`;
 
 									// Use FileSaver to save the blob
 									saveAs(blobWithType, fileName);
@@ -146,9 +150,10 @@
 									const blobWithType = new Blob([blob], { type: mimeType });
 
 									// create file name based on the MIME type, alt should be a valid file name with extension
-									const fileName = alt
-										? `${alt.replaceAll('.', '')}.${mimeType.split('/')[1]}`
-										: 'download.png';
+									const fileName = `${$i18n
+										.t('Generated Image')
+										.toLowerCase()
+										.replace(/ /g, '_')}.${mimeType.split('/')[1]}`;
 
 									// Use FileSaver to save the blob
 									saveAs(blobWithType, fileName);

+ 1 - 0
src/lib/i18n/locales/en-US/translation.json

@@ -74,6 +74,7 @@
 	"Advanced Parameters": "",
 	"Advanced Params": "",
 	"AI": "",
+	"Generated Image": "Generated Image",
 	"All": "",
 	"All Documents": "",
 	"All models deleted successfully": "",