From 9c4fbc30f908234fb3585951cfb6792c3804de9e Mon Sep 17 00:00:00 2001 From: cupcakearmy Date: Sun, 7 Jun 2026 13:53:38 +0200 Subject: [PATCH] cleanup --- mise.toml | 3 + packages/frontend/locales/cs.json | 5 +- packages/frontend/locales/de.json | 5 +- packages/frontend/locales/en.json | 4 +- packages/frontend/locales/es.json | 5 +- packages/frontend/locales/fr.json | 5 +- packages/frontend/locales/it.json | 5 +- packages/frontend/locales/ja.json | 5 +- packages/frontend/locales/pl.json | 5 +- packages/frontend/locales/ru.json | 5 +- packages/frontend/locales/zh-TW.json | 5 +- packages/frontend/locales/zh.json | 5 +- .../src/lib/ui/PastedFilesPreview.svelte | 155 ++++++++++++++ packages/frontend/src/lib/views/Create.svelte | 200 +++++------------- packages/frontend/vite.config.js | 8 +- 15 files changed, 255 insertions(+), 165 deletions(-) create mode 100644 packages/frontend/src/lib/ui/PastedFilesPreview.svelte diff --git a/mise.toml b/mise.toml index d92acf3..b3f1828 100644 --- a/mise.toml +++ b/mise.toml @@ -6,3 +6,6 @@ watchexec = "latest" [settings] idiomatic_version_file_enable_tools = ["node"] + +[env] +SIZE_LIMIT = "100mb" diff --git a/packages/frontend/locales/cs.json b/packages/frontend/locales/cs.json index e174950..2450acf 100644 --- a/packages/frontend/locales/cs.json +++ b/packages/frontend/locales/cs.json @@ -36,7 +36,10 @@ "advanced": { "explanation": "Ve výchozím nastavení se pro každou poznámku generuje bezpečné heslo. Pokud chcete, můžete si nastavit vlastní heslo, které nebude součástí odkazu.", "custom_password": "Vlastní heslo" - } + }, + "pasting": "Vkládání...", + "pasted_files": "Vložené soubory", + "remove": "Odstranit" }, "show": { "errors": { diff --git a/packages/frontend/locales/de.json b/packages/frontend/locales/de.json index 2b7f856..a43e794 100644 --- a/packages/frontend/locales/de.json +++ b/packages/frontend/locales/de.json @@ -36,7 +36,10 @@ "advanced": { "explanation": "Standardmäßig wird für jede Notiz ein generiertes, sicheres Passwort verwendet. Alternativ können Sie ein eigenes Kennwort festlegen, welches nicht im Link enthalten ist.", "custom_password": "Benutzerdefiniertes Passwort" - } + }, + "pasting": "Einfügen...", + "pasted_files": "Eingefügte Dateien", + "remove": "Entfernen" }, "show": { "errors": { diff --git a/packages/frontend/locales/en.json b/packages/frontend/locales/en.json index f10ff64..adc9829 100644 --- a/packages/frontend/locales/en.json +++ b/packages/frontend/locales/en.json @@ -37,8 +37,8 @@ "explanation": "By default, a securely generated password is used for each note. You can however also choose your own password, which is not included in the link.", "custom_password": "custom password" }, - "pasting": "Pasting image...", - "pasted_images": "Pasted Images", + "pasting": "Pasting...", + "pasted_files": "Pasted Files", "remove": "Remove" }, "show": { diff --git a/packages/frontend/locales/es.json b/packages/frontend/locales/es.json index b482c22..e17d18b 100644 --- a/packages/frontend/locales/es.json +++ b/packages/frontend/locales/es.json @@ -36,7 +36,10 @@ "advanced": { "explanation": "Por defecto, se utiliza una contraseña generada de forma segura para cada nota. No obstante, también puede elegir su propia contraseña, la cual no se incluye en el enlace.", "custom_password": "contraseña personalizada" - } + }, + "pasting": "Pegando...", + "pasted_files": "Archivos pegados", + "remove": "Eliminar" }, "show": { "errors": { diff --git a/packages/frontend/locales/fr.json b/packages/frontend/locales/fr.json index 41a7b50..1c655fb 100644 --- a/packages/frontend/locales/fr.json +++ b/packages/frontend/locales/fr.json @@ -36,7 +36,10 @@ "advanced": { "explanation": "Par défaut, un mot de passe généré de manière sécurisée est utilisé pour chaque note. Vous pouvez toutefois choisir votre propre mot de passe, qui n'est pas inclus dans le lien.", "custom_password": "mot de passe personnalisé" - } + }, + "pasting": "Collage...", + "pasted_files": "Fichiers collés", + "remove": "Supprimer" }, "show": { "errors": { diff --git a/packages/frontend/locales/it.json b/packages/frontend/locales/it.json index b2636b9..32b156d 100644 --- a/packages/frontend/locales/it.json +++ b/packages/frontend/locales/it.json @@ -36,7 +36,10 @@ "advanced": { "explanation": "Per impostazione predefinita, per ogni nota viene utilizzata una password generata in modo sicuro. È tuttavia possibile scegliere la propria password, che non è inclusa nel link.", "custom_password": "password personalizzata" - } + }, + "pasting": "Incollando...", + "pasted_files": "File incollati", + "remove": "Rimuovi" }, "show": { "errors": { diff --git a/packages/frontend/locales/ja.json b/packages/frontend/locales/ja.json index 97833e2..9e3d625 100644 --- a/packages/frontend/locales/ja.json +++ b/packages/frontend/locales/ja.json @@ -36,7 +36,10 @@ "advanced": { "explanation": "デフォルトでは、安全に生成されたパスワードが各ノートに使用されます。しかし、リンクに含まれない独自のパスワードを選択することもできます。", "custom_password": "カスタムパスワード" - } + }, + "pasting": "貼り付け中...", + "pasted_files": "貼り付けたファイル", + "remove": "削除" }, "show": { "errors": { diff --git a/packages/frontend/locales/pl.json b/packages/frontend/locales/pl.json index a92a0ee..930c1b5 100644 --- a/packages/frontend/locales/pl.json +++ b/packages/frontend/locales/pl.json @@ -36,7 +36,10 @@ "advanced": { "explanation": "Domyślnie dla każdej notatki używane jest bezpiecznie wygenerowane hasło. Możesz jednak wybrać własne hasło, które nie jest uwzględnione w linku.", "custom_password": "własne hasło" - } + }, + "pasting": "Wklejanie...", + "pasted_files": "Wklejone pliki", + "remove": "Usuń" }, "show": { "errors": { diff --git a/packages/frontend/locales/ru.json b/packages/frontend/locales/ru.json index c2f33ac..1c304f2 100644 --- a/packages/frontend/locales/ru.json +++ b/packages/frontend/locales/ru.json @@ -36,7 +36,10 @@ "advanced": { "explanation": "По умолчанию для каждой заметки используется безопасно сгенерированный пароль. Однако вы также можете выбрать свой собственный пароль, который не включен в ссылку.", "custom_password": "пользовательский пароль" - } + }, + "pasting": "Вставка...", + "pasted_files": "Вставленные файлы", + "remove": "Удалить" }, "show": { "errors": { diff --git a/packages/frontend/locales/zh-TW.json b/packages/frontend/locales/zh-TW.json index 819aea0..2dd31f7 100644 --- a/packages/frontend/locales/zh-TW.json +++ b/packages/frontend/locales/zh-TW.json @@ -36,7 +36,10 @@ "advanced": { "explanation": "預設情況下，每個筆記都會使用安全生成的密碼。您也可以選擇自己的密碼，該密碼不會包含在連結中。", "custom_password": "自定義密碼" - } + }, + "pasting": "正在粘貼...", + "pasted_files": "粘貼的檔案", + "remove": "移除" }, "show": { "errors": { diff --git a/packages/frontend/locales/zh.json b/packages/frontend/locales/zh.json index be5e506..7aaf1d9 100644 --- a/packages/frontend/locales/zh.json +++ b/packages/frontend/locales/zh.json @@ -36,7 +36,10 @@ "advanced": { "explanation": "默认情况下，每个笔记都使用安全生成的密码。但是，您也可以选择您自己的密码，该密码未包含在链接中。", "custom_password": "自定义密码" - } + }, + "pasting": "正在粘贴...", + "pasted_files": "粘贴的文件", + "remove": "移除" }, "show": { "errors": { diff --git a/packages/frontend/src/lib/ui/PastedFilesPreview.svelte b/packages/frontend/src/lib/ui/PastedFilesPreview.svelte new file mode 100644 index 0000000..ba72838 --- /dev/null +++ b/packages/frontend/src/lib/ui/PastedFilesPreview.svelte @@ -0,0 +1,155 @@ + + +{#if files.length > 0} +
+

{$t('home.pasted_files')}

+
+ {#each files as entry, index} +
+ {#if isImage(entry.type)} + {entry.name} + {:else} +
+
+ {entry.name.split('.').pop()?.toUpperCase() || entry.type} +
+
+ {/if} +
{entry.name}
+
+ +
+
+ {/each} +
+
+{/if} + + diff --git a/packages/frontend/src/lib/views/Create.svelte b/packages/frontend/src/lib/views/Create.svelte index 8b744c4..983120b 100644 --- a/packages/frontend/src/lib/views/Create.svelte +++ b/packages/frontend/src/lib/views/Create.svelte @@ -10,6 +10,7 @@ import FileUpload from '$lib/ui/FileUpload.svelte' import Loader from '$lib/ui/Loader.svelte' import MaxSize from '$lib/ui/MaxSize.svelte' + import PastedFilesPreview from '$lib/ui/PastedFilesPreview.svelte' import Result, { type NoteResult } from '$lib/ui/NoteResult.svelte' import Switch from '$lib/ui/Switch.svelte' import TextArea from '$lib/ui/TextArea.svelte' @@ -29,11 +30,7 @@ let customPassword: string | null = $state(null) let description = $state('') let loading: string | null = $state(null) - - // Image paste functionality - let pastedImages: { preview: string; file: File }[] = $state([]) let isPasting = $state(false) - let pasteIndicator = $state(null) $effect(() => { if (!advanced) { @@ -63,81 +60,59 @@ }) async function handlePaste(e: ClipboardEvent) { - // Use the standard DataTransfer API to access pasted content - const items = e.clipboardData?.items - if (!items || items.length === 0) return + e.preventDefault() + const data = e.clipboardData + if (!data) return + + const raw: File[] = [] + + if (data.files.length) { + raw.push(...Array.from(data.files)) + } + + for (let i = 0; i < data.items.length; i++) { + const item = data.items[i] + if (item.kind === 'file') { + const file = item.getAsFile() + if (file) raw.push(file) + } + } + + if (raw.length === 0) return + + const seen = new Set() + const pasted: File[] = [] + for (const f of raw) { + const key = `${f.name}|${f.size}` + if (!seen.has(key)) { + seen.add(key) + pasted.push(f) + } + } isPasting = true - const imagePromises: Promise[] = [] - for (let i = 0; i < items.length; i++) { - const item = items[i] - if (item.kind === 'file' && item.type.startsWith('image/')) { - const file = item.getAsFile() - if (file) { - const extension = file.type.split('/')[1] || 'png' - const renamed = new File( - [file], - `pasted-image-${Date.now()}-${Math.round(Math.random() * 1000)}.${extension}`, - { type: file.type }, - ) - imagePromises.push(Promise.resolve(renamed)) + const dtos: FileDTO[] = await Promise.all( + pasted.map(async (file) => { + const ext = file.name.includes('.') ? '' : `.${file.type.split('/')[1] || 'bin'}` + const name = + file.name || `pasted-file-${Date.now()}-${Math.round(Math.random() * 1000)}${ext}` + const renamed = new File([file], name, { type: file.type }) + return { + name: renamed.name, + size: renamed.size, + type: renamed.type, + contents: new Uint8Array(await renamed.arrayBuffer()), } - } + }) + ) + + if (dtos.length > 0) { + if (!isFile) isFile = true + files = [...files, ...dtos] } - try { - const results = await Promise.all(imagePromises) - const imageFiles = results.filter((file): file is File => file !== null) - - if (imageFiles.length > 0) { - // Switch to file mode if not already - if (!isFile) { - isFile = true - } - - // Process each image for preview and add to files - for (const imageFile of imageFiles) { - // Create preview URL - const previewURL = URL.createObjectURL(imageFile) - - // Add to pasted images for preview - pastedImages = [...pastedImages, { preview: previewURL, file: imageFile }] - - // Convert to FileDTO and add to files array - const arrayBuffer = await imageFile.arrayBuffer() - const fileDTO: FileDTO = { - name: imageFile.name, - size: imageFile.size, - type: imageFile.type, - contents: new Uint8Array(arrayBuffer) - } - - // Add to files if not already present - if (!files.some(f => f.name === imageFile.name && f.size === imageFile.size)) { - files = [...files, fileDTO] - } - } - } - } catch (error) { - console.error('Error processing pasted image:', error) - } finally { - isPasting = false - } - } - - function removePastedImage(index: number) { - const removed = pastedImages.splice(index, 1)[0] - // Revoke the object URL to free memory - URL.revokeObjectURL(removed.preview) - - // Also remove from files array - files = files.filter(file => !(file.name === removed.file.name && file.size === removed.file.size)) - - // If no more pasted images and no other files, switch back to text mode - if (pastedImages.length === 0 && files.length === 0) { - isFile = false - } + isPasting = false } class EmptyContentError extends Error {} @@ -195,7 +170,7 @@

-
+
{#if isPasting}
@@ -213,26 +188,7 @@ /> {/if} - {#if pastedImages.length > 0} -
-

{$t('home.pasted_images')}

-
- {#each pastedImages as image, index} -
- Pasted image -
- -
-
- {/each} -
-
- {/if} - +
@@ -293,7 +249,6 @@ flex: 1; } - /* Paste indicator styles */ .paste-indicator { position: relative; min-height: 200px; @@ -325,59 +280,8 @@ } @keyframes spin { - to { transform: rotate(360deg); } - } - - .pasted-images-preview { - margin-top: 1rem; - padding: 1rem; - border: 1px dashed #ccc; - border-radius: 4px; - background-color: #fafafa; - } - - .pasted-images-preview h4 { - margin-top: 0; - margin-bottom: 0.5rem; - color: #333; - } - - .images-grid { - display: flex; - flex-wrap: wrap; - gap: 1rem; - } - - .image-preview { - position: relative; - text-align: center; - } - - .preview-img { - max-width: 150px; - max-height: 150px; - border-radius: 4px; - box-shadow: 0 2px 8px rgba(0,0,0,0.1); - } - - .image-actions { - margin-top: 0.5rem; - } - - /* Responsive design */ - @media (max-width: 640px) { - .pasted-images-preview { - margin-top: 0.5rem; - padding: 0.5rem; - } - - .preview-img { - max-width: 120px; - max-height: 120px; - } - - .images-grid { - gap: 0.5rem; + to { + transform: rotate(360deg); } } diff --git a/packages/frontend/vite.config.js b/packages/frontend/vite.config.js index 265832f..72d399e 100644 --- a/packages/frontend/vite.config.js +++ b/packages/frontend/vite.config.js @@ -1,10 +1,10 @@ import { sveltekit } from '@sveltejs/kit/vite' import precompileIntl from 'svelte-intl-precompile/sveltekit-plugin' +import { defineConfig } from 'vite' const port = 3000 -/** @type {import('vite').UserConfig} */ -const config = { +export default defineConfig({ clearScreen: false, server: { port, @@ -14,6 +14,4 @@ const config = { }, preview: { port }, plugins: [sveltekit(), precompileIntl('locales')], -} - -export default config +})