From 1f8a13bd229833bb77d3d602d585a2bc914c9002 Mon Sep 17 00:00:00 2001
From: ThaUnknown <6506529+ThaUnknown@users.noreply.github.com>
Date: Sat, 24 Feb 2024 18:28:57 +0100
Subject: [PATCH] fix: mobile check event listener leak

---
 common/Router.svelte | 14 +++++++++-----
 1 file changed, 9 insertions(+), 5 deletions(-)

diff --git a/common/Router.svelte b/common/Router.svelte
index 4e4e557..0236a89 100644
--- a/common/Router.svelte
+++ b/common/Router.svelte
@@ -1,3 +1,12 @@
+<script context='module'>
+  const mql = matchMedia('(min-width: 769px)')
+  const isMobile = readable(!mql.matches, set => {
+    const check = ({ matches }) => set(!matches)
+    mql.addEventListener('change', check)
+    return () => mql.removeEventListener('change', check)
+  })
+</script>
+
 <script>
   import Home from './views/Home/Home.svelte'
   import MediaHandler from './views/Player/MediaHandler.svelte'
@@ -10,11 +19,6 @@
 
   export let page = 'home'
 
-  const mql = matchMedia('(min-width: 769px)')
-  const isMobile = readable(!mql.matches, set => {
-    mql.addEventListener('change', ({ matches }) => set(!matches))
-  })
-
   $: minwidth = $isMobile ? '200px' : '35rem'
   $: maxwidth = $isMobile ? '200px' : '60rem'
 </script>