From baa5145ff1b95341681349d353eeddd281e2fd94 Mon Sep 17 00:00:00 2001
From: Danish Arora <danisharora099@gmail.com>
Date: Mon, 11 Nov 2024 16:05:14 +0700
Subject: [PATCH 1/5] chore: connection status

---
 examples/buddybook/src/App.tsx                |  4 ++
 .../src/components/ConnectionStatus.tsx       | 53 +++++++++++++++++++
 .../buddybook/src/components/ui/dialog.tsx    | 12 +++--
 3 files changed, 65 insertions(+), 4 deletions(-)
 create mode 100644 examples/buddybook/src/components/ConnectionStatus.tsx

diff --git a/examples/buddybook/src/App.tsx b/examples/buddybook/src/App.tsx
index 34f8f5d..30b0c29 100644
--- a/examples/buddybook/src/App.tsx
+++ b/examples/buddybook/src/App.tsx
@@ -12,6 +12,7 @@ import { BlockPayload, getMessagesFromStore, subscribeToFilter } from './lib/wak
 import TelemetryOptIn from './components/TelemetryOptIn';
 import TelemetryPage from './components/TelemetryPage';
 import SignSharedChain from './components/Chain/SignSharedChain'
+import ConnectionStatus from '@/components/ConnectionStatus';
 
 type Status = 'success' | 'in-progress' | 'error';
 
