diff --git a/examples/buddybook/package-lock.json b/examples/buddybook/package-lock.json index cbba8de..c291ab9 100644 --- a/examples/buddybook/package-lock.json +++ b/examples/buddybook/package-lock.json @@ -43,6 +43,7 @@ "@types/node": "^22.7.6", "@types/react": "^18.3.10", "@types/react-dom": "^18.3.0", + "@types/uuid": "^10.0.0", "@vitejs/plugin-react": "^4.3.2", "autoprefixer": "^10.4.20", "copy-webpack-plugin": "^11.0.0", @@ -6610,6 +6611,13 @@ "integrity": "sha512-ko/gIFJRv177XgZsZcBwnqJN5x/Gien8qNOn0D5bQU/zAzVf9Zt3BlcUiLqhV9y4ARk0GbT3tnUiPNgnTXzc/Q==", "license": "MIT" }, + "node_modules/@types/uuid": { + "version": "10.0.0", + "resolved": "https://registry.npmjs.org/@types/uuid/-/uuid-10.0.0.tgz", + "integrity": "sha512-7gqG38EyHgyP1S+7+xomFtL+ZNHcKv6DwNaCZmJmo1vgMugyF3TCnXVg4t1uk89mLNwnLtnY3TpOpCOyp1/xHQ==", + "dev": true, + "license": "MIT" + }, "node_modules/@types/ws": { "version": "8.5.13", "resolved": "https://registry.npmjs.org/@types/ws/-/ws-8.5.13.tgz", diff --git a/examples/buddybook/package.json b/examples/buddybook/package.json index eb60566..4d1ecff 100644 --- a/examples/buddybook/package.json +++ b/examples/buddybook/package.json @@ -48,6 +48,7 @@ "@types/node": "^22.7.6", "@types/react": "^18.3.10", "@types/react-dom": "^18.3.0", + "@types/uuid": "^10.0.0", "@vitejs/plugin-react": "^4.3.2", "autoprefixer": "^10.4.20", "copy-webpack-plugin": "^11.0.0", diff --git a/examples/buddybook/src/App.tsx b/examples/buddybook/src/App.tsx index 30b0c29..3a46233 100644 --- a/examples/buddybook/src/App.tsx +++ b/examples/buddybook/src/App.tsx @@ -80,12 +80,13 @@ function App() { return [...prevChains, message]; }); } + setWakuStatus(prev => ({ ...prev, store: 'success' })); } catch (error) { console.error("Error processing message:", error); + // Update store status to error when query fails + setWakuStatus(prev => ({ ...prev, store: 'error' })); // Continue processing other messages } - - setWakuStatus(prev => ({ ...prev, store: 'success' })); } catch (error) { console.error("Error fetching messages from store:", error); setWakuStatus(prev => ({ ...prev, store: 'error' })); diff --git a/examples/buddybook/src/components/Chain/SignChain.tsx b/examples/buddybook/src/components/Chain/SignChain.tsx index 0d6e6f2..9547ea6 100644 --- a/examples/buddybook/src/components/Chain/SignChain.tsx +++ b/examples/buddybook/src/components/Chain/SignChain.tsx @@ -7,9 +7,8 @@ import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogDescription, Di import { Button } from "@/components/ui/button"; import { Loader2 } from "lucide-react"; import QRCode from '@/components/QRCode'; -import { v4 as uuidv4 } from 'uuid'; import { useWalletPrompt } from '@/hooks/useWalletPrompt'; - +import { v4 as uuidv4 } from 'uuid'; interface SignChainProps { block: BlockPayload; chainsData: BlockPayload[]; // Add this prop @@ -25,6 +24,7 @@ const SignChain: React.FC = ({ block, chainsData, onSuccess }) = const { data: ensName } = useEnsName({ address }); const { node } = useWaku(); const { ensureWalletConnected } = useWalletPrompt(); + const [isWalletPrompt, setIsWalletPrompt] = useState(false); useEffect(() => { if (address) { @@ -109,8 +109,13 @@ const SignChain: React.FC = ({ block, chainsData, onSuccess }) = try { if (!address) { // If not connected, try to connect first + setIsWalletPrompt(true); const connected = await ensureWalletConnected(); - if (!connected) return; + setIsWalletPrompt(false); + if (!connected) { + setError('Please ensure your wallet is connected and the app is open.'); + return; + } } // Check if already signed @@ -119,6 +124,13 @@ const SignChain: React.FC = ({ block, chainsData, onSuccess }) = return; } + const isMobile = /iPhone|iPad|iPod|Android/i.test(navigator.userAgent); + if (isMobile && typeof window.ethereum === 'undefined') { + setError('Please ensure your wallet app is installed and open before signing.'); + window.location.href = 'metamask:///'; + return; + } + // Prepare the message const message = `Sign Block: Chain UUID: ${block.chainUUID} @@ -133,8 +145,10 @@ Signed by: ${ensName || address}`; signMessage({ message }); } catch (error) { console.error('Error in sign flow:', error); - setError('Failed to initiate signing. Please try again.'); + setError('Failed to initiate signing. Please ensure your wallet app is open and try again.'); setIsSigning(false); + } finally { + setIsWalletPrompt(false); } }; @@ -161,15 +175,42 @@ Signed by: ${ensName || address}`; - {error &&

{error}

} + {(error || isWalletPrompt) && ( +
+ {error &&

{error}

} + {isWalletPrompt && ( +
+

+ Attempting to connect to your wallet... +

+

+ If your wallet doesn't open automatically, please open it manually to approve the connection. +

+
+ )} + {/iPhone|iPad|iPod|Android/i.test(navigator.userAgent) && ( +

+ Tip: If your wallet doesn't open automatically, minimize this app and open your wallet manually before trying again. +

+ )} +
+ )} -