2 files changed, 28 insertions, 4 deletions
diff --git a/src/core/components/views/DesktopView.jsx b/src/core/components/views/DesktopView.jsx
index 31a67936..08c4b310 100644
--- a/src/core/components/views/DesktopView.jsx
+++ b/src/core/components/views/DesktopView.jsx
@@ -1,11 +1,23 @@
-import isMobile from 'is-mobile'
 import { useEffect, useState } from 'react'
 
 const DesktopView = ({ children }) => {
   const [view, setView] = useState(<></>)
 
   useEffect(() => {
-    if (!isMobile()) setView(children)
+    const handleResize = () => {
+      if (window.innerWidth >= 768) {
+        setView(children)
+      } else {
+        setView(<></>)
+      }
+    }
+
+    handleResize()
+    window.addEventListener('resize', handleResize)
+
+    return () => {
+      window.removeEventListener('resize', handleResize)
+    }
   }, [children])
 
   return view
diff --git a/src/core/components/views/MobileView.jsx b/src/core/components/views/MobileView.jsx
index be8aa293..348572c6 100644
--- a/src/core/components/views/MobileView.jsx
+++ b/src/core/components/views/MobileView.jsx
@@ -1,11 +1,23 @@
-import isMobile from 'is-mobile'
 import { useEffect, useState } from 'react'
 
 const MobileView = ({ children }) => {
   const [view, setView] = useState(<></>)
 
   useEffect(() => {
-    if (isMobile()) setView(children)
+    const handleResize = () => {
+      if (window.innerWidth < 768) {
+        setView(children)
+      } else {
+        setView(<></>)
+      }
+    }
+
+    handleResize()
+    window.addEventListener('resize', handleResize)
+
+    return () => {
+      window.removeEventListener('resize', handleResize)
+    }
   }, [children])
 
   return view