Implement that toasts are paused when a modal is opened

src/lib/components/layout/toasts/Toast.svelte

@@ -12,6 +12,7 @@
 	import type { Readable } from 'svelte/store';
 	import { confirmation } from '../confirmation';
 	import { useLauncher } from '../launcher/hook';
+	import { openedModals } from '$lib/stores';
 
 	export let type: 'success' | 'error' | 'warning' | 'info' = 'success';
 	export let content: Readable<string>;
@@ -33,6 +34,7 @@
 			if (!document.hasFocus()) return true;
 			if ($confirmation) return true;
 			if ($isLauncherOpened) return true;
+			if ($openedModals > 0) return true;
 
 			return false;
 		}

src/lib/components/modal/Modal.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+	import { openedModals } from '$lib/stores';
 	import { enableScrolling } from '$lib/utils/dom/scroll';
 	import { createEventDispatcher } from 'svelte';
 	import { Icon, XMark } from 'svelte-hero-icons';
@@ -11,8 +12,10 @@
 	export let isOpen = false;
 
 	export const open = () => {
-		console.log('Open inside');
 		if (!dialogElement) return;
+		if (dialogElement.open) return;
+
+		openedModals.update((x) => x + 1);
 		dialogElement.showModal();
 		isOpen = true;
 		dispatch('open');
@@ -21,6 +24,9 @@
 
 	export const close = () => {
 		if (!dialogElement) return;
+		if (!dialogElement.open) return;
+
+		openedModals.update((x) => x - 1);
 		dialogElement.close();
 		isOpen = false;
 		dispatch('close');

src/lib/stores.ts

@@ -4,3 +4,5 @@ import { svocal } from './utils/store/svocal';
 export const navHeight = writable(0);
 export const footerHeight = writable(0);
 export const currentLang = svocal('i18n.currentlang');
+
+export const openedModals = writable(0);