From 2289e3da8033d46746186540c43ca86231cd46a3 Mon Sep 17 00:00:00 2001
From: Morgan Ney <morganney@gmail.com>
Date: Thu, 18 Jan 2024 14:52:25 -0600
Subject: [PATCH] fix: replace screen.orientation with mediaQuery.

---
 .gitignore                 | 1 +
 packages/ui/src/layout.tsx | 5 +++--
 2 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/.gitignore b/.gitignore
index a41dc55..39156bd 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,4 +1,5 @@
 *.tgz
+*.zip
 dist
 node_modules
 coverage
diff --git a/packages/ui/src/layout.tsx b/packages/ui/src/layout.tsx
index 4ab93cc..5e77829 100644
--- a/packages/ui/src/layout.tsx
+++ b/packages/ui/src/layout.tsx
@@ -16,6 +16,7 @@ interface LayoutProps {
   children: ReactNode
 }
 
+const orientationMql = window.matchMedia('(orientation: landscape)')
 const Layout: FC<LayoutProps> = ({ children }) => {
   const location = useLocation()
   const { mode } = useTheme()
@@ -45,14 +46,14 @@ const Layout: FC<LayoutProps> = ({ children }) => {
     if (map) {
       map.on('move', moveListener)
       map.on('moveend', moveEndListener)
-      screen.orientation.addEventListener('change', orientationListener)
+      orientationMql.addEventListener('change', orientationListener)
     }
 
     return () => {
       if (map) {
         map.off('move', moveListener)
         map.off('moveend', moveEndListener)
-        screen.orientation.removeEventListener('change', orientationListener)
+        orientationMql.removeEventListener('change', orientationListener)
       }
     }
   }, [map])