From f014e581f1e9ea97f77f5cb31518025fae402cef Mon Sep 17 00:00:00 2001
From: Apostolos Tsakpinis <apostolos.tsakpinis@gmail.com>
Date: Fri, 6 Sep 2024 06:45:44 +0300
Subject: [PATCH] fix: fallback to previous MQL api for Safari <14

---
 client/hooks/useMediaQuery.ts | 14 ++++++++++++--
 1 file changed, 12 insertions(+), 2 deletions(-)

diff --git a/client/hooks/useMediaQuery.ts b/client/hooks/useMediaQuery.ts
index cd7cefbd..158ca278 100644
--- a/client/hooks/useMediaQuery.ts
+++ b/client/hooks/useMediaQuery.ts
@@ -7,9 +7,19 @@ export function useMediaQuery(query: string, serverFallback: boolean = false): b
     return [
       () => mediaQueryList.matches,
       (notify: () => void) => {
-        mediaQueryList.addEventListener('change', notify);
+        if ('addEventListener' in mediaQueryList) {
+          mediaQueryList.addEventListener('change', notify);
+        } else {
+          //@ts-expect-error - Needed for Safari 13
+          mediaQueryList.addListener(notify);
+        }
         return () => {
-          mediaQueryList.removeEventListener('change', notify);
+          if ('removeEventListener' in mediaQueryList) {
+            mediaQueryList.removeEventListener('change', notify);
+          } else {
+            //@ts-expect-error - Needed for Safari 13
+            mediaQueryList.removeListener(notify);
+          }
         };
       },
       () => serverFallback,