fix crash on mobile

betteridea-dev · May 24, 2024 · 1251c6e · 1251c6e
1 parent 77d6559
commit 1251c6e
Show file tree

Hide file tree

Showing 7 changed files with 30 additions and 1 deletion.
diff --git a/next_app/src/components/ao/landing.tsx b/next_app/src/components/ao/landing.tsx
@@ -52,6 +52,7 @@ export default function AOLanding() {
     }
 
     function disconnectWallet() {
+        if (!window.arweaveWallet) return;
         window.arweaveWallet.disconnect();
         setAutoconnect(false);
         setWalletAddress("");

diff --git a/next_app/src/components/ao/new-ao-project-dialog.tsx b/next_app/src/components/ao/new-ao-project-dialog.tsx
@@ -111,6 +111,7 @@ export function NewAOProjectDialog({ manager, collapsed }: { manager: ProjectMan
   const [processes, setProcesses] = useState([{ label: "+ Create New", value: "NEW_PROCESS" }]);
 
   async function fetchProcesses() {
+    if (!window.arweaveWallet) return;
     const client = new GraphQLClient("https://arweave.net/graphql");
     const address = await window.arweaveWallet.getActiveAddress();
 

diff --git a/next_app/src/components/bottom-statusbar.tsx b/next_app/src/components/bottom-statusbar.tsx
@@ -31,6 +31,7 @@ export default function BottomStatusbar() {
   }
 
   function disconnectWallet() {
+    if (!window.arweaveWallet) return;
     window.arweaveWallet.disconnect();
     setAutoconnect(false);
     setWalletAddress("");

diff --git a/next_app/src/components/side-bar.tsx b/next_app/src/components/side-bar.tsx
@@ -23,6 +23,7 @@ export default function SideBar({ collapsed, manager }: { collapsed: boolean; ma
     if (typeof window == "undefined") return;
     setMounted(true);
     async function a() {
+      if (!window.arweaveWallet) return;
       setActiveAddress(await window.arweaveWallet.getActiveAddress());
     }
     a()

diff --git a/next_app/src/hooks/useProjectManager.tsx → next_app/src/hooks/useProjectManager.ts b/next_app/src/hooks/useProjectManager.tsx → next_app/src/hooks/useProjectManager.ts
diff --git a/next_app/src/pages/_app.tsx b/next_app/src/pages/_app.tsx
@@ -5,6 +5,7 @@ import { Toaster } from "@/components/ui/toaster";
 import { Toaster as Sonner } from "@/components/ui/sonner";
 import { ThemeProvider } from "@/components/theme-provider";
 import { GoogleAnalytics } from "@next/third-parties/google";
+import { useEffect, useState } from "react";
 // import { GoogleAnalytics } from "nextjs-google-analytics";
 
 
@@ -20,12 +21,28 @@ declare global {
 }
 
 export default function App({ Component, pageProps }: AppProps) {
+  const [isMobile, setIsMobile] = useState(false);
+
+  useEffect(() => {
+    if (typeof window !== "undefined") {
+      const userAgent = typeof window.navigator === "undefined" ? "bot" : navigator.userAgent;
+      const isMobile = Boolean(userAgent.match(
+        /Android|BlackBerry|iPhone|iPad|iPod|Opera Mini|IEMobile|WPDesktop/i
+      ));
+      setIsMobile(isMobile);
+    }
+  }, []);
+
   return (
     <div className="font-btr-normal min-h-screen">
       <ThemeProvider attribute="class" defaultTheme="dark" enableSystem>
         {/* <GoogleAnalytics trackPageViews gaMeasurementId="G-7H9SL00HCC" /> */}
         <GoogleAnalytics gaId="G-7H9SL00HCC" />
-        <Component {...pageProps} />
+        {isMobile ? <div className="h-screen w-screen flex items-center justify-center p-2"><div>
+          Hi There!<br />Looks like you are using a mobile device. <br />Please use a desktop device to access the IDE.
+          <br /><br />Thank you!<br /><br />~The developer
+        </div></div> :
+          <Component {...pageProps} />}
         <Toaster />
         <Sonner />
       </ThemeProvider>

diff --git a/next_app/src/pages/import.tsx b/next_app/src/pages/import.tsx
@@ -5,6 +5,7 @@ import { useProjectManager } from "@/hooks";
 import { useRouter } from "next/router";
 import Image from "next/image";
 import Icons from "@/assets/icons";
+import { toast } from "@/components/ui/use-toast";
 
 
 export default function Import() {
@@ -29,7 +30,14 @@ export default function Import() {
             setData(decodeURIComponent(r.Messages[0].Data))
             const data = JSON.parse(`${decodeURIComponent(r.Messages[0].Data)}`)
             console.log(data)
+
             try {
+                if (!window.arweaveWallet)
+                    return toast({
+                        title: "No Arweave wallet found",
+                        description: "You might want to install ArConnect extension to import the project",
+                    });
+
                 await window.arweaveWallet.getActiveAddress()
             }
             catch (e) {