frontend: Migrate to Svelte 5

1 files changed, 11 insertions, 11 deletions

diff --git a/frontend/src/lib/toolbar/EditSelection.svelte b/frontend/src/lib/toolbar/EditSelection.svelte
index 50e6656..1803ed4 100644
--- a/frontend/src/lib/toolbar/EditSelection.svelte
+++ b/frontend/src/lib/toolbar/EditSelection.svelte
@@ -1,20 +1,19 @@
 <script lang="ts">
-	import { getSelectionContext } from '$lib/Selection';
+	import { getSelectionContext } from '$lib/selection/Selection.svelte';
 	import { accelerator } from '$lib/Shortcuts';
-	import type { SvelteComponent } from 'svelte';
-	import { openModal } from 'svelte-modals';
+	import { toastFinally } from '$lib/Toasts';
+	import { modals, type ModalComponent, type ModalProps } from 'svelte-modals';
 
 	const selection = getSelectionContext();
 
-	export let dialog: typeof SvelteComponent<{
-		isOpen: boolean;
+	interface DialogProps extends ModalProps {
 		ids: number[];
-	}>;
+	}
+
+	let { dialog }: { dialog: ModalComponent<DialogProps> } = $props();
 
 	function edit() {
-		openModal(dialog, {
-			ids: $selection.ids
-		});
+		modals.open(dialog, { ids: selection.ids }).catch(toastFinally);
 	}
 </script>
 
@@ -22,8 +21,9 @@
 	type="button"
 	class="btn-slate hover:bg-blue-700"
 	title="Edit selection"
-	on:click={edit}
+	aria-label="Edit selection"
+	onclick={edit}
 	use:accelerator={'e'}
 >
-	<span class="icon-base icon-[material-symbols--edit]" />
+	<span class="icon-base icon-[material-symbols--edit]"></span>
 </button>