fix: Shift delete in Manage Files asks for confirmation (#32817)

Holding Shift while deleting a file in Manage Files used to delete it at once, but since the redesign every delete asks "Delete 1 file?" first. Shift+click or Shift+Enter on a file's Delete option now deletes it straight away again, and the option turns red while Shift is held, as before. Delete without Shift still asks.

Fixes #32814

src/lib/components/layout/FilesModal.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
 	import { toast } from 'svelte-sonner';
-	import { getContext, onDestroy } from 'svelte';
+	import { getContext, onMount, onDestroy } from 'svelte';
 	import type { Writable } from 'svelte/store';
 	import dayjs from 'dayjs';
 
@@ -51,6 +51,7 @@
 	let stopRequested = false;
 	let selectedFile: any = null;
 	let showFileItemModal = false;
+	let shiftKey = false;
 
 	$: busy = selectionStatus === 'loading' || !!operation || showDeleteConfirmDialog;
 	$: loadedSelected = (files ?? []).filter((file) => selectedIds.has(file.id)).length;
@@ -224,6 +225,34 @@
 		}
 	};
 
+	onMount(() => {
+		const onKeyDown = (event: KeyboardEvent) => {
+			if (event.key === 'Shift') {
+				shiftKey = true;
+			}
+		};
+
+		const onKeyUp = (event: KeyboardEvent) => {
+			if (event.key === 'Shift') {
+				shiftKey = false;
+			}
+		};
+
+		const onBlur = () => {
+			shiftKey = false;
+		};
+
+		window.addEventListener('keydown', onKeyDown);
+		window.addEventListener('keyup', onKeyUp);
+		window.addEventListener('blur', onBlur);
+
+		return () => {
+			window.removeEventListener('keydown', onKeyDown);
+			window.removeEventListener('keyup', onKeyUp);
+			window.removeEventListener('blur', onBlur);
+		};
+	});
+
 	onDestroy(() => {
 		show = false;
 		stopRequested = true;
@@ -483,8 +512,18 @@
 										><ArrowDownTray className="size-3.5" />{$i18n.t('Download')}</button
 									>
 									<!-- {$i18n.t('Delete File')} -->
-									<button type="button" disabled={busy} on:click={() => requestDelete([file.id])}
-										><GarbageBin className="size-3.5" />{$i18n.t('Delete')}</button
+									<button
+										type="button"
+										disabled={busy}
+										class={shiftKey ? 'text-red-500' : ''}
+										on:click={(event) => {
+											if (event.shiftKey) {
+												deleteIds = [file.id];
+												deleteHandler();
+											} else {
+												requestDelete([file.id]);
+											}
+										}}><GarbageBin className="size-3.5" />{$i18n.t('Delete')}</button
 									>
 								</DropdownMenu>
 							</div>