fix: fallback to previous MQL api for Safari <14

LWJGL · Sep 6, 2024 · f014e58 · f014e58
1 parent fa21732
commit f014e58
Showing 1 changed file with 12 additions and 2 deletions.
diff --git 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,