@@ -132,6 +133,9 @@ function App() {
   return (
     <div className="min-h-screen bg-background text-foreground">
       <Header wakuStatus={wakuStatus} />
+      <div className="md:hidden">
+        <ConnectionStatus filter={wakuStatus.filter} store={wakuStatus.store} />
+      </div>
       <main className="container mx-auto px-4 py-4 md:py-8 max-w-7xl">
         <Routes>
           <Route path="" element={<Home />} />
diff --git a/examples/buddybook/src/components/ConnectionStatus.tsx b/examples/buddybook/src/components/ConnectionStatus.tsx
new file mode 100644
index 0000000..dd1ab32
--- /dev/null
+++ b/examples/buddybook/src/components/ConnectionStatus.tsx
@@ -0,0 +1,53 @@
+import React from 'react';
+import { Card } from "@/components/ui/card";
+import { Loader2, CheckCircle2, XCircle } from "lucide-react";
+import type { Status } from '@/App';
+
+interface ConnectionStatusProps {
+  filter: Status;
+  store: Status;
+}
+
+const StatusIndicator: React.FC<{ status: Status; label: string }> = ({ status, label }) => {
+  const getStatusIcon = () => {
+    switch (status) {
+      case 'success':
+        return <CheckCircle2 className="h-4 w-4 text-green-500" />;
+      case 'error':
+        return <XCircle className="h-4 w-4 text-red-500" />;
+      case 'in-progress':
+        return <Loader2 className="h-4 w-4 animate-spin text-yellow-500" />;
+    }
+  };
+
+  const getStatusColor = () => {
+    switch (status) {
+      case 'success':
+        return 'bg-green-500/10 text-green-500';
+      case 'error':
+        return 'bg-red-500/10 text-red-500';
+      case 'in-progress':
+        return 'bg-yellow-500/10 text-yellow-500';
+    }
+  };
+
+  return (
+    <div className={`flex items-center gap-2 px-2 py-1 rounded-full ${getStatusColor()}`}>
+      {getStatusIcon()}
+      <span className="text-xs font-medium">{label}</span>
+    </div>
+  );
+};
+
+const ConnectionStatus: React.FC<ConnectionStatusProps> = ({ filter, store }) => {
+  return (
+    <Card className="fixed bottom-4 left-4 right-4 md:static md:bottom-auto md:left-auto p-2 bg-background/80 backdrop-blur-sm border shadow-lg z-50 md:z-auto">
+      <div className="flex flex-row justify-around md:justify-start md:gap-4">
+        <StatusIndicator status={filter} label="Filter" />
+        <StatusIndicator status={store} label="Store" />
+      </div>
+    </Card>
+  );
+};
+
+export default ConnectionStatus; 
\ No newline at end of file
diff --git a/examples/buddybook/src/components/ui/dialog.tsx b/examples/buddybook/src/components/ui/dialog.tsx
index f2ca1ce..0e36c68 100644
--- a/examples/buddybook/src/components/ui/dialog.tsx
+++ b/examples/buddybook/src/components/ui/dialog.tsx
@@ -1,6 +1,5 @@
 import * as React from "react"
 import * as DialogPrimitive from "@radix-ui/react-dialog"
-import { Cross2Icon } from "@radix-ui/react-icons"
 
 import { cn } from "@/lib/utils"
 
@@ -36,9 +35,14 @@ const DialogContent = React.forwardRef<
     <DialogPrimitive.Content
       ref={ref}
       className={cn(
-        "fixed left-[50%] top-[50%] z-50 grid w-full translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200",
-        "rounded-lg",
-        "max-h-[85vh] overflow-y-auto",
+        "fixed left-[50%] top-[50%] z-50 grid w-full translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background shadow-lg duration-200",
+        "p-4 md:p-6",
+        "rounded-t-lg md:rounded-lg",
+        "max-h-[95vh] md:max-h-[85vh]",
+        "w-full md:max-w-lg",
+        "bottom-0 md:bottom-auto",
+        "overflow-y-auto",
+        "focus:outline-none focus-visible:ring-2 focus-visible:ring-accent",
         className
       )}
       {...props}

From da8b9c9790ae26456f41ea5dedd46809718c4376 Mon Sep 17 00:00:00 2001
From: Danish Arora <danisharora099@gmail.com>
Date: Mon, 11 Nov 2024 16:39:46 +0700
Subject: [PATCH 2/5] chore: improvements

---
 examples/buddybook/package-lock.json          |  8 +++
 examples/buddybook/package.json               |  1 +
 examples/buddybook/src/App.tsx                |  5 +-
 .../src/components/Chain/SignChain.tsx        | 53 ++++++++++++++++---
 .../src/components/ConnectionStatus.tsx       |  3 +-
 examples/buddybook/src/components/Header.tsx  | 24 +++++----
 .../buddybook/src/hooks/useWalletPrompt.ts    | 25 +++++++--
 7 files changed, 95 insertions(+), 24 deletions(-)

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<SignChainProps> = ({ block, chainsData, onSuccess }) =
   const { data: ensName } = useEnsName({ address });
   const { node } = useWaku<LightNode>();
   const { ensureWalletConnected } = useWalletPrompt();
+  const [isWalletPrompt, setIsWalletPrompt] = useState(false);
 
   useEffect(() => {
     if (address) {
@@ -109,8 +109,13 @@ const SignChain: React.FC<SignChainProps> = ({ 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<SignChainProps> = ({ 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}`;
             </div>
             <QRCode text={`${window.location.origin}/sign/${block.chainUUID}/${block.blockUUID}`} />
           </div>
-          {error && <p className="text-sm text-destructive">{error}</p>}
+          {(error || isWalletPrompt) && (
+            <div className="space-y-2">
+              {error && <p className="text-sm text-destructive">{error}</p>}
+              {isWalletPrompt && (
+                <div className="rounded-md bg-blue-50 p-4">
+                  <p className="text-sm text-blue-700">
+                    Attempting to connect to your wallet...
+                  </p>
+                  <p className="text-xs text-blue-600 mt-1">
+                    If your wallet doesn't open automatically, please open it manually to approve the connection.
+                  </p>
+                </div>
+              )}
+              {/iPhone|iPad|iPod|Android/i.test(navigator.userAgent) && (
+                <p className="text-xs text-muted-foreground">
+                  Tip: If your wallet doesn't open automatically, minimize this app and open your wallet manually before trying again.
+                </p>
+              )}
+            </div>
+          )}
           <DialogFooter>
             <Button variant="secondary" onClick={() => setIsOpen(false)}>Cancel</Button>
-            <Button onClick={handleSign} disabled={isSigning || alreadySigned}>
+            <Button 
+              onClick={handleSign} 
+              disabled={isSigning || alreadySigned || isWalletPrompt}
+            >
               {isSigning ? (
                 <>
                   <Loader2 className="mr-2 h-4 w-4 animate-spin" />
                   Signing...
                 </>
+              ) : isWalletPrompt ? (
+                <>
+                  <Loader2 className="mr-2 h-4 w-4 animate-spin" />
+                  Connecting...
+                </>
               ) : alreadySigned ? (
                 'Already Signed'
               ) : !address ? (
diff --git a/examples/buddybook/src/components/ConnectionStatus.tsx b/examples/buddybook/src/components/ConnectionStatus.tsx
index dd1ab32..1f4c33a 100644
--- a/examples/buddybook/src/components/ConnectionStatus.tsx
+++ b/examples/buddybook/src/components/ConnectionStatus.tsx
@@ -1,7 +1,8 @@
 import React from 'react';
 import { Card } from "@/components/ui/card";
 import { Loader2, CheckCircle2, XCircle } from "lucide-react";
-import type { Status } from '@/App';
+
+type Status = 'success' | 'error' | 'in-progress';
 
 interface ConnectionStatusProps {
   filter: Status;
diff --git a/examples/buddybook/src/components/Header.tsx b/examples/buddybook/src/components/Header.tsx
index f659cd2..6649830 100644
--- a/examples/buddybook/src/components/Header.tsx
+++ b/examples/buddybook/src/components/Header.tsx
@@ -82,30 +82,32 @@ const Header: React.FC<HeaderProps> = ({ wakuStatus }) => {
             </nav>
 
             <div className="flex items-center gap-2 md:gap-4">
-              <div className="hidden md:flex items-center gap-2">
+              <div className="flex items-center gap-2">
                 {!isWakuLoading && !wakuError && (
                   <>
                     <div className="flex items-center space-x-1">
-                      <span className="text-muted-foreground">Filter:</span>
+                      <span className="hidden md:inline text-muted-foreground">Filter:</span>
                       <div className={`w-2 h-2 md:w-3 md:h-3 rounded-full ${getStatusColor(wakuStatus.filter)}`}></div>
                     </div>
                     <div className="flex items-center space-x-1">
-                      <span className="text-muted-foreground">Store:</span>
+                      <span className="hidden md:inline text-muted-foreground">Store:</span>
                       <div className={`w-2 h-2 md:w-3 md:h-3 rounded-full ${getStatusColor(wakuStatus.store)}`}></div>
                     </div>
+                    <div className="flex items-center space-x-1">
+                      <span className="hidden md:inline text-muted-foreground">Peers:</span>
+                      {isWakuLoading ? (
+                        <Loader2 className="h-4 w-4 animate-spin" />
+                      ) : wakuError ? (
+                        <div className={`w-2 h-2 md:w-3 md:h-3 rounded-full bg-red-500`} />
+                      ) : (
+                        <div className={`w-2 h-2 md:w-3 md:h-3 rounded-full ${connections > 0 ? "bg-green-500" : "bg-yellow-500"}`} />
+                      )}
+                    </div>
                   </>
                 )}
               </div>
               
               <div className="flex items-center gap-2">
-                {isWakuLoading ? (
-                  <Loader2 className="h-4 w-4 animate-spin" />
-                ) : wakuError ? (
-                  <span className="text-xs text-red-500">Error</span>
-                ) : (
-                  <div className={`w-2 h-2 rounded-full ${connections > 0 ? "bg-green-500" : "bg-yellow-500"}`} />
-                )}
-                
                 {isConnected ? (
                   <div className="flex items-center gap-2">
                     <span className="text-xs md:text-sm text-muted-foreground truncate max-w-[80px] md:max-w-[120px]">
diff --git a/examples/buddybook/src/hooks/useWalletPrompt.ts b/examples/buddybook/src/hooks/useWalletPrompt.ts
index 6d26d80..89d4d14 100644
--- a/examples/buddybook/src/hooks/useWalletPrompt.ts
+++ b/examples/buddybook/src/hooks/useWalletPrompt.ts
@@ -7,16 +7,33 @@ export function useWalletPrompt() {
   const ensureWalletConnected = async () => {
     if (!isConnected) {
       try {
-        // Find the first available connector (usually injected/metamask)
         const connector = connectors[0]
         if (connector) {
+          // Check if we're on iOS
+          const isIOS = /iPad|iPhone|iPod/.test(navigator.userAgent)
+          
+          // If on iOS, try to open MetaMask first
+          if (isIOS) {
+            // Attempt to open MetaMask
+            window.location.href = 'metamask:///'
+            
+            // Give a small delay before attempting connection
+            await new Promise(resolve => setTimeout(resolve, 1000))
+          }
+          
           await connect({ connector })
+          
+          // Wait a brief moment for the connection to be established
+          await new Promise(resolve => setTimeout(resolve, 1000))
+          return true
         }
-        // Wait a brief moment for the connection to be established
-        await new Promise(resolve => setTimeout(resolve, 1000));
-        return true
       } catch (error) {
         console.error('Error connecting wallet:', error)
+        // If connection fails, try to open MetaMask directly
+        if (typeof window.ethereum === 'undefined') {
+          // Redirect to MetaMask download page if not installed
+          window.open('https://metamask.io/download/', '_blank')
+        }
         return false
       }
     }

From c047f204e9bfd409417ca2a1d48351f5e0e1fb6a Mon Sep 17 00:00:00 2001
From: Danish Arora <danisharora099@gmail.com>
Date: Mon, 11 Nov 2024 18:01:27 +0700
Subject: [PATCH 3/5] chore: prepare

---
 examples/buddybook/index.html                 |   8 -
 examples/buddybook/public/404.html            |  21 ---
 examples/buddybook/src/App.tsx                |   4 +-
 .../src/components/Chain/SignChain.tsx        | 165 +++++++++---------
 .../src/components/Chain/View/ChainList.tsx   |  25 +--
 examples/buddybook/src/components/QRCode.tsx  | 106 ++++++++---
 .../buddybook/src/components/ui/dialog.tsx    |  10 +-
 examples/buddybook/src/lib/waku-config.ts     |   6 -
 examples/buddybook/src/lib/waku.ts            |   6 +-
 examples/buddybook/src/main.tsx               |   2 +-
 10 files changed, 188 insertions(+), 165 deletions(-)
 delete mode 100644 examples/buddybook/public/404.html
 delete mode 100644 examples/buddybook/src/lib/waku-config.ts

diff --git a/examples/buddybook/index.html b/examples/buddybook/index.html
index bd3d433..8a24820 100644
--- a/examples/buddybook/index.html
+++ b/examples/buddybook/index.html
@@ -23,14 +23,6 @@
         browser: true
       };
     </script>
-    <script type="text/javascript">
-      (function() {
-        const path = window.location.pathname;
-        if (path && !window.location.search.includes('?/')) {
-          window.location.replace('/?/' + path + window.location.search + window.location.hash);
-        }
-      })();
-    </script>
   </head>
   <body>
     <div id="root"></div>
diff --git a/examples/buddybook/public/404.html b/examples/buddybook/public/404.html
deleted file mode 100644
index df98f7b..0000000
--- a/examples/buddybook/public/404.html
+++ /dev/null
@@ -1,21 +0,0 @@
-<!DOCTYPE html>
-<html>
-  <head>
-    <meta charset="utf-8">
-    <title>BuddyBook</title>
-    <script type="text/javascript">
-      var pathSegmentsToKeep = 0;
-
-      var l = window.location;
-      l.replace(
-        l.protocol + '//' + l.hostname + (l.port ? ':' + l.port : '') +
-        '/?/' +
-        l.pathname.slice(1).split('/').slice(pathSegmentsToKeep).join('/').replace(/&/g, '~and~') +
-        (l.search ? '&' + l.search.slice(1).replace(/&/g, '~and~') : '') +
-        l.hash
-      );
-    </script>
-  </head>
-  <body>
-  </body>
-</html> 
\ No newline at end of file
diff --git a/examples/buddybook/src/App.tsx b/examples/buddybook/src/App.tsx
index 3a46233..6392a5a 100644
--- a/examples/buddybook/src/App.tsx
+++ b/examples/buddybook/src/App.tsx
@@ -41,8 +41,9 @@ function App() {
   }, []);
 
   useEffect(() => {
-    if (isWakuLoading || !node || node.libp2p.getConnections().length === 0 || chainsData.length > 0 || isListening)  return;
+    if (isWakuLoading || !node || node.libp2p.getConnections().length <= 1 || chainsData.length > 0 || isListening)  return;
       setIsListening(true);
+      console.log("connections", node.libp2p.getConnections().length)
       startMessageListening();
   }, [node, isWakuLoading, wakuStatus])
 
@@ -67,6 +68,7 @@ function App() {
 
   const startMessageListening = async () => {
     console.log("Starting message listening")
+    console.log("connections", node.libp2p.getConnections().length)
     try {
       setWakuStatus(prev => ({ ...prev, store: 'in-progress' }));
       setIsLoadingChains(true);
diff --git a/examples/buddybook/src/components/Chain/SignChain.tsx b/examples/buddybook/src/components/Chain/SignChain.tsx
index 9547ea6..359e8fb 100644
--- a/examples/buddybook/src/components/Chain/SignChain.tsx
+++ b/examples/buddybook/src/components/Chain/SignChain.tsx
@@ -9,9 +9,10 @@ import { Loader2 } from "lucide-react";
 import QRCode from '@/components/QRCode';
 import { useWalletPrompt } from '@/hooks/useWalletPrompt';
 import { v4 as uuidv4 } from 'uuid';
+
 interface SignChainProps {
   block: BlockPayload;
-  chainsData: BlockPayload[]; // Add this prop
+  chainsData: BlockPayload[];
   onSuccess: (newBlock: BlockPayload) => void;
 }
 
@@ -20,43 +21,49 @@ const SignChain: React.FC<SignChainProps> = ({ block, chainsData, onSuccess }) =
   const [isSigning, setIsSigning] = useState(false);
   const [error, setError] = useState<string | null>(null);
   const [alreadySigned, setAlreadySigned] = useState(false);
+  const [isWalletPrompt, setIsWalletPrompt] = useState(false);
+
   const { address } = useAccount();
   const { data: ensName } = useEnsName({ address });
   const { node } = useWaku<LightNode>();
   const { ensureWalletConnected } = useWalletPrompt();
-  const [isWalletPrompt, setIsWalletPrompt] = useState(false);
+
+  const checkSignatures = (blockToCheck: BlockPayload, visitedBlocks: Set<string>): boolean => {
+    if (visitedBlocks.has(blockToCheck.blockUUID)) return false;
+    visitedBlocks.add(blockToCheck.blockUUID);
+
+    // Check current block signatures
+    if (blockToCheck.signatures?.some(sig => sig?.address?.toLowerCase() === address?.toLowerCase())) {
+      return true;
+    }
+
+    // Check parent block
+    const parentBlock = chainsData.find(b => b.blockUUID === blockToCheck.parentBlockUUID);
+    if (parentBlock && checkSignatures(parentBlock, visitedBlocks)) {
+      return true;
+    }
+
+    // Check immediate child blocks
+    return chainsData
+      .filter(b => b.parentBlockUUID === blockToCheck.blockUUID)
+      .some(childBlock => checkSignatures(childBlock, visitedBlocks));
+  };
 
   useEffect(() => {
-    if (address) {
-      // Check if the address has signed this block or any blocks in the chain
-      const checkSignatures = (blockToCheck: BlockPayload): boolean => {
-        // Check current block's signatures
-        if (blockToCheck.signatures.some(
-          sig => sig.address.toLowerCase() === address.toLowerCase()
-        )) {
-          return true;
-        }
+    if (!address) return;
 
-        // Check parent blocks
-        const parentBlock = chainsData.find(b => b.blockUUID === blockToCheck.parentBlockUUID);
-        if (parentBlock && checkSignatures(parentBlock)) {
-          return true;
-        }
-
-        // Check child blocks
-        const childBlocks = chainsData.filter(b => b.parentBlockUUID === blockToCheck.blockUUID);
-        return childBlocks.some(childBlock => checkSignatures(childBlock));
-      };
-
-      const hasAlreadySigned = checkSignatures(block);
-      setAlreadySigned(hasAlreadySigned);
+    try {
+      const visitedBlocks = new Set<string>();
+      setAlreadySigned(checkSignatures(block, visitedBlocks));
+    } catch (error) {
+      console.error('Error in signature check:', error);
+      setAlreadySigned(false);
     }
   }, [address, block, chainsData]);
 
   const { signMessage } = useSignMessage({
     mutation: {
       onMutate() {
-        // Reset any previous errors when starting a new signing attempt
         setError(null);
         setIsSigning(true);
       },
@@ -64,7 +71,6 @@ const SignChain: React.FC<SignChainProps> = ({ block, chainsData, onSuccess }) =
         if (!address || !node) return;
         
         try {
-          // Double check signature before proceeding
           if (block.signatures.some(sig => sig.address.toLowerCase() === address.toLowerCase())) {
             setError('You have already signed this chain.');
             return;
@@ -108,17 +114,14 @@ const SignChain: React.FC<SignChainProps> = ({ block, chainsData, onSuccess }) =
   const handleSign = async () => {
     try {
       if (!address) {
-        // If not connected, try to connect first
         setIsWalletPrompt(true);
         const connected = await ensureWalletConnected();
-        setIsWalletPrompt(false);
         if (!connected) {
           setError('Please ensure your wallet is connected and the app is open.');
           return;
         }
       }
       
-      // Check if already signed
       if (alreadySigned) {
         setError('You have already signed this chain.');
         return;
@@ -131,17 +134,17 @@ const SignChain: React.FC<SignChainProps> = ({ block, chainsData, onSuccess }) =
         return;
       }
 
-      // Prepare the message
-      const message = `Sign Block:
-Chain UUID: ${block.chainUUID}
-Block UUID: ${block.blockUUID}
-Title: ${block.title}
-Description: ${block.description}
-Timestamp: ${new Date().getTime()}
-Parent Block UUID: ${block.parentBlockUUID}
-Signed by: ${ensName || address}`;
+      const message = [
+        'Sign Block:',
+        `Chain UUID: ${block.chainUUID}`,
+        `Block UUID: ${block.blockUUID}`,
+        `Title: ${block.title}`,
+        `Description: ${block.description}`,
+        `Timestamp: ${new Date().getTime()}`,
+        `Parent Block UUID: ${block.parentBlockUUID}`,
+        `Signed by: ${ensName || address}`
+      ].join('\n');
 
-      // Trigger signing
       signMessage({ message });
     } catch (error) {
       console.error('Error in sign flow:', error);
@@ -152,14 +155,24 @@ Signed by: ${ensName || address}`;
     }
   };
 
+  const getButtonText = () => {
+    if (isSigning) return 'Signing...';
+    if (isWalletPrompt) return 'Connecting...';
+    if (alreadySigned) return 'Already Signed';
+    if (!address) return 'Connect Wallet';
+    return 'Sign';
+  };
+
+  const showLoadingSpinner = isSigning || isWalletPrompt;
+
   return (
     <>
       <Button onClick={() => setIsOpen(true)} disabled={alreadySigned}>
         {alreadySigned ? 'Already Signed' : !address ? 'Connect Wallet' : 'Sign Chain'}
       </Button>
       <Dialog open={isOpen} onOpenChange={setIsOpen}>
-        <DialogContent className="sm:max-w-md">
-          <DialogHeader>
+        <DialogContent className="sm:max-w-md flex flex-col max-h-[90vh] md:max-h-[85vh]">
+          <DialogHeader className="flex-shrink-0">
             <DialogTitle>Sign Chain</DialogTitle>
             <DialogDescription>
               {alreadySigned 
@@ -167,57 +180,39 @@ Signed by: ${ensName || address}`;
                 : 'Review the block details and sign to add your signature to the chain.'}
             </DialogDescription>
           </DialogHeader>
-          <div className="flex flex-col space-y-4">
-            <div className="space-y-2">
-              <h4 className="font-medium">Block Details</h4>
-              <p className="text-sm text-muted-foreground">{block.title}</p>
-              <p className="text-sm text-muted-foreground">{block.description}</p>
+          <div className="flex-1 min-h-0 overflow-y-auto py-4">
+            <div className="space-y-4">
+              <div className="space-y-2">
+                <h4 className="font-medium">Block Details</h4>
+                <p className="text-sm text-muted-foreground">{block.title}</p>
+                <p className="text-sm text-muted-foreground">{block.description}</p>
+              </div>
+              <div className="flex justify-center">
+                <QRCode text={`${window.location.origin}/sign/${block.chainUUID}/${block.blockUUID}`} />
+              </div>
             </div>
-            <QRCode text={`${window.location.origin}/sign/${block.chainUUID}/${block.blockUUID}`} />
+            {(error || isWalletPrompt) && (
+              <div className="space-y-2 mt-4">
+                {error && <p className="text-sm text-destructive">{error}</p>}
+                {isWalletPrompt && (
+                  <div className="rounded-md bg-blue-50 p-4">
+                    <p className="text-sm text-blue-700">Attempting to connect to your wallet...</p>
+                    <p className="text-xs text-blue-600 mt-1">
+                      If your wallet doesn't open automatically, please open it manually to approve the connection.
+                    </p>
+                  </div>
+                )}
+              </div>
+            )}
           </div>
-          {(error || isWalletPrompt) && (
-            <div className="space-y-2">
-              {error && <p className="text-sm text-destructive">{error}</p>}
-              {isWalletPrompt && (
-                <div className="rounded-md bg-blue-50 p-4">
-                  <p className="text-sm text-blue-700">
-                    Attempting to connect to your wallet...
-                  </p>
-                  <p className="text-xs text-blue-600 mt-1">
-                    If your wallet doesn't open automatically, please open it manually to approve the connection.
-                  </p>
-                </div>
-              )}
-              {/iPhone|iPad|iPod|Android/i.test(navigator.userAgent) && (
-                <p className="text-xs text-muted-foreground">
-                  Tip: If your wallet doesn't open automatically, minimize this app and open your wallet manually before trying again.
-                </p>
-              )}
-            </div>
-          )}
-          <DialogFooter>
+          <DialogFooter className="flex-shrink-0 mt-4">
             <Button variant="secondary" onClick={() => setIsOpen(false)}>Cancel</Button>
             <Button 
               onClick={handleSign} 
               disabled={isSigning || alreadySigned || isWalletPrompt}
             >
-              {isSigning ? (
-                <>
-                  <Loader2 className="mr-2 h-4 w-4 animate-spin" />
-                  Signing...
-                </>
-              ) : isWalletPrompt ? (
-                <>
-                  <Loader2 className="mr-2 h-4 w-4 animate-spin" />
-                  Connecting...
-                </>
-              ) : alreadySigned ? (
-                'Already Signed'
-              ) : !address ? (
-                'Connect Wallet'
-              ) : (
-                'Sign'
-              )}
+              {showLoadingSpinner && <Loader2 className="mr-2 h-4 w-4 animate-spin" />}
+              {getButtonText()}
             </Button>
           </DialogFooter>
         </DialogContent>
diff --git a/examples/buddybook/src/components/Chain/View/ChainList.tsx b/examples/buddybook/src/components/Chain/View/ChainList.tsx
index 2a0369b..2b9d6aa 100644
--- a/examples/buddybook/src/components/Chain/View/ChainList.tsx
+++ b/examples/buddybook/src/components/Chain/View/ChainList.tsx
@@ -4,7 +4,7 @@ import { type BlockPayload } from '@/lib/waku';
 import SignChain from '@/components/Chain/SignChain';
 import { useEnsName } from 'wagmi';
 import { Button } from '@/components/ui/button';
-import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogTrigger, DialogDescription } from "@/components/ui/dialog";
+import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogTrigger, DialogDescription, DialogFooter } from "@/components/ui/dialog";
 import QRCode from '@/components/QRCode';
 import { Loader2 } from "lucide-react";
 
@@ -64,22 +64,23 @@ const ChainList: React.FC<ChainListProps> = ({ chainsData, onChainUpdate, isLoad
                     <DialogTrigger asChild>
                       <Button variant="outline">Share</Button>
                     </DialogTrigger>
-                    <DialogContent className="sm:max-w-md">
+                    <DialogContent className="flex flex-col gap-4">
                       <DialogHeader>
-                        <DialogTitle>Share this Chain</DialogTitle>
+                        <DialogTitle>Share Chain</DialogTitle>
                         <DialogDescription>
                           Share this chain with others to collect their signatures.
                         </DialogDescription>
                       </DialogHeader>
-                      <div className="flex flex-col items-center space-y-4">
-                        <QRCode text={shareUrl} width={200} height={200} />
-                        <p className="text-sm text-center break-all">{shareUrl}</p>
-                        <Button
-                          onClick={() => navigator.clipboard.writeText(shareUrl)}
-                          variant="outline"
-                        >
-                          Copy Link
-                        </Button>
+
+                      <div className="flex flex-col items-center gap-4">
+                        <QRCode 
+                          text={shareUrl} 
+                          width={180} 
+                          height={180}
+                          showCopyButton="text"
+                          title={block.title}
+                          description={`Sign this chain: ${block.title}`}
+                        />
                       </div>
                     </DialogContent>
                   </Dialog>
diff --git a/examples/buddybook/src/components/QRCode.tsx b/examples/buddybook/src/components/QRCode.tsx
index 889f6d5..98c3974 100644
--- a/examples/buddybook/src/components/QRCode.tsx
+++ b/examples/buddybook/src/components/QRCode.tsx
@@ -1,4 +1,4 @@
-import React, { useState } from 'react';
+import React, { useState, useEffect } from 'react';
 import { QRCodeSVG } from 'qrcode.react';
 import { Button } from "@/components/ui/button";
 import { Check, Copy } from "lucide-react";
@@ -7,11 +7,37 @@ interface QRCodeProps {
   text: string;
   width?: number;
   height?: number;
+  showCopyButton?: 'icon' | 'text' | 'both';
+  title?: string;
+  description?: string;
 }
 
-const QRCode: React.FC<QRCodeProps> = ({ text, width = 256, height = 256 }) => {
+const QRCode: React.FC<QRCodeProps> = ({ 
+  text, 
+  width = 256, 
+  height = 256,
+  showCopyButton = 'both',
+  title,
+  description
+}) => {
   const [copied, setCopied] = useState(false);
-  const isMobile = window.innerWidth < 640;
+  const [isMobile, setIsMobile] = useState(false);
+  const [qrSize, setQrSize] = useState(Math.min(width, height));
+
+  useEffect(() => {
+    const checkMobile = () => {
+      setIsMobile(window.innerWidth < 640);
+      setQrSize(
+        window.innerWidth < 640 
+          ? Math.min(window.innerWidth - 80, 200) 
+          : Math.min(width, height)
+      );
+    };
+
+    checkMobile();
+    window.addEventListener('resize', checkMobile);
+    return () => window.removeEventListener('resize', checkMobile);
+  }, [width, height]);
 
   const handleCopy = async () => {
     await navigator.clipboard.writeText(text);
@@ -19,28 +45,66 @@ const QRCode: React.FC<QRCodeProps> = ({ text, width = 256, height = 256 }) => {
     setTimeout(() => setCopied(false), 2000);
   };
 
+  const handleShare = async () => {
+    if (navigator.share) {
+      try {
+        await navigator.share({
+          title: title || 'Share Chain',
+          text: description || 'Sign this chain',
+          url: text
+        });
+      } catch (error) {
+        if (error instanceof Error && error.name !== 'AbortError') {
+          console.error('Error sharing:', error);
+        }
+      }
+    } else {
+      handleCopy();
+    }
+  };
+
   return (
-    <div className="flex flex-col items-center space-y-4">
-      <QRCodeSVG 
-        value={text} 
-        size={isMobile ? Math.min(width * 0.8, window.innerWidth - 64) : Math.min(width, height)} 
-      />
-      <div className="flex items-center space-x-2 w-full max-w-[300px]">
-        <input 
-          type="text" 
+    <div className="flex flex-col items-center w-full space-y-4">
+      <div className="flex justify-center w-full">
+        <QRCodeSVG 
           value={text} 
-          readOnly 
-          className="flex-1 px-3 py-2 text-xs sm:text-sm border rounded-md bg-muted truncate"
+          size={qrSize}
+          className="max-w-full"
         />
-        <Button 
-          variant="outline" 
-          size="icon"
-          onClick={handleCopy}
-          className="shrink-0"
-        >
-          {copied ? <Check className="h-4 w-4" /> : <Copy className="h-4 w-4" />}
-        </Button>
       </div>
+      
+      {showCopyButton !== 'text' && (
+        <div className="flex items-center space-x-2 w-full">
+          <input 
+            type="text" 
+            value={text} 
+            readOnly 
+            className="flex-1 px-3 py-2 text-xs sm:text-sm border rounded-md bg-muted truncate"
+          />
+          <Button 
+            variant="outline" 
+            size="icon"
+            onClick={handleCopy}
+            className="shrink-0"
+          >
+            {copied ? <Check className="h-4 w-4" /> : <Copy className="h-4 w-4" />}
+          </Button>
+        </div>
+      )}
+      
+      {showCopyButton === 'text' && (
+        <Button
+          onClick={isMobile && 'share' in navigator ? handleShare : handleCopy}
+          variant="secondary"
+          className="w-full sm:w-auto"
+        >
+          {isMobile && 'share' in navigator
+            ? 'Share' 
+            : copied 
+              ? 'Copied!' 
+              : 'Copy Link'}
+        </Button>
+      )}
     </div>
   );
 };
diff --git a/examples/buddybook/src/components/ui/dialog.tsx b/examples/buddybook/src/components/ui/dialog.tsx
index 0e36c68..0946c1b 100644
--- a/examples/buddybook/src/components/ui/dialog.tsx
+++ b/examples/buddybook/src/components/ui/dialog.tsx
@@ -35,14 +35,12 @@ const DialogContent = React.forwardRef<
     <DialogPrimitive.Content
       ref={ref}
       className={cn(
-        "fixed left-[50%] top-[50%] z-50 grid w-full translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background shadow-lg duration-200",
+        "fixed z-50 border bg-background shadow-lg duration-200",
         "p-4 md:p-6",
-        "rounded-t-lg md:rounded-lg",
-        "max-h-[95vh] md:max-h-[85vh]",
-        "w-full md:max-w-lg",
-        "bottom-0 md:bottom-auto",
-        "overflow-y-auto",
+        "w-full md:w-[calc(100%-2rem)] md:max-w-lg",
         "focus:outline-none focus-visible:ring-2 focus-visible:ring-accent",
+        "bottom-0 rounded-t-lg md:rounded-lg",
+        "md:left-[50%] md:top-[50%] md:translate-x-[-50%] md:translate-y-[-50%]",
         className
       )}
       {...props}
diff --git a/examples/buddybook/src/lib/waku-config.ts b/examples/buddybook/src/lib/waku-config.ts
deleted file mode 100644
index a358c14..0000000
--- a/examples/buddybook/src/lib/waku-config.ts
+++ /dev/null
@@ -1,6 +0,0 @@
-import { Protocols } from '@waku/sdk';
-
-export const WAKU_NODE_OPTIONS = {
-  defaultBootstrap: true,
-  protocols: [Protocols.Store, Protocols.Filter, Protocols.LightPush]
-}; 
\ No newline at end of file
diff --git a/examples/buddybook/src/lib/waku.ts b/examples/buddybook/src/lib/waku.ts
index 0f3ffcf..66a8f6e 100644
--- a/examples/buddybook/src/lib/waku.ts
+++ b/examples/buddybook/src/lib/waku.ts
@@ -1,9 +1,7 @@
 import { createEncoder, createDecoder, type LightNode, type CreateWakuNodeOptions } from "@waku/sdk";
 import protobuf from 'protobufjs';
 
-export const WAKU_NODE_OPTIONS: CreateWakuNodeOptions = { defaultBootstrap: true, nodeToUse: {
-    store: "/dns4/store-02.ac-cn-hongkong-c.status.staging.status.im/tcp/443/wss/p2p/16Uiu2HAmU7xtcwytXpGpeDrfyhJkiFvTkQbLB9upL5MXPLGceG9K"
-} };
+export const WAKU_NODE_OPTIONS: CreateWakuNodeOptions = { defaultBootstrap: true };
 
 
 export type Signature = {
@@ -22,7 +20,7 @@ export type BlockPayload = {
     parentBlockUUID: string | null;
 }
 
-const contentTopic = "/buddybook-dogfood/1/chain/proto";
+const contentTopic = "/buddybook-devcon/1/chain/proto";
 
 export const encoder = createEncoder({
     contentTopic: contentTopic,
diff --git a/examples/buddybook/src/main.tsx b/examples/buddybook/src/main.tsx
index 291b87f..6373683 100644
--- a/examples/buddybook/src/main.tsx
+++ b/examples/buddybook/src/main.tsx
@@ -9,7 +9,7 @@ import App from './App.tsx'
 import './index.css'
 import { LightNodeProvider } from "@waku/react";
 import { config } from './lib/walletConnect.ts'
-import { WAKU_NODE_OPTIONS } from './lib/waku-config.ts'
+import { WAKU_NODE_OPTIONS } from './lib/waku.ts'
 
 // Polyfills
 if (typeof global === 'undefined') {

From 8ce736a6654adf0ddfa2e9dc336e5c6baf8b1118 Mon Sep 17 00:00:00 2001
From: Danish Arora <danisharora099@gmail.com>
Date: Wed, 13 Nov 2024 12:20:46 +0700
Subject: [PATCH 4/5] chore(buddybook): improvements

---
 examples/buddybook/src/App.tsx                | 66 +++++++++++++++----
 .../src/components/Chain/SignChain.tsx        | 48 +++++++-------
 examples/buddybook/src/lib/waku.ts            | 39 ++++++-----
 3 files changed, 96 insertions(+), 57 deletions(-)

diff --git a/examples/buddybook/src/App.tsx b/examples/buddybook/src/App.tsx
index 6392a5a..34d283a 100644
--- a/examples/buddybook/src/App.tsx
+++ b/examples/buddybook/src/App.tsx
@@ -16,6 +16,8 @@ import ConnectionStatus from '@/components/ConnectionStatus';
 
 type Status = 'success' | 'in-progress' | 'error';
 
+
+
 interface WakuStatus {
   filter: Status;
   store: Status;
@@ -30,6 +32,9 @@ function App() {
     filter: 'in-progress',
     store: 'in-progress',
   });
+
+  (global.window as any).waku = node;
+
   const [telemetryOptIn, setTelemetryOptIn] = useState<boolean | null>(null);
   const [isLoadingChains, setIsLoadingChains] = useState(true);
 
@@ -41,10 +46,22 @@ function App() {
   }, []);
 
   useEffect(() => {
-    if (isWakuLoading || !node || node.libp2p.getConnections().length <= 1 || chainsData.length > 0 || isListening)  return;
+    if (isWakuLoading || !node || node.libp2p.getConnections().length === 0 || chainsData.length > 0 || isListening)  {
+      console.log("not starting message listening");
+      console.log({
+        isWakuLoading,
+        node,
+        connections: node?.libp2p.getConnections().length,
+        chainsData,
+        isListening
+      })
+      return;
+    }
       setIsListening(true);
       console.log("connections", node.libp2p.getConnections().length)
-      startMessageListening();
+        setTimeout(() => {
+          startMessageListening();
+        }, 2000);
   }, [node, isWakuLoading, wakuStatus])
 
   const handleTelemetryOptIn = (optIn: boolean) => {
@@ -69,25 +86,36 @@ function App() {
   const startMessageListening = async () => {
     console.log("Starting message listening")
     console.log("connections", node.libp2p.getConnections().length)
+
+    // Add timeout for store query
+    const STORE_TIMEOUT = 30000; // 30 seconds
+    const storeTimeout = new Promise((_, reject) => {
+      setTimeout(() => reject(new Error('Store query timeout')), STORE_TIMEOUT);
+    });
+
     try {
       setWakuStatus(prev => ({ ...prev, store: 'in-progress' }));
       setIsLoadingChains(true);
       const messageGenerator = getMessagesFromStore(node as LightNode);
       
       try {
-        for await (const message of messageGenerator) {
-          setChainsData(prevChains => {
-            const blockExists = prevChains.some(block => block.blockUUID === message.blockUUID);
-            if (blockExists) return prevChains;
-            return [...prevChains, message];
-          });
-        }
+        // Race between store query and timeout
+        await Promise.race([
+          (async () => {
+            for await (const message of messageGenerator) {
+              setChainsData(prevChains => {
+                const blockExists = prevChains.some(block => block.blockUUID === message.blockUUID);
+                if (blockExists) return prevChains;
+                return [...prevChains, message];
+              });
+            }
+          })(),
+          storeTimeout
+        ]);
         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
       }
     } catch (error) {
       console.error("Error fetching messages from store:", error);
@@ -96,11 +124,21 @@ function App() {
       setIsLoadingChains(false);
     }
 
+    // Add timeout for filter subscription
+    const FILTER_TIMEOUT = 15000; // 15 seconds
     try {
       setWakuStatus(prev => ({ ...prev, filter: 'in-progress' }));
-      await subscribeToFilter(node as LightNode, (message) => {
-        handleChainUpdate(message); // Use the same function for both updates
-      })
+      const filterPromise = subscribeToFilter(node as LightNode, (message) => {
+        handleChainUpdate(message);
+      });
+
+      await Promise.race([
+        filterPromise,
+        new Promise((_, reject) => 
+          setTimeout(() => reject(new Error('Filter subscription timeout')), FILTER_TIMEOUT)
+        )
+      ]);
+      
       setWakuStatus(prev => ({ ...prev, filter: 'success' }));
     } catch (error) {
       console.error("Error subscribing to filter:", error);
diff --git a/examples/buddybook/src/components/Chain/SignChain.tsx b/examples/buddybook/src/components/Chain/SignChain.tsx
index 359e8fb..315485b 100644
--- a/examples/buddybook/src/components/Chain/SignChain.tsx
+++ b/examples/buddybook/src/components/Chain/SignChain.tsx
@@ -171,8 +171,8 @@ const SignChain: React.FC<SignChainProps> = ({ block, chainsData, onSuccess }) =
         {alreadySigned ? 'Already Signed' : !address ? 'Connect Wallet' : 'Sign Chain'}
       </Button>
       <Dialog open={isOpen} onOpenChange={setIsOpen}>
-        <DialogContent className="sm:max-w-md flex flex-col max-h-[90vh] md:max-h-[85vh]">
-          <DialogHeader className="flex-shrink-0">
+        <DialogContent className="sm:max-w-md">
+          <DialogHeader>
             <DialogTitle>Sign Chain</DialogTitle>
             <DialogDescription>
               {alreadySigned 
@@ -180,32 +180,28 @@ const SignChain: React.FC<SignChainProps> = ({ block, chainsData, onSuccess }) =
                 : 'Review the block details and sign to add your signature to the chain.'}
             </DialogDescription>
           </DialogHeader>
-          <div className="flex-1 min-h-0 overflow-y-auto py-4">
-            <div className="space-y-4">
-              <div className="space-y-2">
-                <h4 className="font-medium">Block Details</h4>
-                <p className="text-sm text-muted-foreground">{block.title}</p>
-                <p className="text-sm text-muted-foreground">{block.description}</p>
-              </div>
-              <div className="flex justify-center">
-                <QRCode text={`${window.location.origin}/sign/${block.chainUUID}/${block.blockUUID}`} />
-              </div>
+          <div className="flex flex-col space-y-4">
+            <div className="space-y-2">
+              <h4 className="font-medium">Block Details</h4>
+              <p className="text-sm text-muted-foreground">{block.title}</p>
+              <p className="text-sm text-muted-foreground">{block.description}</p>
             </div>
-            {(error || isWalletPrompt) && (
-              <div className="space-y-2 mt-4">
-                {error && <p className="text-sm text-destructive">{error}</p>}
-                {isWalletPrompt && (
-                  <div className="rounded-md bg-blue-50 p-4">
-                    <p className="text-sm text-blue-700">Attempting to connect to your wallet...</p>
-                    <p className="text-xs text-blue-600 mt-1">
-                      If your wallet doesn't open automatically, please open it manually to approve the connection.
-                    </p>
-                  </div>
-                )}
-              </div>
-            )}
+            <QRCode text={`${window.location.origin}/sign/${block.chainUUID}/${block.blockUUID}`} />
           </div>
-          <DialogFooter className="flex-shrink-0 mt-4">
+          {(error || isWalletPrompt) && (
+            <div className="space-y-2">
+              {error && <p className="text-sm text-destructive">{error}</p>}
+              {isWalletPrompt && (
+                <div className="rounded-md bg-blue-50 p-4">
+                  <p className="text-sm text-blue-700">Attempting to connect to your wallet...</p>
+                  <p className="text-xs text-blue-600 mt-1">
+                    If your wallet doesn't open automatically, please open it manually to approve the connection.
+                  </p>
+                </div>
+              )}
+            </div>
+          )}
+          <DialogFooter>
             <Button variant="secondary" onClick={() => setIsOpen(false)}>Cancel</Button>
             <Button 
               onClick={handleSign} 
diff --git a/examples/buddybook/src/lib/waku.ts b/examples/buddybook/src/lib/waku.ts
index 66a8f6e..d66f458 100644
--- a/examples/buddybook/src/lib/waku.ts
+++ b/examples/buddybook/src/lib/waku.ts
@@ -65,28 +65,33 @@ export function createMessage({
 
 export async function* getMessagesFromStore(node: LightNode) {
     console.time("getMessagesFromStore")
-    for await (const messagePromises of node.store.queryGenerator([decoder])) {
-        const messages = await Promise.all(messagePromises);
-        for (const message of messages) {
-            console.log(message)
-            if (!message?.payload) continue;
-            const blockPayload = block.decode(message.payload) as unknown as BlockPayload;
-            blockPayload.signatures = blockPayload.signatures.map(s => JSON.parse(s as unknown as string) as Signature);
-            yield blockPayload;
+    try {
+        for await (const messagePromises of node.store.queryGenerator([decoder])) {
+            const messages = await Promise.all(messagePromises);
+            for (const message of messages) {
+                if (!message?.payload) continue;
+                const blockPayload = block.decode(message.payload) as unknown as BlockPayload;
+                blockPayload.signatures = blockPayload.signatures.map(s => JSON.parse(s as unknown as string) as Signature);
+                yield blockPayload;
+            }
         }
+    } finally {
+        console.timeEnd("getMessagesFromStore")
     }
-    console.timeEnd("getMessagesFromStore")
 }
 
 export async function subscribeToFilter(node: LightNode, callback: (message: BlockPayload) => void) {
-    const {error, subscription, results} = await node.filter.subscribe([decoder], (message) => {
-        console.log('message received from filter', message)
-        if (message.payload) {
-            const blockPayload = block.decode(message.payload) as unknown as BlockPayload;
-            blockPayload.signatures = blockPayload.signatures.map(s => JSON.parse(s as unknown as string) as Signature);
-            callback(blockPayload);
+    const {error, subscription, results} = await node.filter.subscribe(
+        [decoder], 
+        (message) => {
+            console.log('message received from filter', message)
+            if (message.payload) {
+                const blockPayload = block.decode(message.payload) as unknown as BlockPayload;
+                blockPayload.signatures = blockPayload.signatures.map(s => JSON.parse(s as unknown as string) as Signature);
+                callback(blockPayload);
+            }
         }
-    }, {forceUseAllPeers: false});
+    );
 
     console.log("results", results)
     
@@ -94,7 +99,7 @@ export async function subscribeToFilter(node: LightNode, callback: (message: Blo
         console.log("Error subscribing to filter", error)
     }
 
-    if (!subscription || error || results.successes.length === 0 ||results.failures.length >0) {
+    if (!subscription || error || results.successes.length === 0 || results.failures.length > 0) {
         throw new Error("Failed to subscribe to filter")
     }
 }

From 87d1499aa15e908e07d29bf2c12f55f62397c5b2 Mon Sep 17 00:00:00 2001
From: Danish Arora <danisharora099@gmail.com>
Date: Wed, 13 Nov 2024 12:23:58 +0700
Subject: [PATCH 5/5] chore(buddybook): use specific node

---
 examples/buddybook/package-lock.json | 96 ++++++++++++++--------------
 examples/buddybook/package.json      |  2 +-
 examples/buddybook/src/lib/waku.ts   |  2 +-
 3 files changed, 50 insertions(+), 50 deletions(-)

diff --git a/examples/buddybook/package-lock.json b/examples/buddybook/package-lock.json
index c291ab9..9e977aa 100644
--- a/examples/buddybook/package-lock.json
+++ b/examples/buddybook/package-lock.json
@@ -17,7 +17,7 @@
         "@t3-oss/env-nextjs": "^0.9.2",
         "@tailwindcss/typography": "^0.5.15",
         "@tanstack/react-query": "^5.59.15",
-        "@waku/react": "0.0.7-9a7287d",
+        "@waku/react": "0.0.7-b9d400c",
         "buffer": "^6.0.3",
         "class-variance-authority": "^0.7.0",
         "clsx": "^2.1.1",
@@ -6895,17 +6895,17 @@
       }
     },
     "node_modules/@waku/core": {
-      "version": "0.0.34-9f1d8ca.0",
-      "resolved": "https://registry.npmjs.org/@waku/core/-/core-0.0.34-9f1d8ca.0.tgz",
-      "integrity": "sha512-vEJXQCzlbWDsKyAuU+b/oHFGSTLGHEJXdOoj4g0Z4I8vKRmxpej/i+lm7gFBg8LOp72xOg14fWo0TaxknhFgTw==",
+      "version": "0.0.34-5674b0e.0",
+      "resolved": "https://registry.npmjs.org/@waku/core/-/core-0.0.34-5674b0e.0.tgz",
+      "integrity": "sha512-eUPNTi712Qde6StMz33lfChLJ/Po8tYRY6JK0mOvdW+xpO6BcAlioA4YnQciYn5ACTcajZkL+eqKtY56RHirug==",
       "license": "MIT OR Apache-2.0",
       "peer": true,
       "dependencies": {
         "@libp2p/ping": "2.0.1",
-        "@waku/enr": "0.0.28-9f1d8ca.0",
-        "@waku/interfaces": "0.0.29-9f1d8ca.0",
-        "@waku/proto": "0.0.9-9f1d8ca.0",
-        "@waku/utils": "0.0.22-9f1d8ca.0",
+        "@waku/enr": "0.0.28-5674b0e.0",
+        "@waku/interfaces": "0.0.29-5674b0e.0",
+        "@waku/proto": "0.0.9-5674b0e.0",
+        "@waku/utils": "0.0.22-5674b0e.0",
         "debug": "^4.3.4",
         "it-all": "^3.0.4",
         "it-length-prefixed": "^9.0.4",
@@ -6944,17 +6944,17 @@
       }
     },
     "node_modules/@waku/discovery": {
-      "version": "0.0.7-9f1d8ca.0",
-      "resolved": "https://registry.npmjs.org/@waku/discovery/-/discovery-0.0.7-9f1d8ca.0.tgz",
-      "integrity": "sha512-d7t446IKaxgcvu4OSzWScZioUwkClDxzAsNoNYtoxX6m84ys2yKp2hXeQJYw3WQ7l/3Fs0mYhx3BEHLpwX1OGQ==",
+      "version": "0.0.7-5674b0e.0",
+      "resolved": "https://registry.npmjs.org/@waku/discovery/-/discovery-0.0.7-5674b0e.0.tgz",
+      "integrity": "sha512-wIlwrC5h0tAscv4c9b2U2jTCYzSNqO5QA5eXCom7Vn98w1aXuU9IwTVW+hrkQ3yXG26rj76lyL81NLXyMK6S5w==",
       "license": "MIT OR Apache-2.0",
       "peer": true,
       "dependencies": {
-        "@waku/core": "0.0.34-9f1d8ca.0",
-        "@waku/enr": "0.0.28-9f1d8ca.0",
-        "@waku/interfaces": "0.0.29-9f1d8ca.0",
-        "@waku/proto": "0.0.9-9f1d8ca.0",
-        "@waku/utils": "0.0.22-9f1d8ca.0",
+        "@waku/core": "0.0.34-5674b0e.0",
+        "@waku/enr": "0.0.28-5674b0e.0",
+        "@waku/interfaces": "0.0.29-5674b0e.0",
+        "@waku/proto": "0.0.9-5674b0e.0",
+        "@waku/utils": "0.0.22-5674b0e.0",
         "debug": "^4.3.4",
         "dns-query": "^0.11.2",
         "hi-base32": "^0.5.1",
@@ -6973,9 +6973,9 @@
       }
     },
     "node_modules/@waku/enr": {
-      "version": "0.0.28-9f1d8ca.0",
-      "resolved": "https://registry.npmjs.org/@waku/enr/-/enr-0.0.28-9f1d8ca.0.tgz",
-      "integrity": "sha512-lZtsjM65ZgwB3JpDrVLFfM7Exai+qbuFGtPVUbssaG4zVacMX5YiDow5ybH9skQ/nk2PH6WIOxkDhxVSaPMawA==",
+      "version": "0.0.28-5674b0e.0",
+      "resolved": "https://registry.npmjs.org/@waku/enr/-/enr-0.0.28-5674b0e.0.tgz",
+      "integrity": "sha512-A7dBFiFKbCvA9c1r/YaqLc59L/FMtJoL4bgP414+6ce0sJwIBFyBFmOCx+PzBsy8RQgJ/lU7bHCtbfwyUAdy4A==",
       "license": "MIT OR Apache-2.0",
       "peer": true,
       "dependencies": {
@@ -6984,7 +6984,7 @@
         "@libp2p/peer-id": "^5.0.1",
         "@multiformats/multiaddr": "^12.0.0",
         "@noble/secp256k1": "^1.7.1",
-        "@waku/utils": "0.0.22-9f1d8ca.0",
+        "@waku/utils": "0.0.22-5674b0e.0",
         "debug": "^4.3.4",
         "js-sha3": "^0.9.2"
       },
@@ -7001,36 +7001,36 @@
       }
     },
     "node_modules/@waku/interfaces": {
-      "version": "0.0.29-9f1d8ca.0",
-      "resolved": "https://registry.npmjs.org/@waku/interfaces/-/interfaces-0.0.29-9f1d8ca.0.tgz",
-      "integrity": "sha512-HTxizI2usj7gus+f90kPqjay6TPUUdTrvWB39N6ECZWSzS9PzyjIfGmZH9YyZ2rklnCVvRG25ZV9rDqOd/l8OQ==",
+      "version": "0.0.29-5674b0e.0",
+      "resolved": "https://registry.npmjs.org/@waku/interfaces/-/interfaces-0.0.29-5674b0e.0.tgz",
+      "integrity": "sha512-xSkM0okZZfqV7RJfu9b64kF8bFtXjKR8peaZ7m1Jmp8iyMkvXvjZS78N5uXtLy4fLCr+xPdKAel6/ecthAxS5g==",
       "license": "MIT OR Apache-2.0",
       "peer": true,
       "dependencies": {
-        "@waku/proto": "0.0.9-9f1d8ca.0"
+        "@waku/proto": "0.0.9-5674b0e.0"
       },
       "engines": {
         "node": ">=20"
       }
     },
     "node_modules/@waku/message-hash": {
-      "version": "0.1.18-9f1d8ca.0",
-      "resolved": "https://registry.npmjs.org/@waku/message-hash/-/message-hash-0.1.18-9f1d8ca.0.tgz",
-      "integrity": "sha512-qT7nOUUkDUjXdycb+a/uafwpCwgiMtKIZe/zuZ6Z3frT4MjP4v6MpMEc+askh4rgBCMUQAVu1ZfUQvz+tvypaw==",
+      "version": "0.1.18-5674b0e.0",
+      "resolved": "https://registry.npmjs.org/@waku/message-hash/-/message-hash-0.1.18-5674b0e.0.tgz",
+      "integrity": "sha512-YY35zvGB3G28KwrM7uRBRwi3Zgids0BYWxMO0BVwODCJ3SSHUdNeFrQ1sDzl9sx9wCKWaG1qkuSITFO+cAsvhw==",
       "license": "MIT OR Apache-2.0",
       "peer": true,
       "dependencies": {
         "@noble/hashes": "^1.3.2",
-        "@waku/utils": "0.0.22-9f1d8ca.0"
+        "@waku/utils": "0.0.22-5674b0e.0"
       },
       "engines": {
         "node": ">=20"
       }
     },
     "node_modules/@waku/proto": {
-      "version": "0.0.9-9f1d8ca.0",
-      "resolved": "https://registry.npmjs.org/@waku/proto/-/proto-0.0.9-9f1d8ca.0.tgz",
-      "integrity": "sha512-JeTqbgwsJBrAg5ZUizThRcev5SvSPHXJghNPnOfyx6asz93QRnau68h8/wkoC+8WuUtTs18RyZbAh0BvnvAfvQ==",
+      "version": "0.0.9-5674b0e.0",
+      "resolved": "https://registry.npmjs.org/@waku/proto/-/proto-0.0.9-5674b0e.0.tgz",
+      "integrity": "sha512-AqT2c3andkHfKze5UhcmtvLKsIj8gj7dQ+W4v4xh5R40QfNf1ZSCmQgARB51bE/o27lArk+wyNrLR5aDlzE5mA==",
       "license": "MIT OR Apache-2.0",
       "peer": true,
       "dependencies": {
@@ -7041,15 +7041,15 @@
       }
     },
     "node_modules/@waku/react": {
-      "version": "0.0.7-9a7287d",
-      "resolved": "https://registry.npmjs.org/@waku/react/-/react-0.0.7-9a7287d.tgz",
-      "integrity": "sha512-YYaUESA5Vd3mKX5aOomfN7pdI8ICOTxosD2NgFy62OlzI0RUVZD2xbhSBhjWe0XHT5zv1LgMCVc2wV6uyI3jUw==",
+      "version": "0.0.7-b9d400c",
+      "resolved": "https://registry.npmjs.org/@waku/react/-/react-0.0.7-b9d400c.tgz",
+      "integrity": "sha512-v4C9IPdbqyHtUE9w8DEAccvl4nHdpgSNSAz8tJSER87zyJlZW/ER1vCaPXrQ7I3ro1EbwFSBeGkPXBsTxo4m+g==",
       "license": "MIT OR Apache-2.0",
       "engines": {
         "node": ">=18"
       },
       "peerDependencies": {
-        "@waku/sdk": "0.0.30-9f1d8ca.0",
+        "@waku/sdk": "0.0.30-5674b0e.0",
         "react": "^16.8.0 || ^17 || ^18"
       },
       "peerDependenciesMeta": {
@@ -7059,9 +7059,9 @@
       }
     },
     "node_modules/@waku/sdk": {
-      "version": "0.0.30-9f1d8ca.0",
-      "resolved": "https://registry.npmjs.org/@waku/sdk/-/sdk-0.0.30-9f1d8ca.0.tgz",
-      "integrity": "sha512-XNZXUBaqyugxdIv1WZMb1pK0Q0AmtYTAvPb0R/XF+tbqXvk5eEsJZ13bPN4r/gCbjgaB/yayhaNAMmTVRbn2lw==",
+      "version": "0.0.30-5674b0e.0",
+      "resolved": "https://registry.npmjs.org/@waku/sdk/-/sdk-0.0.30-5674b0e.0.tgz",
+      "integrity": "sha512-NCwVcRHywfgJRCD5fjgIEh3MtaIMDXFxurHRc5nDGP19s3+nAwKOuWM/4BpIYmyieIGdvNoFZXaotvXjdH95qQ==",
       "license": "MIT OR Apache-2.0",
       "peer": true,
       "dependencies": {
@@ -7072,12 +7072,12 @@
         "@libp2p/ping": "2.0.1",
         "@libp2p/websockets": "^9.0.1",
         "@noble/hashes": "^1.3.3",
-        "@waku/core": "0.0.34-9f1d8ca.0",
-        "@waku/discovery": "0.0.7-9f1d8ca.0",
-        "@waku/interfaces": "0.0.29-9f1d8ca.0",
-        "@waku/message-hash": "0.1.18-9f1d8ca.0",
-        "@waku/proto": "0.0.9-9f1d8ca.0",
-        "@waku/utils": "0.0.22-9f1d8ca.0",
+        "@waku/core": "0.0.34-5674b0e.0",
+        "@waku/discovery": "0.0.7-5674b0e.0",
+        "@waku/interfaces": "0.0.29-5674b0e.0",
+        "@waku/message-hash": "0.1.18-5674b0e.0",
+        "@waku/proto": "0.0.9-5674b0e.0",
+        "@waku/utils": "0.0.22-5674b0e.0",
         "async-mutex": "^0.5.0",
         "libp2p": "2.1.8"
       },
@@ -7094,14 +7094,14 @@
       }
     },
     "node_modules/@waku/utils": {
-      "version": "0.0.22-9f1d8ca.0",
-      "resolved": "https://registry.npmjs.org/@waku/utils/-/utils-0.0.22-9f1d8ca.0.tgz",
-      "integrity": "sha512-x1tUGna/kmsLBCRYZ+4zNKsVOCtceThfk9U0ESOLiwh5bRckNv0NofGNdPBfmhhK0A8POm4JWlHRXPpCIwW2kQ==",
+      "version": "0.0.22-5674b0e.0",
+      "resolved": "https://registry.npmjs.org/@waku/utils/-/utils-0.0.22-5674b0e.0.tgz",
+      "integrity": "sha512-hmfSShlqK8k9v6CAxT8XIReUuGWD7bD7XWMZY3EWpPSG9p2hQVnUO8Jlfb2/8aMH2jks3ArnQYGY9mP88JHW2Q==",
       "license": "MIT OR Apache-2.0",
       "peer": true,
       "dependencies": {
         "@noble/hashes": "^1.3.2",
-        "@waku/interfaces": "0.0.29-9f1d8ca.0",
+        "@waku/interfaces": "0.0.29-5674b0e.0",
         "chai": "^4.3.10",
         "debug": "^4.3.4",
         "uint8arrays": "^5.0.1"
diff --git a/examples/buddybook/package.json b/examples/buddybook/package.json
index 4d1ecff..9607f52 100644
--- a/examples/buddybook/package.json
+++ b/examples/buddybook/package.json
@@ -22,7 +22,7 @@
     "@t3-oss/env-nextjs": "^0.9.2",
     "@tailwindcss/typography": "^0.5.15",
     "@tanstack/react-query": "^5.59.15",
-    "@waku/react": "0.0.7-9a7287d",
+    "@waku/react": "0.0.7-b9d400c",
     "buffer": "^6.0.3",
     "class-variance-authority": "^0.7.0",
     "clsx": "^2.1.1",
diff --git a/examples/buddybook/src/lib/waku.ts b/examples/buddybook/src/lib/waku.ts
index d66f458..b06c0de 100644
--- a/examples/buddybook/src/lib/waku.ts
+++ b/examples/buddybook/src/lib/waku.ts
@@ -1,7 +1,7 @@
 import { createEncoder, createDecoder, type LightNode, type CreateWakuNodeOptions } from "@waku/sdk";
 import protobuf from 'protobufjs';
 
-export const WAKU_NODE_OPTIONS: CreateWakuNodeOptions = { defaultBootstrap: true };
+export const WAKU_NODE_OPTIONS: CreateWakuNodeOptions = { defaultBootstrap: true, nodeToUse: {store: "/dns4/boot-01.do-ams3.status.staging.status.im/tcp/443/wss/p2p/16Uiu2HAmEqqio4UR1SWqAc7KY19t6qyDvtmyjreZpzUBJvb4u65R"} };
 
 
 export type Signature = {