Add mobile view and desktop view component

2 files changed, 28 insertions, 0 deletions

diff --git a/src/core/components/views/DesktopView.jsx b/src/core/components/views/DesktopView.jsx
new file mode 100644
index 00000000..31a67936
--- /dev/null
+++ b/src/core/components/views/DesktopView.jsx
@@ -0,0 +1,14 @@
+import isMobile from 'is-mobile'
+import { useEffect, useState } from 'react'
+
+const DesktopView = ({ children }) => {
+  const [view, setView] = useState(<></>)
+
+  useEffect(() => {
+    if (!isMobile()) setView(children)
+  }, [children])
+
+  return view
+}
+
+export default DesktopView
diff --git a/src/core/components/views/MobileView.jsx b/src/core/components/views/MobileView.jsx
new file mode 100644
index 00000000..be8aa293
--- /dev/null
+++ b/src/core/components/views/MobileView.jsx
@@ -0,0 +1,14 @@
+import isMobile from 'is-mobile'
+import { useEffect, useState } from 'react'
+
+const MobileView = ({ children }) => {
+  const [view, setView] = useState(<></>)
+
+  useEffect(() => {
+    if (isMobile()) setView(children)
+  }, [children])
+
+  return view
+}
+
+export default MobileView