From 6925fc048a792b757e95a4750a573caa922c6efc Mon Sep 17 00:00:00 2001
From: marcomariscal <marco.a.mariscal@gmail.com>
Date: Fri, 26 Apr 2024 12:40:25 -0700
Subject: [PATCH 01/48] feat: set the last fetched block as the start block

---
 frontend/src/pages/AccountReceive.vue |  4 ++++
 frontend/src/store/settings.ts        | 15 +++++++++++++--
 2 files changed, 17 insertions(+), 2 deletions(-)

diff --git a/frontend/src/pages/AccountReceive.vue b/frontend/src/pages/AccountReceive.vue
index 63442477..7f3cc7e1 100644
--- a/frontend/src/pages/AccountReceive.vue
+++ b/frontend/src/pages/AccountReceive.vue
@@ -318,6 +318,7 @@ function useScan() {
         const latestBlock: Block = await getLastBlock(provider.value!);
         mostRecentBlockNumber.value = latestBlock.number;
         mostRecentBlockTimestamp.value = latestBlock.timestamp;
+
         // Default scan behavior
         for await (const announcementsBatch of umbra.value.fetchSomeAnnouncements(
           signer.value,
@@ -358,6 +359,9 @@ function useScan() {
         scanStatus.value = 'scanning';
         await filterUserAnnouncementsAsync(spendingPubKey, viewingPrivKey, announcementsQueue);
         scanStatus.value = 'complete';
+
+        // Save the latest block (plus 1 to mitigate overlap) to localStorage for future scans as the start block
+        setScanBlocks(latestBlock.number + 1);
       }
     } catch (e) {
       scanStatus.value = 'waiting'; // reset to the default state because we were unable to fetch announcements
diff --git a/frontend/src/store/settings.ts b/frontend/src/store/settings.ts
index 308bf265..867d2f37 100644
--- a/frontend/src/store/settings.ts
+++ b/frontend/src/store/settings.ts
@@ -12,6 +12,7 @@ const settings = {
   language: 'language',
   sendHistorySave: 'send-history-save',
   UmbraApiVersion: 'umbra-api-version',
+  lastFetchedBlock: 'last-fetched-block',
 };
 
 // Shared state between instances
@@ -41,6 +42,10 @@ export default function useSettingsStore() {
     lastWallet.value = LocalStorage.getItem(settings.lastWallet)
       ? String(LocalStorage.getItem(settings.lastWallet))
       : undefined;
+
+    // Load the last fetched block from localStorage to use as the default start block
+    const lastFetchedBlock = LocalStorage.getItem(settings.lastFetchedBlock);
+    startBlock.value = lastFetchedBlock !== null ? Number(lastFetchedBlock) : undefined;
   });
   setLanguage(
     paramLocale
@@ -92,9 +97,12 @@ export default function useSettingsStore() {
     return '';
   }
 
-  function setScanBlocks(startBlock_: number, endBlock_: number) {
+  function setScanBlocks(startBlock_: number, endBlock_?: number) {
     startBlock.value = startBlock_;
-    endBlock.value = endBlock_ || undefined;
+    endBlock.value = endBlock_;
+
+    // Save the last fetched block to localStorage so we can use it as the default start block next time
+    LocalStorage.set(settings.lastFetchedBlock, startBlock_);
   }
 
   function setScanPrivateKey(key: string) {
@@ -118,6 +126,9 @@ export default function useSettingsStore() {
     startBlock.value = undefined;
     endBlock.value = undefined;
     scanPrivateKey.value = undefined;
+
+    // Clear the last fetched block from localStorage
+    LocalStorage.remove(settings.lastFetchedBlock);
   }
 
   function getUmbraApiVersion(): UmbraApiVersion | null {

From 9932c0784f6481ca72b2af6970da6ddbae502dba Mon Sep 17 00:00:00 2001
From: marcomariscal <marco.a.mariscal@gmail.com>
Date: Tue, 30 Apr 2024 12:32:29 -0700
Subject: [PATCH 02/48] feat: handle caching user announcements and latest
 fetched block

---
 frontend/src/pages/AccountReceive.vue | 71 ++++++++++++++++++++++++---
 frontend/src/store/settings.ts        |  2 +
 2 files changed, 67 insertions(+), 6 deletions(-)

diff --git a/frontend/src/pages/AccountReceive.vue b/frontend/src/pages/AccountReceive.vue
index 7f3cc7e1..fcac3fb2 100644
--- a/frontend/src/pages/AccountReceive.vue
+++ b/frontend/src/pages/AccountReceive.vue
@@ -119,7 +119,7 @@
 
 <script lang="ts">
 import { computed, defineComponent, onMounted, ref, watch } from 'vue';
-import { QForm } from 'quasar';
+import { LocalStorage, QForm } from 'quasar';
 import { Block } from '@ethersproject/abstract-provider';
 import { UserAnnouncement, KeyPair, utils, AnnouncementDetail } from '@umbracash/umbra-js';
 import { BigNumber, Web3Provider, computeAddress, isHexString } from 'src/utils/ethers';
@@ -131,7 +131,7 @@ import AccountReceiveTable from 'components/AccountReceiveTable.vue';
 import ConnectWallet from 'components/ConnectWallet.vue';
 
 function useScan() {
-  const { getPrivateKeys, umbra, spendingKeyPair, viewingKeyPair, hasKeys, userAddress } = useWallet();
+  const { getPrivateKeys, umbra, spendingKeyPair, viewingKeyPair, hasKeys, userAddress, chainId } = useWallet();
   type ScanStatus =
     | 'waiting'
     | 'fetching'
@@ -142,6 +142,9 @@ function useScan() {
     | 'complete latest';
   const scanStatus = ref<ScanStatus>('waiting');
   const scanPercentage = ref<number>(0);
+  const userAnnouncementsLocalStorageKey = computed(() =>
+    userAddress.value && chainId.value ? `userAnnouncements-${userAddress.value}-${chainId.value}` : null
+  );
   const userAnnouncements = ref<UserAnnouncement[]>([]);
   const workers: Worker[] = [];
   const paused = ref(false);
@@ -156,8 +159,21 @@ function useScan() {
   const { advancedMode, startBlock, endBlock, setScanBlocks, setScanPrivateKey, scanPrivateKey, resetScanSettings } =
     useSettingsStore();
   const { signer, userAddress: userWalletAddress, isAccountSetup, provider } = useWalletStore();
-  const startBlockLocal = ref<number>();
-  const endBlockLocal = ref<number>();
+
+  const startBlockLocal = ref<number | undefined>(startBlock.value);
+  const endBlockLocal = ref<number | undefined>(endBlock.value);
+
+  // Watch the start and end blocks
+  watch(
+    [startBlockLocal, endBlockLocal],
+    ([newStart, newEnd]) => {
+      window.logger.debug(
+        `Scan range updated: Start Block - ${newStart ?? 'undefined'}, End Block - ${newEnd ?? 'undefined'}`
+      );
+    },
+    { immediate: true }
+  );
+
   const scanPrivateKeyLocal = ref<string>();
   const needsSignature = computed(() => !hasKeys.value && !scanPrivateKeyLocal.value);
   const settingsFormRef = ref<QForm>(); // for programmatically verifying settings form
@@ -179,11 +195,54 @@ function useScan() {
   };
 
   onMounted(async () => {
-    startBlockLocal.value = startBlock.value; // read in last used startBlock
-    endBlockLocal.value = endBlock.value; // read in last used endBlock
+    // Load userAnnouncements from localStorage
+    const existingAnnouncements = userAnnouncementsLocalStorageKey.value
+      ? LocalStorage.getItem<string>(userAnnouncementsLocalStorageKey.value)
+      : null;
+
+    if (existingAnnouncements) {
+      userAnnouncements.value = deserializeUserAnnouncements(existingAnnouncements);
+    } else {
+      // Explicitly reset start and end blocks if there are no announcements in local storage
+      resetScanSettings();
+    }
+    window.logger.debug('Announcements loaded:', userAnnouncements.value);
+
     if (hasKeys.value && !advancedMode.value) await scan(); // if user already signed and we have their keys in memory, start scanning
   });
 
+  // Watch for changes in userAnnouncements and save to localStorage
+  watch(
+    userAnnouncements,
+    (newVal) => {
+      if (userAnnouncementsLocalStorageKey.value) {
+        LocalStorage.set(userAnnouncementsLocalStorageKey.value, serializeUserAnnouncements(newVal));
+        window.logger.debug('Announcements updated in local storage:', newVal);
+      }
+    },
+    { deep: true }
+  );
+
+  // Serialize userAnnouncements to store in LocalStorage
+  function serializeUserAnnouncements(announcements: UserAnnouncement[]) {
+    return JSON.stringify(
+      announcements.map((announcement) => ({
+        ...announcement,
+        amount: announcement.amount.toString(), // Convert BigNumber to string
+      }))
+    );
+  }
+
+  // Deserialize userAnnouncements from LocalStorage
+  function deserializeUserAnnouncements(serialized: string | null) {
+    if (!serialized) return [];
+
+    return JSON.parse(serialized).map((announcement: UserAnnouncement) => ({
+      ...announcement,
+      amount: BigNumber.from(announcement.amount), // Convert string to BigNumber
+    })) as UserAnnouncement[];
+  }
+
   async function getPrivateKeysHandler() {
     // Validate form and reset userAnnouncements
     if (advancedMode.value) {
diff --git a/frontend/src/store/settings.ts b/frontend/src/store/settings.ts
index 867d2f37..81c55e46 100644
--- a/frontend/src/store/settings.ts
+++ b/frontend/src/store/settings.ts
@@ -98,6 +98,8 @@ export default function useSettingsStore() {
   }
 
   function setScanBlocks(startBlock_: number, endBlock_?: number) {
+    window.logger.debug(`Setting scan blocks: Start - ${startBlock_} ${endBlock_ ? `, End - ${endBlock_}` : ''}`);
+
     startBlock.value = startBlock_;
     endBlock.value = endBlock_;
 

From 154ff465a472a39ec7dcf9aed365349840335bac Mon Sep 17 00:00:00 2001
From: marcomariscal <marco.a.mariscal@gmail.com>
Date: Tue, 30 Apr 2024 13:16:11 -0700
Subject: [PATCH 03/48] feat: show user announcements if there are any

---
 frontend/src/pages/AccountReceive.vue | 17 ++++++-----------
 1 file changed, 6 insertions(+), 11 deletions(-)

diff --git a/frontend/src/pages/AccountReceive.vue b/frontend/src/pages/AccountReceive.vue
index fcac3fb2..9d311482 100644
--- a/frontend/src/pages/AccountReceive.vue
+++ b/frontend/src/pages/AccountReceive.vue
@@ -30,7 +30,7 @@
         <div v-else class="text-center q-mb-md">{{ $t('Receive.scan-funds') }}</div>
         <base-button
           @click="getPrivateKeysHandler"
-          class="text-center"
+          class="text-center q-mb-md"
           :label="needsSignature ? $t('Receive.sign') : $t('Receive.scan')"
         />
 
@@ -70,8 +70,8 @@
         </q-card>
       </div>
 
-      <!-- Scanning complete -->
-      <div v-else-if="userAnnouncements.length || scanStatus === 'complete'" class="text-center">
+      <!-- Scanning complete or there are user announcements -->
+      <div v-if="userAnnouncements.length || scanStatus === 'complete'" class="text-center">
         <account-receive-table
           :announcements="userAnnouncements"
           :scanStatus="scanStatus"
@@ -85,20 +85,14 @@
       </div>
 
       <!-- Scanning in progress -->
-      <div
-        v-if="(scanStatus === 'scanning' || scanStatus === 'scanning latest') && !userAnnouncements.length"
-        class="text-center"
-      >
+      <div v-if="scanStatus === 'scanning' || scanStatus === 'scanning latest'" class="text-center">
         <progress-indicator :percentage="scanPercentage" />
         <div v-if="scanStatus === 'scanning'" class="text-center text-italic">{{ $t('Receive.scanning') }}</div>
         <div v-else class="text-center text-italic">{{ $t('Receive.scanning-latest') }}</div>
         <div class="text-center text-italic q-mt-lg" v-html="$t('Receive.wait')"></div>
       </div>
 
-      <div
-        v-else-if="(scanStatus === 'fetching latest' || scanStatus === 'fetching') && !userAnnouncements.length"
-        class="text-center"
-      >
+      <div v-else-if="scanStatus === 'fetching latest' || scanStatus === 'fetching'" class="text-center">
         <loading-spinner />
         <div v-if="scanStatus === 'fetching'" class="text-center text-italic">
           {{ $t('Receive.fetching') }}
@@ -204,6 +198,7 @@ function useScan() {
       userAnnouncements.value = deserializeUserAnnouncements(existingAnnouncements);
     } else {
       // Explicitly reset start and end blocks if there are no announcements in local storage
+      // This is to prevent the user from scanning latest blocks only and missing earlier announcements
       resetScanSettings();
     }
     window.logger.debug('Announcements loaded:', userAnnouncements.value);

From 136c4f300b633d6dd1eeacb5c1b8225eac20c35f Mon Sep 17 00:00:00 2001
From: marcomariscal <marco.a.mariscal@gmail.com>
Date: Tue, 30 Apr 2024 13:40:48 -0700
Subject: [PATCH 04/48] fix: handle watching/loading announcements

---
 frontend/src/pages/AccountReceive.vue | 65 ++++++++++++++++-----------
 frontend/src/store/settings.ts        |  6 +--
 2 files changed, 41 insertions(+), 30 deletions(-)

diff --git a/frontend/src/pages/AccountReceive.vue b/frontend/src/pages/AccountReceive.vue
index 9d311482..09707884 100644
--- a/frontend/src/pages/AccountReceive.vue
+++ b/frontend/src/pages/AccountReceive.vue
@@ -140,6 +140,38 @@ function useScan() {
     userAddress.value && chainId.value ? `userAnnouncements-${userAddress.value}-${chainId.value}` : null
   );
   const userAnnouncements = ref<UserAnnouncement[]>([]);
+
+  // Function to load announcements from localStorage
+  function loadUserAnnouncements() {
+    if (userAnnouncementsLocalStorageKey.value) {
+      const storedAnnouncements = deserializeUserAnnouncements(
+        LocalStorage.getItem(userAnnouncementsLocalStorageKey.value)
+      );
+
+      if (storedAnnouncements) {
+        userAnnouncements.value = storedAnnouncements;
+        window.logger.debug('Announcements loaded:', userAnnouncements.value);
+      } else {
+        window.logger.debug('No announcements found in local storage for key:', userAnnouncementsLocalStorageKey.value);
+      }
+    } else {
+      window.logger.debug('LocalStorage key for announcements is not set.');
+      // Explicitly reset start and end blocks if there are no announcements in local storage
+      // This is to prevent the user from scanning latest blocks only and missing earlier announcements
+      resetScanSettings();
+    }
+  }
+
+  // Watch for changes in userAddress or chainId to load announcements
+  watch(
+    [userAddress, chainId],
+    () => {
+      console.log('Detected change in user address or chain ID, attempting to load announcements...');
+      loadUserAnnouncements();
+    },
+    { immediate: true }
+  );
+
   const workers: Worker[] = [];
   const paused = ref(false);
 
@@ -157,17 +189,6 @@ function useScan() {
   const startBlockLocal = ref<number | undefined>(startBlock.value);
   const endBlockLocal = ref<number | undefined>(endBlock.value);
 
-  // Watch the start and end blocks
-  watch(
-    [startBlockLocal, endBlockLocal],
-    ([newStart, newEnd]) => {
-      window.logger.debug(
-        `Scan range updated: Start Block - ${newStart ?? 'undefined'}, End Block - ${newEnd ?? 'undefined'}`
-      );
-    },
-    { immediate: true }
-  );
-
   const scanPrivateKeyLocal = ref<string>();
   const needsSignature = computed(() => !hasKeys.value && !scanPrivateKeyLocal.value);
   const settingsFormRef = ref<QForm>(); // for programmatically verifying settings form
@@ -189,20 +210,6 @@ function useScan() {
   };
 
   onMounted(async () => {
-    // Load userAnnouncements from localStorage
-    const existingAnnouncements = userAnnouncementsLocalStorageKey.value
-      ? LocalStorage.getItem<string>(userAnnouncementsLocalStorageKey.value)
-      : null;
-
-    if (existingAnnouncements) {
-      userAnnouncements.value = deserializeUserAnnouncements(existingAnnouncements);
-    } else {
-      // Explicitly reset start and end blocks if there are no announcements in local storage
-      // This is to prevent the user from scanning latest blocks only and missing earlier announcements
-      resetScanSettings();
-    }
-    window.logger.debug('Announcements loaded:', userAnnouncements.value);
-
     if (hasKeys.value && !advancedMode.value) await scan(); // if user already signed and we have their keys in memory, start scanning
   });
 
@@ -247,6 +254,7 @@ function useScan() {
     }
 
     if (Number(startBlockLocal.value) > Number(endBlockLocal.value || undefined)) {
+      console.log('🦄 ~ onMounted ~ userAnnouncementsLocalStorageKey.value:', userAnnouncementsLocalStorageKey.value);
       throw new Error('End block is larger than start block');
     }
 
@@ -301,6 +309,9 @@ function useScan() {
     };
 
     // Fetch announcements
+    window.logger.debug(
+      `Scanning for announcements from ${startBlockLocal.value ?? 'undefined'} to ${endBlockLocal.value ?? 'undefined'}`
+    );
     const overrides = { startBlock: startBlockLocal.value, endBlock: endBlockLocal.value };
 
     // Scan for funds
@@ -414,8 +425,8 @@ function useScan() {
         await filterUserAnnouncementsAsync(spendingPubKey, viewingPrivKey, announcementsQueue);
         scanStatus.value = 'complete';
 
-        // Save the latest block (plus 1 to mitigate overlap) to localStorage for future scans as the start block
-        setScanBlocks(latestBlock.number + 1);
+        // Save the latest block to localStorage for future scans as the start block
+        setScanBlocks(latestBlock.number);
       }
     } catch (e) {
       scanStatus.value = 'waiting'; // reset to the default state because we were unable to fetch announcements
diff --git a/frontend/src/store/settings.ts b/frontend/src/store/settings.ts
index 81c55e46..72f73aed 100644
--- a/frontend/src/store/settings.ts
+++ b/frontend/src/store/settings.ts
@@ -45,7 +45,9 @@ export default function useSettingsStore() {
 
     // Load the last fetched block from localStorage to use as the default start block
     const lastFetchedBlock = LocalStorage.getItem(settings.lastFetchedBlock);
-    startBlock.value = lastFetchedBlock !== null ? Number(lastFetchedBlock) : undefined;
+    if (lastFetchedBlock) {
+      startBlock.value = Number(lastFetchedBlock) + 1; // New scans should start after the last fetched block
+    }
   });
   setLanguage(
     paramLocale
@@ -98,8 +100,6 @@ export default function useSettingsStore() {
   }
 
   function setScanBlocks(startBlock_: number, endBlock_?: number) {
-    window.logger.debug(`Setting scan blocks: Start - ${startBlock_} ${endBlock_ ? `, End - ${endBlock_}` : ''}`);
-
     startBlock.value = startBlock_;
     endBlock.value = endBlock_;
 

From 9ba31152677058394cebf07ab59aa9935061fadc Mon Sep 17 00:00:00 2001
From: marcomariscal <marco.a.mariscal@gmail.com>
Date: Wed, 1 May 2024 11:27:20 -0700
Subject: [PATCH 05/48] fix: parse out lastFetchedBlock and fix user
 announcement loading logic

---
 frontend/src/pages/AccountReceive.vue | 68 ++++++++++++++++-----------
 frontend/src/store/settings.ts        | 16 ++++---
 2 files changed, 50 insertions(+), 34 deletions(-)

diff --git a/frontend/src/pages/AccountReceive.vue b/frontend/src/pages/AccountReceive.vue
index 09707884..ec7e607d 100644
--- a/frontend/src/pages/AccountReceive.vue
+++ b/frontend/src/pages/AccountReceive.vue
@@ -143,34 +143,30 @@ function useScan() {
 
   // Function to load announcements from localStorage
   function loadUserAnnouncements() {
-    if (userAnnouncementsLocalStorageKey.value) {
-      const storedAnnouncements = deserializeUserAnnouncements(
-        LocalStorage.getItem(userAnnouncementsLocalStorageKey.value)
-      );
-
-      if (storedAnnouncements) {
-        userAnnouncements.value = storedAnnouncements;
-        window.logger.debug('Announcements loaded:', userAnnouncements.value);
-      } else {
-        window.logger.debug('No announcements found in local storage for key:', userAnnouncementsLocalStorageKey.value);
-      }
-    } else {
-      window.logger.debug('LocalStorage key for announcements is not set.');
-      // Explicitly reset start and end blocks if there are no announcements in local storage
-      // This is to prevent the user from scanning latest blocks only and missing earlier announcements
+    // If userAnnouncementsLocalStorageKey is not set, return
+    if (!userAnnouncementsLocalStorageKey.value) return;
+
+    const storedAnnouncements = deserializeUserAnnouncements(
+      LocalStorage.getItem(userAnnouncementsLocalStorageKey.value)
+    );
+
+    if (!storedAnnouncements || storedAnnouncements.length === 0) {
+      window.logger.debug('No announcements found in local storage for key:', userAnnouncementsLocalStorageKey.value);
+      window.logger.debug('Resetting last fetched block');
+      resetLastFetchedBlock();
       resetScanSettings();
+      return;
     }
+
+    userAnnouncements.value = storedAnnouncements;
+    window.logger.debug('Announcements loaded:', userAnnouncements.value);
   }
 
   // Watch for changes in userAddress or chainId to load announcements
-  watch(
-    [userAddress, chainId],
-    () => {
-      console.log('Detected change in user address or chain ID, attempting to load announcements...');
-      loadUserAnnouncements();
-    },
-    { immediate: true }
-  );
+  watch([userAddress, chainId], () => {
+    console.log('Detected change in user address or chain ID, attempting to load announcements...');
+    loadUserAnnouncements();
+  });
 
   const workers: Worker[] = [];
   const paused = ref(false);
@@ -182,11 +178,27 @@ function useScan() {
   const mostRecentBlockNumber = ref<number>(0);
 
   // Start and end blocks for advanced mode settings
-  const { advancedMode, startBlock, endBlock, setScanBlocks, setScanPrivateKey, scanPrivateKey, resetScanSettings } =
-    useSettingsStore();
+  const {
+    advancedMode,
+    startBlock,
+    endBlock,
+    setScanBlocks,
+    setScanPrivateKey,
+    scanPrivateKey,
+    resetScanSettings,
+    setLastFetchedBlock,
+    resetLastFetchedBlock,
+  } = useSettingsStore();
   const { signer, userAddress: userWalletAddress, isAccountSetup, provider } = useWalletStore();
 
   const startBlockLocal = ref<number | undefined>(startBlock.value);
+
+  // watch for changes in startBlock and update startBlockLocal
+  watch(startBlock, (newVal) => {
+    startBlockLocal.value = newVal;
+    window.logger.debug('startBlockLocal updated:', startBlockLocal.value);
+  });
+
   const endBlockLocal = ref<number | undefined>(endBlock.value);
 
   const scanPrivateKeyLocal = ref<string>();
@@ -210,6 +222,7 @@ function useScan() {
   };
 
   onMounted(async () => {
+    loadUserAnnouncements();
     if (hasKeys.value && !advancedMode.value) await scan(); // if user already signed and we have their keys in memory, start scanning
   });
 
@@ -237,7 +250,7 @@ function useScan() {
 
   // Deserialize userAnnouncements from LocalStorage
   function deserializeUserAnnouncements(serialized: string | null) {
-    if (!serialized) return [];
+    if (!serialized) return null;
 
     return JSON.parse(serialized).map((announcement: UserAnnouncement) => ({
       ...announcement,
@@ -254,7 +267,6 @@ function useScan() {
     }
 
     if (Number(startBlockLocal.value) > Number(endBlockLocal.value || undefined)) {
-      console.log('🦄 ~ onMounted ~ userAnnouncementsLocalStorageKey.value:', userAnnouncementsLocalStorageKey.value);
       throw new Error('End block is larger than start block');
     }
 
@@ -426,7 +438,7 @@ function useScan() {
         scanStatus.value = 'complete';
 
         // Save the latest block to localStorage for future scans as the start block
-        setScanBlocks(latestBlock.number);
+        setLastFetchedBlock(latestBlock.number);
       }
     } catch (e) {
       scanStatus.value = 'waiting'; // reset to the default state because we were unable to fetch announcements
diff --git a/frontend/src/store/settings.ts b/frontend/src/store/settings.ts
index 72f73aed..d6a52107 100644
--- a/frontend/src/store/settings.ts
+++ b/frontend/src/store/settings.ts
@@ -102,9 +102,6 @@ export default function useSettingsStore() {
   function setScanBlocks(startBlock_: number, endBlock_?: number) {
     startBlock.value = startBlock_;
     endBlock.value = endBlock_;
-
-    // Save the last fetched block to localStorage so we can use it as the default start block next time
-    LocalStorage.set(settings.lastFetchedBlock, startBlock_);
   }
 
   function setScanPrivateKey(key: string) {
@@ -128,9 +125,6 @@ export default function useSettingsStore() {
     startBlock.value = undefined;
     endBlock.value = undefined;
     scanPrivateKey.value = undefined;
-
-    // Clear the last fetched block from localStorage
-    LocalStorage.remove(settings.lastFetchedBlock);
   }
 
   function getUmbraApiVersion(): UmbraApiVersion | null {
@@ -150,6 +144,14 @@ export default function useSettingsStore() {
     LocalStorage.remove(settings.UmbraApiVersion);
   }
 
+  function setLastFetchedBlock(block: number) {
+    LocalStorage.set(settings.lastFetchedBlock, block);
+  }
+
+  function resetLastFetchedBlock() {
+    LocalStorage.remove(settings.lastFetchedBlock);
+  }
+
   return {
     toggleDarkMode,
     toggleAdvancedMode,
@@ -171,5 +173,7 @@ export default function useSettingsStore() {
     getUmbraApiVersion,
     setUmbraApiVersion,
     clearUmbraApiVersion,
+    setLastFetchedBlock,
+    resetLastFetchedBlock,
   };
 }

From 9b493176234d6e38e241151eeb3fd87222571409 Mon Sep 17 00:00:00 2001
From: marcomariscal <marco.a.mariscal@gmail.com>
Date: Wed, 1 May 2024 12:03:13 -0700
Subject: [PATCH 06/48] chore: log

---
 frontend/src/pages/AccountReceive.vue | 18 +++++++++++++-----
 1 file changed, 13 insertions(+), 5 deletions(-)

diff --git a/frontend/src/pages/AccountReceive.vue b/frontend/src/pages/AccountReceive.vue
index ec7e607d..42ee7008 100644
--- a/frontend/src/pages/AccountReceive.vue
+++ b/frontend/src/pages/AccountReceive.vue
@@ -150,11 +150,8 @@ function useScan() {
       LocalStorage.getItem(userAnnouncementsLocalStorageKey.value)
     );
 
-    if (!storedAnnouncements || storedAnnouncements.length === 0) {
+    if (!storedAnnouncements) {
       window.logger.debug('No announcements found in local storage for key:', userAnnouncementsLocalStorageKey.value);
-      window.logger.debug('Resetting last fetched block');
-      resetLastFetchedBlock();
-      resetScanSettings();
       return;
     }
 
@@ -162,6 +159,11 @@ function useScan() {
     window.logger.debug('Announcements loaded:', userAnnouncements.value);
   }
 
+  function resetUserAnnouncements() {
+    userAnnouncements.value = [];
+    if (userAnnouncementsLocalStorageKey.value) LocalStorage.remove(userAnnouncementsLocalStorageKey.value);
+  }
+
   // Watch for changes in userAddress or chainId to load announcements
   watch([userAddress, chainId], () => {
     console.log('Detected change in user address or chain ID, attempting to load announcements...');
@@ -453,10 +455,16 @@ function useScan() {
     endBlockLocal.value = undefined;
     scanPrivateKeyLocal.value = undefined;
     resetScanSettings();
+    resetLastFetchedBlock();
+    resetUserAnnouncements();
   }
 
   watch(userAddress, () => {
-    if (userAddress.value) resetState();
+    // Only reset state if the address has changed and is not undefined
+    if (userAddress.value) {
+      window.logger.debug('Resetting state for new address:', userAddress.value);
+      resetState();
+    }
   });
 
   return {

From 9af424d7c4db901cca1cd99da2b2de876f222e5f Mon Sep 17 00:00:00 2001
From: marcomariscal <marco.a.mariscal@gmail.com>
Date: Thu, 20 Jun 2024 12:35:33 -0700
Subject: [PATCH 07/48] feat: handle block data caching

---
 frontend/src/pages/AccountReceive.vue | 183 ++++++++++++++++++++------
 frontend/src/store/settings.ts        |  17 +--
 2 files changed, 143 insertions(+), 57 deletions(-)

diff --git a/frontend/src/pages/AccountReceive.vue b/frontend/src/pages/AccountReceive.vue
index 42ee7008..083ee405 100644
--- a/frontend/src/pages/AccountReceive.vue
+++ b/frontend/src/pages/AccountReceive.vue
@@ -136,14 +136,86 @@ function useScan() {
     | 'complete latest';
   const scanStatus = ref<ScanStatus>('waiting');
   const scanPercentage = ref<number>(0);
+
+  const lastFetchedBlockKey = computed(() =>
+    userAddress.value && chainId.value ? `lastFetchedBlock-${userAddress.value}-${chainId.value}` : null
+  );
   const userAnnouncementsLocalStorageKey = computed(() =>
     userAddress.value && chainId.value ? `userAnnouncements-${userAddress.value}-${chainId.value}` : null
   );
+  const mostRecentAnnouncementTimestampKey = computed(() =>
+    userAddress.value && chainId.value ? `mostRecentAnnouncementTimestamp-${userAddress.value}-${chainId.value}` : null
+  );
+  const mostRecentAnnouncementBlockNumberKey = computed(() =>
+    userAddress.value && chainId.value
+      ? `mostRecentAnnouncementBlockNumber-${userAddress.value}-${chainId.value}`
+      : null
+  );
   const userAnnouncements = ref<UserAnnouncement[]>([]);
+  const mostRecentAnnouncementTimestamp = ref<number>(0);
+  const mostRecentAnnouncementBlockNumber = ref<number>(0);
+  const mostRecentBlockTimestamp = ref<number>(0);
+  const mostRecentBlockNumber = ref<number>(0);
+
+  // Start and end blocks for advanced mode settings
+  const {
+    advancedMode,
+    startBlock,
+    endBlock,
+    setScanBlocks,
+    setScanPrivateKey,
+    scanPrivateKey,
+    resetScanSettings: resetScanSettingsInSettingsStore,
+  } = useSettingsStore();
+  const { signer, userAddress: userWalletAddress, isAccountSetup, provider } = useWalletStore();
+
+  const startBlockLocal = ref<number | undefined>(startBlock.value);
+
+  function loadLastFetchedBlock() {
+    if (lastFetchedBlockKey.value) {
+      LocalStorage.getItem(lastFetchedBlockKey.value);
+      const lastFetchedBlock = LocalStorage.getItem(lastFetchedBlockKey.value);
+      window.logger.debug('Last fetched block loaded and set as startBlockLocal:', lastFetchedBlock);
+      startBlockLocal.value = lastFetchedBlock ? Number(lastFetchedBlock) : undefined;
+      return lastFetchedBlock as number | undefined;
+    }
+
+    return undefined;
+  }
+
+  function setLastFetchedBlock(block: number) {
+    if (lastFetchedBlockKey.value) LocalStorage.set(lastFetchedBlockKey.value, block);
+  }
+
+  function resetLastFetchedBlock() {
+    if (lastFetchedBlockKey.value) LocalStorage.remove(lastFetchedBlockKey.value);
+  }
+
+  function loadUserAnnouncementBlockData() {
+    const storedBlockNumber = mostRecentAnnouncementBlockNumberKey.value
+      ? LocalStorage.getItem(mostRecentAnnouncementBlockNumberKey.value)
+      : undefined;
+    if (storedBlockNumber) {
+      mostRecentAnnouncementBlockNumber.value = Number(storedBlockNumber);
+      window.logger.debug('Most recent announcement block number loaded:', mostRecentAnnouncementBlockNumber.value);
+    }
+
+    const storedTimestamp = mostRecentAnnouncementTimestampKey.value
+      ? LocalStorage.getItem(mostRecentAnnouncementTimestampKey.value)
+      : undefined;
+
+    if (storedTimestamp) {
+      mostRecentAnnouncementTimestamp.value = Number(storedTimestamp);
+      window.logger.debug('Most recent announcement timestamp loaded:', mostRecentAnnouncementTimestamp.value);
+    }
+
+    return {
+      mostRecentAnnouncementBlockNumber: Number(storedBlockNumber),
+      mostRecentAnnouncementTimestamp: Number(storedTimestamp),
+    };
+  }
 
-  // Function to load announcements from localStorage
   function loadUserAnnouncements() {
-    // If userAnnouncementsLocalStorageKey is not set, return
     if (!userAnnouncementsLocalStorageKey.value) return;
 
     const storedAnnouncements = deserializeUserAnnouncements(
@@ -157,6 +229,8 @@ function useScan() {
 
     userAnnouncements.value = storedAnnouncements;
     window.logger.debug('Announcements loaded:', userAnnouncements.value);
+
+    return storedAnnouncements;
   }
 
   function resetUserAnnouncements() {
@@ -166,35 +240,13 @@ function useScan() {
 
   // Watch for changes in userAddress or chainId to load announcements
   watch([userAddress, chainId], () => {
-    console.log('Detected change in user address or chain ID, attempting to load announcements...');
+    window.logger.debug('Detected change in user address or chain ID, attempting to load announcements...');
     loadUserAnnouncements();
   });
 
   const workers: Worker[] = [];
   const paused = ref(false);
 
-  const mostRecentAnnouncementTimestamp = ref<number>(0);
-  const mostRecentAnnouncementBlockNumber = ref<number>(0);
-
-  const mostRecentBlockTimestamp = ref<number>(0);
-  const mostRecentBlockNumber = ref<number>(0);
-
-  // Start and end blocks for advanced mode settings
-  const {
-    advancedMode,
-    startBlock,
-    endBlock,
-    setScanBlocks,
-    setScanPrivateKey,
-    scanPrivateKey,
-    resetScanSettings,
-    setLastFetchedBlock,
-    resetLastFetchedBlock,
-  } = useSettingsStore();
-  const { signer, userAddress: userWalletAddress, isAccountSetup, provider } = useWalletStore();
-
-  const startBlockLocal = ref<number | undefined>(startBlock.value);
-
   // watch for changes in startBlock and update startBlockLocal
   watch(startBlock, (newVal) => {
     startBlockLocal.value = newVal;
@@ -224,28 +276,26 @@ function useScan() {
   };
 
   onMounted(async () => {
+    loadLastFetchedBlock();
+    loadUserAnnouncementBlockData();
     loadUserAnnouncements();
     if (hasKeys.value && !advancedMode.value) await scan(); // if user already signed and we have their keys in memory, start scanning
   });
 
   // Watch for changes in userAnnouncements and save to localStorage
-  watch(
-    userAnnouncements,
-    (newVal) => {
-      if (userAnnouncementsLocalStorageKey.value) {
-        LocalStorage.set(userAnnouncementsLocalStorageKey.value, serializeUserAnnouncements(newVal));
-        window.logger.debug('Announcements updated in local storage:', newVal);
-      }
-    },
-    { deep: true }
-  );
+  watch(userAnnouncements, (newVal) => {
+    if (userAnnouncementsLocalStorageKey.value) {
+      LocalStorage.set(userAnnouncementsLocalStorageKey.value, serializeUserAnnouncements(newVal));
+      window.logger.debug('Announcements updated in local storage:', newVal);
+    }
+  });
 
   // Serialize userAnnouncements to store in LocalStorage
   function serializeUserAnnouncements(announcements: UserAnnouncement[]) {
     return JSON.stringify(
       announcements.map((announcement) => ({
         ...announcement,
-        amount: announcement.amount.toString(), // Convert BigNumber to string
+        amount: announcement.amount.toString(),
       }))
     );
   }
@@ -256,7 +306,7 @@ function useScan() {
 
     return JSON.parse(serialized).map((announcement: UserAnnouncement) => ({
       ...announcement,
-      amount: BigNumber.from(announcement.amount), // Convert string to BigNumber
+      amount: BigNumber.from(announcement.amount),
     })) as UserAnnouncement[];
   }
 
@@ -413,10 +463,18 @@ function useScan() {
             const thisTimestamp = parseInt(announcement.timestamp);
             if (thisTimestamp > mostRecentAnnouncementTimestamp.value) {
               mostRecentAnnouncementTimestamp.value = thisTimestamp;
+              // Save the most recent announcement timestamp to localStorage
+              if (mostRecentAnnouncementTimestampKey.value) {
+                LocalStorage.set(mostRecentAnnouncementTimestampKey.value, thisTimestamp);
+              }
             }
             const thisBlock = parseInt(announcement.block);
             if (thisBlock > mostRecentAnnouncementBlockNumber.value) {
               mostRecentAnnouncementBlockNumber.value = thisBlock;
+              // Save the most recent announcement block number to localStorage
+              if (mostRecentAnnouncementBlockNumberKey.value) {
+                LocalStorage.set(mostRecentAnnouncementBlockNumberKey.value, thisBlock);
+              }
             }
           });
 
@@ -448,22 +506,63 @@ function useScan() {
     }
   }
 
-  function resetState() {
+  function resetScanSettingsLocal() {
     scanStatus.value = 'waiting';
     scanPercentage.value = 0;
     startBlockLocal.value = undefined;
     endBlockLocal.value = undefined;
     scanPrivateKeyLocal.value = undefined;
-    resetScanSettings();
+    resetScanSettingsInSettingsStore();
+  }
+
+  function resetState() {
+    resetScanSettingsLocal();
     resetLastFetchedBlock();
     resetUserAnnouncements();
   }
 
+  // Handle changes in userAddress
   watch(userAddress, () => {
-    // Only reset state if the address has changed and is not undefined
-    if (userAddress.value) {
-      window.logger.debug('Resetting state for new address:', userAddress.value);
+    if (!userAddress.value) return;
+
+    // Always reset state if advanced mode is enabled
+    if (advancedMode.value) {
       resetState();
+      return;
+    }
+
+    // Get the user announcements from local storage
+    const storedAnnouncements = loadUserAnnouncements();
+
+    if (storedAnnouncements) {
+      window.logger.debug('User announcements found in local storage:', storedAnnouncements);
+      const lastFetchedBlock = loadLastFetchedBlock();
+
+      // If the last fetched block is not found, reset the state
+      if (!lastFetchedBlock) {
+        resetState();
+        return;
+      }
+
+      // Make sure the start block is the last fetched block
+      setScanBlocks(lastFetchedBlock, endBlockLocal.value);
+      return;
+    }
+
+    // Only reset state if the address has changed and is not undefined
+    window.logger.debug('Resetting state for new address:', userAddress.value);
+    resetState();
+  });
+
+  // If no recent block data set and there are announcements, set the most recent block data
+  watch(userAnnouncements, () => {
+    if (!mostRecentAnnouncementBlockNumber.value && userAnnouncements.value.length) {
+      const {
+        mostRecentAnnouncementBlockNumber: blockNumInLocalStorage,
+        mostRecentAnnouncementTimestamp: timestampInLocalStorage,
+      } = loadUserAnnouncementBlockData();
+      mostRecentAnnouncementBlockNumber.value = blockNumInLocalStorage;
+      mostRecentAnnouncementTimestamp.value = timestampInLocalStorage;
     }
   });
 
diff --git a/frontend/src/store/settings.ts b/frontend/src/store/settings.ts
index d6a52107..82b2ad85 100644
--- a/frontend/src/store/settings.ts
+++ b/frontend/src/store/settings.ts
@@ -12,9 +12,10 @@ const settings = {
   language: 'language',
   sendHistorySave: 'send-history-save',
   UmbraApiVersion: 'umbra-api-version',
-  lastFetchedBlock: 'last-fetched-block',
 };
 
+
+
 // Shared state between instances
 const isDark = ref(false); // true if user has dark mode turned on
 const advancedMode = ref(false); // true if user has advanced mode turned on
@@ -43,11 +44,6 @@ export default function useSettingsStore() {
       ? String(LocalStorage.getItem(settings.lastWallet))
       : undefined;
 
-    // Load the last fetched block from localStorage to use as the default start block
-    const lastFetchedBlock = LocalStorage.getItem(settings.lastFetchedBlock);
-    if (lastFetchedBlock) {
-      startBlock.value = Number(lastFetchedBlock) + 1; // New scans should start after the last fetched block
-    }
   });
   setLanguage(
     paramLocale
@@ -144,13 +140,6 @@ export default function useSettingsStore() {
     LocalStorage.remove(settings.UmbraApiVersion);
   }
 
-  function setLastFetchedBlock(block: number) {
-    LocalStorage.set(settings.lastFetchedBlock, block);
-  }
-
-  function resetLastFetchedBlock() {
-    LocalStorage.remove(settings.lastFetchedBlock);
-  }
 
   return {
     toggleDarkMode,
@@ -173,7 +162,5 @@ export default function useSettingsStore() {
     getUmbraApiVersion,
     setUmbraApiVersion,
     clearUmbraApiVersion,
-    setLastFetchedBlock,
-    resetLastFetchedBlock,
   };
 }

From c449a82ef6fbd8e1863cbaf337cdc930e2037c79 Mon Sep 17 00:00:00 2001
From: marcomariscal <marco.a.mariscal@gmail.com>
Date: Thu, 20 Jun 2024 12:55:31 -0700
Subject: [PATCH 08/48] feat: show most recent block data if exists

---
 frontend/src/components/AccountReceiveTable.vue | 10 +++-------
 frontend/src/pages/AccountReceive.vue           |  4 ++--
 2 files changed, 5 insertions(+), 9 deletions(-)

diff --git a/frontend/src/components/AccountReceiveTable.vue b/frontend/src/components/AccountReceiveTable.vue
index b1147bdd..2e914f08 100644
--- a/frontend/src/components/AccountReceiveTable.vue
+++ b/frontend/src/components/AccountReceiveTable.vue
@@ -60,7 +60,7 @@
         >.
       </div>
 
-      <div v-if="scanStatus === 'complete'" class="text-caption q-mb-sm">
+      <div v-if="mostRecentAnnouncementBlockNumber && mostRecentAnnouncementTimestamp" class="text-caption q-mb-sm">
         <!-- Show the most recent timestamp and block that were scanned -->
         {{ $t('AccountReceiveTable.most-recent-announcement') }}
         {{ mostRecentAnnouncementBlockNumber }} /
@@ -99,12 +99,8 @@
           <div :key="props.row.id" class="col-12">
             <q-card class="card-border cursor-pointer q-pt-md col justify-center items-center">
               <q-card-section class="row justify-center items-center">
-                <img
-                  class="q-mr-md"
-                  :src="getTokenLogoUri(props.row.token, tokens)"
-                  style="width: 1.2rem"
-                  v-if="getTokenInfo(props.row.token)"
-                />
+                <img v-if="getTokenInfo(props.row.token)" src="path/to/image.jpg" />props.row.token, tokens)"
+                style="width: 1.2rem" v-if="getTokenInfo(props.row.token)" />
                 <div class="text-primary text-h6 header-black q-pb-none">
                   {{ formatAmount(props.row.amount, props.row.token, tokens) }}
                   {{ getTokenSymbol(props.row.token, tokens) }}
diff --git a/frontend/src/pages/AccountReceive.vue b/frontend/src/pages/AccountReceive.vue
index 083ee405..bb0f2494 100644
--- a/frontend/src/pages/AccountReceive.vue
+++ b/frontend/src/pages/AccountReceive.vue
@@ -152,8 +152,8 @@ function useScan() {
       : null
   );
   const userAnnouncements = ref<UserAnnouncement[]>([]);
-  const mostRecentAnnouncementTimestamp = ref<number>(0);
-  const mostRecentAnnouncementBlockNumber = ref<number>(0);
+  const mostRecentAnnouncementTimestamp = ref<number>();
+  const mostRecentAnnouncementBlockNumber = ref<number>();
   const mostRecentBlockTimestamp = ref<number>(0);
   const mostRecentBlockNumber = ref<number>(0);
 

From 22cc12626c9bd2df1f8b7f490bd7f0350687220f Mon Sep 17 00:00:00 2001
From: marcomariscal <marco.a.mariscal@gmail.com>
Date: Thu, 20 Jun 2024 14:32:01 -0700
Subject: [PATCH 09/48] fix: type check

---
 frontend/src/pages/AccountReceive.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/frontend/src/pages/AccountReceive.vue b/frontend/src/pages/AccountReceive.vue
index bb0f2494..e65c568d 100644
--- a/frontend/src/pages/AccountReceive.vue
+++ b/frontend/src/pages/AccountReceive.vue
@@ -461,7 +461,7 @@ function useScan() {
           announcementsCount += announcementsBatch.length; // Increment count
           announcementsBatch.forEach((announcement) => {
             const thisTimestamp = parseInt(announcement.timestamp);
-            if (thisTimestamp > mostRecentAnnouncementTimestamp.value) {
+            if (thisTimestamp > mostRecentAnnouncementTimestamp.value!) {
               mostRecentAnnouncementTimestamp.value = thisTimestamp;
               // Save the most recent announcement timestamp to localStorage
               if (mostRecentAnnouncementTimestampKey.value) {
@@ -469,7 +469,7 @@ function useScan() {
               }
             }
             const thisBlock = parseInt(announcement.block);
-            if (thisBlock > mostRecentAnnouncementBlockNumber.value) {
+            if (thisBlock > mostRecentAnnouncementBlockNumber.value!) {
               mostRecentAnnouncementBlockNumber.value = thisBlock;
               // Save the most recent announcement block number to localStorage
               if (mostRecentAnnouncementBlockNumberKey.value) {

From be0f63e8836f9f6fdb19b6c7cb02db5c2a0a732d Mon Sep 17 00:00:00 2001
From: marcomariscal <marco.a.mariscal@gmail.com>
Date: Fri, 21 Jun 2024 12:34:14 -0700
Subject: [PATCH 10/48] feat: handle user announcements already present and
 sign language

---
 frontend/src/i18n/locales/en-US.json  | 1 +
 frontend/src/pages/AccountReceive.vue | 7 ++++++-
 2 files changed, 7 insertions(+), 1 deletion(-)

diff --git a/frontend/src/i18n/locales/en-US.json b/frontend/src/i18n/locales/en-US.json
index 17546885..27b0d57b 100644
--- a/frontend/src/i18n/locales/en-US.json
+++ b/frontend/src/i18n/locales/en-US.json
@@ -105,6 +105,7 @@
     "receive": "Receive",
     "connect-your-wallet": "Connect your wallet to scan for received funds",
     "connect-wallet": "Connect Wallet",
+    "need-signature-lately": "Sign to scan for funds you've received lately",
     "need-signature": "This app needs your signature to scan for funds you've received",
     "scan-funds": "Click below to scan for funds you've received",
     "sign": "Sign",
diff --git a/frontend/src/pages/AccountReceive.vue b/frontend/src/pages/AccountReceive.vue
index e65c568d..1387909c 100644
--- a/frontend/src/pages/AccountReceive.vue
+++ b/frontend/src/pages/AccountReceive.vue
@@ -25,7 +25,12 @@
       <!-- Waiting for signature -->
       <div v-if="needsSignature || scanStatus === 'waiting'" class="form">
         <div v-if="needsSignature" class="text-center q-mb-md">
-          {{ $t('Receive.need-signature') }}
+          <template v-if="userAnnouncements.length">
+            {{ $t('Receive.need-signature-lately') }}
+          </template>
+          <template v-else>
+            {{ $t('Receive.need-signature') }}
+          </template>
         </div>
         <div v-else class="text-center q-mb-md">{{ $t('Receive.scan-funds') }}</div>
         <base-button

From cd9e3943c0168128484d179ea48d6513f7bb2b24 Mon Sep 17 00:00:00 2001
From: marcomariscal <marco.a.mariscal@gmail.com>
Date: Mon, 24 Jun 2024 10:54:51 -0700
Subject: [PATCH 11/48] feat: only show fetching when no user announcements

---
 frontend/src/pages/AccountReceive.vue | 12 +++++++++---
 1 file changed, 9 insertions(+), 3 deletions(-)

diff --git a/frontend/src/pages/AccountReceive.vue b/frontend/src/pages/AccountReceive.vue
index 1387909c..09b653c7 100644
--- a/frontend/src/pages/AccountReceive.vue
+++ b/frontend/src/pages/AccountReceive.vue
@@ -90,14 +90,20 @@
       </div>
 
       <!-- Scanning in progress -->
-      <div v-if="scanStatus === 'scanning' || scanStatus === 'scanning latest'" class="text-center">
+      <div
+        v-if="(scanStatus === 'scanning' || scanStatus === 'scanning latest') && !userAnnouncements.length"
+        class="text-center"
+      >
         <progress-indicator :percentage="scanPercentage" />
         <div v-if="scanStatus === 'scanning'" class="text-center text-italic">{{ $t('Receive.scanning') }}</div>
         <div v-else class="text-center text-italic">{{ $t('Receive.scanning-latest') }}</div>
         <div class="text-center text-italic q-mt-lg" v-html="$t('Receive.wait')"></div>
       </div>
 
-      <div v-else-if="scanStatus === 'fetching latest' || scanStatus === 'fetching'" class="text-center">
+      <div
+        v-else-if="(scanStatus === 'fetching latest' || scanStatus === 'fetching') && !userAnnouncements.length"
+        class="text-center"
+      >
         <loading-spinner />
         <div v-if="scanStatus === 'fetching'" class="text-center text-italic">
           {{ $t('Receive.fetching') }}
@@ -106,7 +112,7 @@
       </div>
       <div>
         <base-button
-          v-if="scanStatus != 'complete' && scanStatus != 'waiting'"
+          v-if="scanStatus !== 'complete' && scanStatus !== 'waiting' && !userAnnouncements.length"
           @click="terminateWorkers()"
           class="text-center q-pt-md"
           :label="$t('Receive.stop')"

From 1f9591d09e397dd5caf7f6cc47713f67c0bafe42 Mon Sep 17 00:00:00 2001
From: marcomariscal <marco.a.mariscal@gmail.com>
Date: Mon, 24 Jun 2024 12:23:59 -0700
Subject: [PATCH 12/48] feat: fetching latest from last fetched block component

---
 .../src/components/AccountReceiveTable.vue    | 38 ++++++++++++++++---
 frontend/src/i18n/locales/en-US.json          |  1 +
 frontend/src/pages/AccountReceive.vue         |  2 +-
 3 files changed, 35 insertions(+), 6 deletions(-)

diff --git a/frontend/src/components/AccountReceiveTable.vue b/frontend/src/components/AccountReceiveTable.vue
index 2e914f08..02c1e292 100644
--- a/frontend/src/components/AccountReceiveTable.vue
+++ b/frontend/src/components/AccountReceiveTable.vue
@@ -61,11 +61,23 @@
       </div>
 
       <div v-if="mostRecentAnnouncementBlockNumber && mostRecentAnnouncementTimestamp" class="text-caption q-mb-sm">
-        <!-- Show the most recent timestamp and block that were scanned -->
-        {{ $t('AccountReceiveTable.most-recent-announcement') }}
-        {{ mostRecentAnnouncementBlockNumber }} /
-        {{ formatDate(mostRecentAnnouncementTimestamp * 1000) }}
-        {{ formatTime(mostRecentAnnouncementTimestamp * 1000) }}
+        <!-- Container for block data and fetching status -->
+        <div class="block-data-container row items-center justify-between q-col-gutter-md">
+          <!-- Block data -->
+          <div class="block-data">
+            {{ $t('AccountReceiveTable.most-recent-announcement') }}
+            {{ mostRecentAnnouncementBlockNumber }} /
+            {{ formatDate(mostRecentAnnouncementTimestamp * 1000) }}
+            {{ formatTime(mostRecentAnnouncementTimestamp * 1000) }}
+          </div>
+
+          <!-- Fetching status -->
+          <div v-if="scanStatus !== 'complete' && scanStatus !== 'waiting'" class="fetching-status text-italic">
+            {{ $t('Receive.fetching-latest-from-last-fetched-block') }}
+            <q-spinner-dots color="primary" size="1em" class="q-ml-xs" />
+          </div>
+        </div>
+
         <div v-if="advancedMode" class="text-caption q-mb-sm">
           {{ $t('AccountReceiveTable.most-recent-mined') }}
           {{ mostRecentBlockNumber }} /
@@ -865,4 +877,20 @@ export default defineComponent({
 
 .external-link-icon
   color: transparent
+
+.block-data-container
+  @media (max-width: 599px)
+    flex-direction: column
+    align-items: flex-start
+
+  @media (min-width: 600px)
+    flex-direction: row
+
+.block-data, .fetching-status
+  @media (max-width: 599px)
+    width: 100%
+
+.fetching-status
+  @media (max-width: 599px)
+    margin-top: 0.5rem
 </style>
diff --git a/frontend/src/i18n/locales/en-US.json b/frontend/src/i18n/locales/en-US.json
index 27b0d57b..7f82533f 100644
--- a/frontend/src/i18n/locales/en-US.json
+++ b/frontend/src/i18n/locales/en-US.json
@@ -118,6 +118,7 @@
     "prv-key": "Private key",
     "fetching": "Fetching all announcements...",
     "fetching-latest": "Fetching latest 10,000 announcements...",
+    "fetching-latest-from-last-fetched-block": "Fetching latest announcements...",
     "scanning": "Scanning all announcements for funds...",
     "scanning-latest": "Scanning latest announcements for funds...",
     "wait": "This may take a couple of minutes depending on your connection and device. This is normal&mdash; please be patient.",
diff --git a/frontend/src/pages/AccountReceive.vue b/frontend/src/pages/AccountReceive.vue
index 09b653c7..51dba222 100644
--- a/frontend/src/pages/AccountReceive.vue
+++ b/frontend/src/pages/AccountReceive.vue
@@ -89,7 +89,7 @@
         />
       </div>
 
-      <!-- Scanning in progress -->
+      <!-- Scanning in progress (only shown when no user annoucnements) -->
       <div
         v-if="(scanStatus === 'scanning' || scanStatus === 'scanning latest') && !userAnnouncements.length"
         class="text-center"

From 6916958245e65469a11ad2a749ba741bf5ce279e Mon Sep 17 00:00:00 2001
From: marcomariscal <marco.a.mariscal@gmail.com>
Date: Mon, 24 Jun 2024 12:27:11 -0700
Subject: [PATCH 13/48] feat: fetching latest translation for cn

---
 frontend/src/i18n/locales/zh-CN.json | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/frontend/src/i18n/locales/zh-CN.json b/frontend/src/i18n/locales/zh-CN.json
index f225bd20..bd1be9a1 100644
--- a/frontend/src/i18n/locales/zh-CN.json
+++ b/frontend/src/i18n/locales/zh-CN.json
@@ -117,7 +117,9 @@
     "prv-key": "私钥",
     "fetching": "在获取所有的公告...",
     "fetching-latest": "在获取最新的 10，000 条公告...",
+    "fetching-latest-from-last-fetched-block": "正在获取最新公告...",
     "scanning": "在所有的公告中扫描资金...",
+
     "scanning-latest": "在最新公告中扫描资金...",
     "wait": "这可能需要几分钟，具体取决于您的连接和设备。这是正常的 — 请耐心等待。",
     "stop": "停止"

From 8cbf9b05d24ae48ae3f2be335872d0c6e6447fb6 Mon Sep 17 00:00:00 2001
From: marcomariscal <marco.a.mariscal@gmail.com>
Date: Mon, 24 Jun 2024 13:09:28 -0700
Subject: [PATCH 14/48] feat: clear local storage button and functionality

---
 frontend/src/i18n/locales/en-US.json |  2 ++
 frontend/src/i18n/locales/zh-CN.json |  2 ++
 frontend/src/layouts/BaseLayout.vue  | 28 +++++++++++++++++++++++++++-
 3 files changed, 31 insertions(+), 1 deletion(-)

diff --git a/frontend/src/i18n/locales/en-US.json b/frontend/src/i18n/locales/en-US.json
index 7f82533f..b3aa9566 100644
--- a/frontend/src/i18n/locales/en-US.json
+++ b/frontend/src/i18n/locales/en-US.json
@@ -33,6 +33,8 @@
     "contact": "Contact"
   },
   "Base-Layout": {
+    "clear-local-storage": "Clear local storage",
+    "clear-local-storage-description": "Clears all local storage data, including send history, and wallet connection.",
     "connect-wallet": "Connect Wallet",
     "settings": "Settings",
     "dark-mode": "Dark mode",
diff --git a/frontend/src/i18n/locales/zh-CN.json b/frontend/src/i18n/locales/zh-CN.json
index bd1be9a1..3188fba9 100644
--- a/frontend/src/i18n/locales/zh-CN.json
+++ b/frontend/src/i18n/locales/zh-CN.json
@@ -33,6 +33,8 @@
     "contact": "联系"
   },
   "Base-Layout": {
+    "clear-local-storage": "清除本地存储",
+    "clear-local-storage-description": "清除所有本地存储数据，包括发送历史记录和钱包连接信息。",
     "connect-wallet": "连接钱包",
     "settings": "设置",
     "dark-mode": "深色模式",
diff --git a/frontend/src/layouts/BaseLayout.vue b/frontend/src/layouts/BaseLayout.vue
index 83db2dc4..cb220e00 100644
--- a/frontend/src/layouts/BaseLayout.vue
+++ b/frontend/src/layouts/BaseLayout.vue
@@ -223,6 +223,21 @@
               option-label="label"
               rounded
             />
+
+            <!-- Clear local storage button -->
+            <div class="q-mt-md row items-center">
+              <base-button
+                @click="clearLocalStorage"
+                color="warning"
+                :label="$t('Base-Layout.clear-local-storage')"
+                :outline="true"
+                :rounded="true"
+              />
+              <base-tooltip class="q-ml-sm" icon="fas fa-question-circle">
+                {{ $t('Base-Layout.clear-local-storage-description') }}
+              </base-tooltip>
+            </div>
+
             <p class="text-caption dark-toggle" style="font-size: 0.65rem">version {{ version }}</p>
           </div>
 
@@ -291,6 +306,7 @@ import AddressSettings from './AddressSettings.vue';
 import HeaderLinks from 'src/layouts/HeaderLinks.vue';
 import NetworkDropdown from 'src/layouts/NetworkDropdown.vue';
 import { Language } from 'src/components/models';
+import { notifyUser } from 'src/utils/alerts';
 
 export default defineComponent({
   name: 'BaseLayout',
@@ -328,10 +344,21 @@ export default defineComponent({
       setLanguage(language);
       setWalletLanguage(language.value);
     };
+
+    const clearLocalStorage = () => {
+      localStorage.clear();
+      notifyUser('success', 'Local storage cleared. Reloading page...');
+      setTimeout(() => {
+        window.location.reload();
+      }, 1500);
+    };
+
     return {
       advancedMode,
       argentModalDismissed,
       avatar,
+      changeLanguage,
+      clearLocalStorage,
       currentLanguage,
       drawerRight: ref(false),
       isAccountSetup,
@@ -340,7 +367,6 @@ export default defineComponent({
       isLoading,
       language,
       network,
-      changeLanguage,
       sendHistorySave,
       showArgentModal,
       supportedLanguages,

From 5d04a36b334e392f6af41fde8dc88eebf9d9a6ea Mon Sep 17 00:00:00 2001
From: marcomariscal <marco.a.mariscal@gmail.com>
Date: Mon, 24 Jun 2024 14:42:28 -0700
Subject: [PATCH 15/48] fix: start block handling logic

---
 frontend/src/pages/AccountReceive.vue | 35 +++++++++++++++------------
 1 file changed, 20 insertions(+), 15 deletions(-)

diff --git a/frontend/src/pages/AccountReceive.vue b/frontend/src/pages/AccountReceive.vue
index 51dba222..79f1409c 100644
--- a/frontend/src/pages/AccountReceive.vue
+++ b/frontend/src/pages/AccountReceive.vue
@@ -186,9 +186,11 @@ function useScan() {
     if (lastFetchedBlockKey.value) {
       LocalStorage.getItem(lastFetchedBlockKey.value);
       const lastFetchedBlock = LocalStorage.getItem(lastFetchedBlockKey.value);
-      window.logger.debug('Last fetched block loaded and set as startBlockLocal:', lastFetchedBlock);
-      startBlockLocal.value = lastFetchedBlock ? Number(lastFetchedBlock) : undefined;
-      return lastFetchedBlock as number | undefined;
+      window.logger.debug('Last fetched block loaded:', lastFetchedBlock);
+      if (lastFetchedBlock) {
+        startBlockLocal.value = Number(lastFetchedBlock);
+        setScanBlocks(Number(lastFetchedBlock), endBlockLocal.value);
+      }
     }
 
     return undefined;
@@ -472,7 +474,7 @@ function useScan() {
           announcementsCount += announcementsBatch.length; // Increment count
           announcementsBatch.forEach((announcement) => {
             const thisTimestamp = parseInt(announcement.timestamp);
-            if (thisTimestamp > mostRecentAnnouncementTimestamp.value!) {
+            if (thisTimestamp > (mostRecentAnnouncementTimestamp.value || 0)) {
               mostRecentAnnouncementTimestamp.value = thisTimestamp;
               // Save the most recent announcement timestamp to localStorage
               if (mostRecentAnnouncementTimestampKey.value) {
@@ -480,7 +482,7 @@ function useScan() {
               }
             }
             const thisBlock = parseInt(announcement.block);
-            if (thisBlock > mostRecentAnnouncementBlockNumber.value!) {
+            if (thisBlock > (mostRecentAnnouncementBlockNumber.value || 0)) {
               mostRecentAnnouncementBlockNumber.value = thisBlock;
               // Save the most recent announcement block number to localStorage
               if (mostRecentAnnouncementBlockNumberKey.value) {
@@ -510,6 +512,9 @@ function useScan() {
 
         // Save the latest block to localStorage for future scans as the start block
         setLastFetchedBlock(latestBlock.number);
+
+        // Update startBlockLocal with the latest block number
+        startBlockLocal.value = latestBlock.number;
       }
     } catch (e) {
       scanStatus.value = 'waiting'; // reset to the default state because we were unable to fetch announcements
@@ -545,19 +550,19 @@ function useScan() {
     // Get the user announcements from local storage
     const storedAnnouncements = loadUserAnnouncements();
 
-    if (storedAnnouncements) {
-      window.logger.debug('User announcements found in local storage:', storedAnnouncements);
-      const lastFetchedBlock = loadLastFetchedBlock();
+    // Load the last fetched block
+    const lastFetchedBlock = loadLastFetchedBlock();
 
-      // If the last fetched block is not found, reset the state
-      if (!lastFetchedBlock) {
-        resetState();
-        return;
-      }
+    // Load the most recent announcement block data
+    loadUserAnnouncementBlockData();
 
-      // Make sure the start block is the last fetched block
+    if (storedAnnouncements && lastFetchedBlock) {
+      window.logger.debug('User announcements found in local storage:', storedAnnouncements);
+      startBlockLocal.value = lastFetchedBlock;
       setScanBlocks(lastFetchedBlock, endBlockLocal.value);
-      return;
+    } else {
+      // If no stored announcements or last fetched block, reset the state
+      resetState();
     }
 
     // Only reset state if the address has changed and is not undefined

From def9921718d545d7bbe303c22ba40fd6de56ddca Mon Sep 17 00:00:00 2001
From: marcomariscal <marco.a.mariscal@gmail.com>
Date: Mon, 24 Jun 2024 16:36:43 -0700
Subject: [PATCH 16/48] feat: dedupe user announcements

---
 frontend/src/pages/AccountReceive.vue | 17 ++++++++++++++---
 1 file changed, 14 insertions(+), 3 deletions(-)

diff --git a/frontend/src/pages/AccountReceive.vue b/frontend/src/pages/AccountReceive.vue
index 79f1409c..2cf9562a 100644
--- a/frontend/src/pages/AccountReceive.vue
+++ b/frontend/src/pages/AccountReceive.vue
@@ -251,6 +251,15 @@ function useScan() {
     if (userAnnouncementsLocalStorageKey.value) LocalStorage.remove(userAnnouncementsLocalStorageKey.value);
   }
 
+  function deduplicateAnnouncements(announcements: UserAnnouncement[]) {
+    const seen = new Set();
+    return announcements.filter((announcement) => {
+      const duplicate = seen.has(announcement.txHash);
+      seen.add(announcement.txHash);
+      return !duplicate;
+    });
+  }
+
   // Watch for changes in userAddress or chainId to load announcements
   watch([userAddress, chainId], () => {
     window.logger.debug('Detected change in user address or chain ID, attempting to load announcements...');
@@ -412,9 +421,11 @@ function useScan() {
             scanPercentage.value = Math.floor(percent);
           },
           (filteredAnnouncements) => {
-            userAnnouncements.value = [...userAnnouncements.value, ...filteredAnnouncements].sort(function (a, b) {
-              return parseInt(b.timestamp) - parseInt(a.timestamp);
-            });
+            userAnnouncements.value = deduplicateAnnouncements(
+              [...userAnnouncements.value, ...filteredAnnouncements].sort(function (a, b) {
+                return parseInt(b.timestamp) - parseInt(a.timestamp);
+              })
+            );
             if (scanStatus.value === 'scanning latest') scanStatus.value = 'complete latest';
             else scanStatus.value = 'complete';
             scanPercentage.value = 0;

From 3046be2390125c1bbe2881799c27d37dae0d4fb3 Mon Sep 17 00:00:00 2001
From: marcomariscal <marco.a.mariscal@gmail.com>
Date: Mon, 24 Jun 2024 16:44:31 -0700
Subject: [PATCH 17/48] fix: logic

---
 frontend/src/pages/AccountReceive.vue | 7 +++----
 1 file changed, 3 insertions(+), 4 deletions(-)

diff --git a/frontend/src/pages/AccountReceive.vue b/frontend/src/pages/AccountReceive.vue
index 2cf9562a..aa0a34de 100644
--- a/frontend/src/pages/AccountReceive.vue
+++ b/frontend/src/pages/AccountReceive.vue
@@ -190,6 +190,7 @@ function useScan() {
       if (lastFetchedBlock) {
         startBlockLocal.value = Number(lastFetchedBlock);
         setScanBlocks(Number(lastFetchedBlock), endBlockLocal.value);
+        return Number(lastFetchedBlock);
       }
     }
 
@@ -571,12 +572,10 @@ function useScan() {
       window.logger.debug('User announcements found in local storage:', storedAnnouncements);
       startBlockLocal.value = lastFetchedBlock;
       setScanBlocks(lastFetchedBlock, endBlockLocal.value);
-    } else {
-      // If no stored announcements or last fetched block, reset the state
-      resetState();
+      return;
     }
 
-    // Only reset state if the address has changed and is not undefined
+    // Only reset state if the address has changed and is not undefined, or if no announcements are found
     window.logger.debug('Resetting state for new address:', userAddress.value);
     resetState();
   });

From 1c43d4d0c25c9620856a99d8a37c93ad4a17a7f8 Mon Sep 17 00:00:00 2001
From: marcomariscal <marco.a.mariscal@gmail.com>
Date: Mon, 24 Jun 2024 17:02:51 -0700
Subject: [PATCH 18/48] fix: minimize debugging logs on userAnnouncement
 changes

---
 frontend/src/pages/AccountReceive.vue | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/frontend/src/pages/AccountReceive.vue b/frontend/src/pages/AccountReceive.vue
index aa0a34de..8b1687bc 100644
--- a/frontend/src/pages/AccountReceive.vue
+++ b/frontend/src/pages/AccountReceive.vue
@@ -306,9 +306,13 @@ function useScan() {
   });
 
   // Watch for changes in userAnnouncements and save to localStorage
-  watch(userAnnouncements, (newVal) => {
+  watch(userAnnouncements, (newVal, oldVal) => {
+    const serializedNewVal = serializeUserAnnouncements(newVal);
+    const serializedOldVal = serializeUserAnnouncements(oldVal);
+    if (serializedNewVal === serializedOldVal) return;
+
     if (userAnnouncementsLocalStorageKey.value) {
-      LocalStorage.set(userAnnouncementsLocalStorageKey.value, serializeUserAnnouncements(newVal));
+      LocalStorage.set(userAnnouncementsLocalStorageKey.value, serializedNewVal);
       window.logger.debug('Announcements updated in local storage:', newVal);
     }
   });

From c5ad0bb0e71b9b417604728aa4c2fa0e11643fd8 Mon Sep 17 00:00:00 2001
From: marcomariscal <marco.a.mariscal@gmail.com>
Date: Tue, 25 Jun 2024 10:31:30 -0700
Subject: [PATCH 19/48] feat: handle scanning latest announcements from last
 fetched block

---
 .../src/components/AccountReceiveTable.vue    | 29 ++++++++++++++++---
 frontend/src/i18n/locales/en-US.json          |  1 +
 frontend/src/i18n/locales/zh-CN.json          |  1 +
 frontend/src/pages/AccountReceive.vue         |  7 +++--
 4 files changed, 32 insertions(+), 6 deletions(-)

diff --git a/frontend/src/components/AccountReceiveTable.vue b/frontend/src/components/AccountReceiveTable.vue
index 02c1e292..91b8ab5a 100644
--- a/frontend/src/components/AccountReceiveTable.vue
+++ b/frontend/src/components/AccountReceiveTable.vue
@@ -71,10 +71,31 @@
             {{ formatTime(mostRecentAnnouncementTimestamp * 1000) }}
           </div>
 
-          <!-- Fetching status -->
-          <div v-if="scanStatus !== 'complete' && scanStatus !== 'waiting'" class="fetching-status text-italic">
-            {{ $t('Receive.fetching-latest-from-last-fetched-block') }}
-            <q-spinner-dots color="primary" size="1em" class="q-ml-xs" />
+          <!-- Status messages -->
+          <div
+            v-if="
+              ['fetching', 'fetching latest', 'scanning', 'scanning latest from last fetched block'].includes(
+                scanStatus
+              )
+            "
+            class="status-message text-italic"
+          >
+            <div v-if="scanStatus === 'fetching' || scanStatus === 'fetching latest'">
+              {{
+                scanStatus === 'fetching'
+                  ? $t('Receive.fetching')
+                  : $t('Receive.fetching-latest-from-last-fetched-block')
+              }}
+              <q-spinner-dots color="primary" size="1em" class="q-ml-xs" />
+            </div>
+            <div v-else>
+              {{
+                scanStatus === 'scanning latest from last fetched block'
+                  ? $t('Receive.scanning-latest-from-last-fetched-block')
+                  : $t('Receive.scanning')
+              }}
+              <q-spinner-dots color="primary" size="1em" class="q-ml-xs" />
+            </div>
           </div>
         </div>
 
diff --git a/frontend/src/i18n/locales/en-US.json b/frontend/src/i18n/locales/en-US.json
index b3aa9566..20101cc5 100644
--- a/frontend/src/i18n/locales/en-US.json
+++ b/frontend/src/i18n/locales/en-US.json
@@ -123,6 +123,7 @@
     "fetching-latest-from-last-fetched-block": "Fetching latest announcements...",
     "scanning": "Scanning all announcements for funds...",
     "scanning-latest": "Scanning latest announcements for funds...",
+    "scanning-latest-from-last-fetched-block": "Scanning latest announcements...",
     "wait": "This may take a couple of minutes depending on your connection and device. This is normal&mdash; please be patient.",
     "stop": "Stop"
   },
diff --git a/frontend/src/i18n/locales/zh-CN.json b/frontend/src/i18n/locales/zh-CN.json
index 3188fba9..9503273a 100644
--- a/frontend/src/i18n/locales/zh-CN.json
+++ b/frontend/src/i18n/locales/zh-CN.json
@@ -123,6 +123,7 @@
     "scanning": "在所有的公告中扫描资金...",
 
     "scanning-latest": "在最新公告中扫描资金...",
+    "scanning-latest-from-last-fetched-block": "在最新公告中扫描资金...",
     "wait": "这可能需要几分钟，具体取决于您的连接和设备。这是正常的 — 请耐心等待。",
     "stop": "停止"
   },
diff --git a/frontend/src/pages/AccountReceive.vue b/frontend/src/pages/AccountReceive.vue
index 8b1687bc..461c0b1c 100644
--- a/frontend/src/pages/AccountReceive.vue
+++ b/frontend/src/pages/AccountReceive.vue
@@ -143,6 +143,7 @@ function useScan() {
     | 'fetching latest'
     | 'scanning'
     | 'scanning latest'
+    | 'scanning latest from last fetched block'
     | 'complete'
     | 'complete latest';
   const scanStatus = ref<ScanStatus>('waiting');
@@ -391,6 +392,8 @@ function useScan() {
     // Reset paused state
     paused.value = false;
     if (!umbra.value) throw new Error('No umbra instance found. Please make sure you are on a supported network');
+
+    const isInitialScan = userAnnouncements.value.length === 0;
     scanStatus.value = 'fetching latest';
 
     // Check for manually entered private key in advancedMode, otherwise use the key from user's signature
@@ -509,7 +512,7 @@ function useScan() {
 
           announcementsQueue = [...announcementsQueue, ...announcementsBatch];
           if (announcementsCount == 10000) {
-            scanStatus.value = 'scanning latest';
+            scanStatus.value = isInitialScan ? 'scanning latest' : 'scanning latest from last fetched block';
             firstScanPromise = filterUserAnnouncementsAsync(spendingPubKey, viewingPrivKey, announcementsQueue);
             announcementsQueue = [];
           }
@@ -522,7 +525,7 @@ function useScan() {
         await firstScanPromise;
         // Clear out existing workers
         workers.length = 0;
-        scanStatus.value = 'scanning';
+        scanStatus.value = isInitialScan ? 'scanning' : 'scanning latest from last fetched block';
         await filterUserAnnouncementsAsync(spendingPubKey, viewingPrivKey, announcementsQueue);
         scanStatus.value = 'complete';
 

From 5909fb874d56ea791f19d045c4ef931760368766 Mon Sep 17 00:00:00 2001
From: marcomariscal <marco.a.mariscal@gmail.com>
Date: Tue, 25 Jun 2024 10:56:31 -0700
Subject: [PATCH 20/48] feat: sort by timestamp explicitly

---
 frontend/src/components/AccountReceiveTable.vue | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/frontend/src/components/AccountReceiveTable.vue b/frontend/src/components/AccountReceiveTable.vue
index 91b8ab5a..65e71d0b 100644
--- a/frontend/src/components/AccountReceiveTable.vue
+++ b/frontend/src/components/AccountReceiveTable.vue
@@ -571,13 +571,16 @@ function useReceivedFundsTable(userAnnouncements: Ref<UserAnnouncement[]>, spend
   // Format announcements so from addresses support ENS/CNS, and so we can easily detect withdrawals
   const formattedAnnouncements = ref([] as ReceiveTableAnnouncement[]);
 
+  const sortByTimestamp = (announcements: ReceiveTableAnnouncement[]) =>
+    announcements.sort((a, b) => Number(b.timestamp) - Number(a.timestamp));
+
   // eslint-disable-next-line @typescript-eslint/no-misused-promises
   watchEffect(async () => {
     if (userAnnouncements.value.length === 0) formattedAnnouncements.value = [];
     isLoading.value = true;
     const announcements = userAnnouncements.value as ReceiveTableAnnouncement[];
     const newAnnouncements = announcements.filter((x) => !formattedAnnouncements.value.includes(x));
-    formattedAnnouncements.value = [...formattedAnnouncements.value, ...newAnnouncements];
+    formattedAnnouncements.value = sortByTimestamp([...formattedAnnouncements.value, ...newAnnouncements]);
     // Format addresses to use ENS, CNS, or formatted address
     const fromAddresses = announcements.map((announcement) => announcement.from);
     let formattedAddresses: string[] = [];

From 9f0a3f9a81fdeb1e01ec3ac2beec73386a2c3c70 Mon Sep 17 00:00:00 2001
From: marcomariscal <marco.a.mariscal@gmail.com>
Date: Tue, 25 Jun 2024 10:58:45 -0700
Subject: [PATCH 21/48] feat: no loading sequence when there are announcements

---
 frontend/src/components/AccountReceiveTable.vue | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/frontend/src/components/AccountReceiveTable.vue b/frontend/src/components/AccountReceiveTable.vue
index 65e71d0b..bbbcdca8 100644
--- a/frontend/src/components/AccountReceiveTable.vue
+++ b/frontend/src/components/AccountReceiveTable.vue
@@ -576,8 +576,9 @@ function useReceivedFundsTable(userAnnouncements: Ref<UserAnnouncement[]>, spend
 
   // eslint-disable-next-line @typescript-eslint/no-misused-promises
   watchEffect(async () => {
-    if (userAnnouncements.value.length === 0) formattedAnnouncements.value = [];
-    isLoading.value = true;
+    const hasAnnouncements = userAnnouncements.value.length > 0;
+    if (!hasAnnouncements) formattedAnnouncements.value = [];
+    isLoading.value = !hasAnnouncements;
     const announcements = userAnnouncements.value as ReceiveTableAnnouncement[];
     const newAnnouncements = announcements.filter((x) => !formattedAnnouncements.value.includes(x));
     formattedAnnouncements.value = sortByTimestamp([...formattedAnnouncements.value, ...newAnnouncements]);

From c40d035aa8ad2d82f3f822697161c88239a2acec Mon Sep 17 00:00:00 2001
From: marcomariscal <marco.a.mariscal@gmail.com>
Date: Thu, 27 Jun 2024 11:59:30 -0700
Subject: [PATCH 22/48] fix: need sig lately verbiage

---
 frontend/src/i18n/locales/en-US.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/src/i18n/locales/en-US.json b/frontend/src/i18n/locales/en-US.json
index 20101cc5..49cfea91 100644
--- a/frontend/src/i18n/locales/en-US.json
+++ b/frontend/src/i18n/locales/en-US.json
@@ -107,7 +107,7 @@
     "receive": "Receive",
     "connect-your-wallet": "Connect your wallet to scan for received funds",
     "connect-wallet": "Connect Wallet",
-    "need-signature-lately": "Sign to scan for funds you've received lately",
+    "need-signature-lately": "Sign to scan for recently received funds or to withdraw funds",
     "need-signature": "This app needs your signature to scan for funds you've received",
     "scan-funds": "Click below to scan for funds you've received",
     "sign": "Sign",

From 8a90bc78cd8345535f9aca516d6fb2451400e5e9 Mon Sep 17 00:00:00 2001
From: marcomariscal <marco.a.mariscal@gmail.com>
Date: Thu, 27 Jun 2024 11:59:52 -0700
Subject: [PATCH 23/48] fix: add need sig lately to cn

---
 frontend/src/i18n/locales/zh-CN.json | 1 +
 1 file changed, 1 insertion(+)

diff --git a/frontend/src/i18n/locales/zh-CN.json b/frontend/src/i18n/locales/zh-CN.json
index 9503273a..deddc5a1 100644
--- a/frontend/src/i18n/locales/zh-CN.json
+++ b/frontend/src/i18n/locales/zh-CN.json
@@ -108,6 +108,7 @@
     "connect-your-wallet": "连接您的钱包以扫描收到的资金",
     "connect-wallet": "链接钱包",
     "need-signature": "此应用程序需要您的签名才能扫描您收到的资金",
+    "need-signature-lately": "签名以扫描最近收到的资金或提取资金",
     "scan-funds": "点击下方来扫描您收到的资金",
     "sign": "签名",
     "scan": "扫描",

From f39c807e9af16807b5c4bc7a75697ac8fb82c295 Mon Sep 17 00:00:00 2001
From: marcomariscal <marco.a.mariscal@gmail.com>
Date: Thu, 27 Jun 2024 12:42:02 -0700
Subject: [PATCH 24/48] fix: little more mb

---
 frontend/src/pages/AccountReceive.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/src/pages/AccountReceive.vue b/frontend/src/pages/AccountReceive.vue
index 461c0b1c..9ccc7b13 100644
--- a/frontend/src/pages/AccountReceive.vue
+++ b/frontend/src/pages/AccountReceive.vue
@@ -35,7 +35,7 @@
         <div v-else class="text-center q-mb-md">{{ $t('Receive.scan-funds') }}</div>
         <base-button
           @click="getPrivateKeysHandler"
-          class="text-center q-mb-md"
+          class="text-center q-mb-lg"
           :label="needsSignature ? $t('Receive.sign') : $t('Receive.scan')"
         />
 

From aca5dc535a200ef696fa660c29310cd0af67471a Mon Sep 17 00:00:00 2001
From: marcomariscal <marco.a.mariscal@gmail.com>
Date: Fri, 28 Jun 2024 12:14:39 -0700
Subject: [PATCH 25/48] fix: no withdraw verbiage on need-sig-lately

---
 frontend/src/i18n/locales/en-US.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/src/i18n/locales/en-US.json b/frontend/src/i18n/locales/en-US.json
index 49cfea91..a7f7e869 100644
--- a/frontend/src/i18n/locales/en-US.json
+++ b/frontend/src/i18n/locales/en-US.json
@@ -107,7 +107,7 @@
     "receive": "Receive",
     "connect-your-wallet": "Connect your wallet to scan for received funds",
     "connect-wallet": "Connect Wallet",
-    "need-signature-lately": "Sign to scan for recently received funds or to withdraw funds",
+    "need-signature-lately": "Sign to scan for recently received funds",
     "need-signature": "This app needs your signature to scan for funds you've received",
     "scan-funds": "Click below to scan for funds you've received",
     "sign": "Sign",

From 29f6f6ecf25f892f33e0f4e8d027852ecf78c72a Mon Sep 17 00:00:00 2001
From: marcomariscal <marco.a.mariscal@gmail.com>
Date: Fri, 28 Jun 2024 16:31:15 -0700
Subject: [PATCH 26/48] feat: handle need sig

---
 frontend/src/components/WithdrawForm.vue | 7 +++++--
 frontend/src/i18n/locales/en-US.json     | 1 +
 frontend/src/i18n/locales/zh-CN.json     | 1 +
 frontend/src/store/wallet.ts             | 3 ++-
 4 files changed, 9 insertions(+), 3 deletions(-)

diff --git a/frontend/src/components/WithdrawForm.vue b/frontend/src/components/WithdrawForm.vue
index 3659e3da..ec0f52f1 100644
--- a/frontend/src/components/WithdrawForm.vue
+++ b/frontend/src/components/WithdrawForm.vue
@@ -18,8 +18,8 @@
             emit('initializeWithdraw');
             setIsInWithdrawFlow(true);
           "
-          :appendButtonLabel="$t('WithdrawForm.withdraw')"
-          :appendButtonDisable="isInWithdrawFlow || isFeeLoading"
+          :appendButtonLabel="needSignature ? $t('WithdrawForm.need-signature') : $t('WithdrawForm.withdraw')"
+          :appendButtonDisable="isInWithdrawFlow || isFeeLoading || needSignature"
           :appendButtonLoading="isInWithdrawFlow"
           :disable="isInWithdrawFlow"
           :label="$t('WithdrawForm.address')"
@@ -119,11 +119,13 @@ export default defineComponent({
     advancedMode: {
       type: Boolean,
       required: true,
+      default: true,
     },
   },
   setup(data, { emit }) {
     const { NATIVE_TOKEN } = useWalletStore();
     const { setIsInWithdrawFlow, isInWithdrawFlow } = useStatusesStore();
+    const { needSignature } = useWalletStore();
     const content = ref<string>(data.destinationAddress || '');
     const nativeTokenSymbol = NATIVE_TOKEN.value.symbol;
 
@@ -138,6 +140,7 @@ export default defineComponent({
       emitUpdateDestinationAddress,
       content,
       nativeTokenSymbol,
+      needSignature,
       isInWithdrawFlow,
       setIsInWithdrawFlow,
     };
diff --git a/frontend/src/i18n/locales/en-US.json b/frontend/src/i18n/locales/en-US.json
index a7f7e869..0b458090 100644
--- a/frontend/src/i18n/locales/en-US.json
+++ b/frontend/src/i18n/locales/en-US.json
@@ -358,6 +358,7 @@
     "view-on-explorer": "View on explorer"
   },
   "WithdrawForm": {
+    "need-signature": "Need Signature",
     "withdraw-address": "Enter address to withdraw funds to",
     "address": "Address",
     "fetching-fee-estimate": "Fetching fee estimate...",
diff --git a/frontend/src/i18n/locales/zh-CN.json b/frontend/src/i18n/locales/zh-CN.json
index deddc5a1..def367d0 100644
--- a/frontend/src/i18n/locales/zh-CN.json
+++ b/frontend/src/i18n/locales/zh-CN.json
@@ -357,6 +357,7 @@
     "view-on-explorer": "在区块链浏览器上查看"
   },
   "WithdrawForm": {
+    "need-signature": "此应用程序需要您的签名才能扫描您收到的资金",
     "withdraw-address": "输入提款地址",
     "address": "地址",
     "fetching-fee-estimate": "在接收费用估计...",
diff --git a/frontend/src/store/wallet.ts b/frontend/src/store/wallet.ts
index 5fbb3f6d..e886d120 100644
--- a/frontend/src/store/wallet.ts
+++ b/frontend/src/store/wallet.ts
@@ -592,7 +592,7 @@ export default function useWalletStore() {
     // "Direct" properties, i.e. return them directly without modification
     balances: computed(() => balances.value),
     stealthKeyRegistry: computed(() => stealthKeyRegistry.value),
-    hasKeys: computed(() => spendingKeyPair.value?.privateKeyHex && viewingKeyPair.value?.privateKeyHex),
+    hasKeys: computed(() => !!spendingKeyPair.value?.privateKeyHex && !!viewingKeyPair.value?.privateKeyHex),
     network: computed(() => network.value),
     isAccountSetup: computed(() => isAccountSetup.value),
     isAccountSetupLegacy: computed(() => hasEnsKeys.value || hasCnsKeys.value), // LEGACY
@@ -615,6 +615,7 @@ export default function useWalletStore() {
     tokens: computed(() => tokens.value),
     userDisplayName: computed(() => userDisplayName.value),
     connectedWalletLabel: computed(() => lastWallet),
+    needSignature: computed(() =>  !spendingKeyPair.value?.privateKeyHex || !viewingKeyPair.value?.privateKeyHex),
   };
 }
 

From 44c53b3165ccbb7972cef6051bd84e853e8af075 Mon Sep 17 00:00:00 2001
From: marcomariscal <42938673+marcomariscal@users.noreply.github.com>
Date: Mon, 8 Jul 2024 10:07:15 -0700
Subject: [PATCH 27/48] Update frontend/src/i18n/locales/en-US.json

Co-authored-by: Gary Ghayrat <61768337+garyghayrat@users.noreply.github.com>
---
 frontend/src/i18n/locales/en-US.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/src/i18n/locales/en-US.json b/frontend/src/i18n/locales/en-US.json
index 0b458090..a238e011 100644
--- a/frontend/src/i18n/locales/en-US.json
+++ b/frontend/src/i18n/locales/en-US.json
@@ -34,7 +34,7 @@
   },
   "Base-Layout": {
     "clear-local-storage": "Clear local storage",
-    "clear-local-storage-description": "Clears all local storage data, including send history, and wallet connection.",
+    "clear-local-storage-description": "Clears all local storage data, including send history, announcements, and wallet connection.",
     "connect-wallet": "Connect Wallet",
     "settings": "Settings",
     "dark-mode": "Dark mode",

From a211d4623617bfc752678eda2025280753219958 Mon Sep 17 00:00:00 2001
From: marcomariscal <marco.a.mariscal@gmail.com>
Date: Mon, 8 Jul 2024 13:22:46 -0700
Subject: [PATCH 28/48] feat: handle sign button instead of needs sig

---
 frontend/src/components/WithdrawForm.vue | 51 +++++++++++++++++++-----
 frontend/src/i18n/locales/en-US.json     |  2 +-
 frontend/src/i18n/locales/zh-CN.json     |  2 +-
 3 files changed, 42 insertions(+), 13 deletions(-)

diff --git a/frontend/src/components/WithdrawForm.vue b/frontend/src/components/WithdrawForm.vue
index ec0f52f1..2dba5ccb 100644
--- a/frontend/src/components/WithdrawForm.vue
+++ b/frontend/src/components/WithdrawForm.vue
@@ -14,17 +14,14 @@
         <base-input
           v-model="content"
           @update:modelValue="emitUpdateDestinationAddress"
-          @click="
-            emit('initializeWithdraw');
-            setIsInWithdrawFlow(true);
-          "
+          @click="handleSubmit"
           :appendButtonLabel="needSignature ? $t('WithdrawForm.need-signature') : $t('WithdrawForm.withdraw')"
-          :appendButtonDisable="isInWithdrawFlow || isFeeLoading || needSignature"
+          :appendButtonDisable="isInWithdrawFlow || isFeeLoading || isSigningInProgress"
           :appendButtonLoading="isInWithdrawFlow"
           :disable="isInWithdrawFlow"
           :label="$t('WithdrawForm.address')"
           lazy-rules
-          :rules="(val) => (val && val.length > 4) || $t('WithdrawForm.enter-valid-address')"
+          :rules="(val: string | null) => (val && val.length > 4) || $t('WithdrawForm.enter-valid-address')"
         />
         <!-- Fee estimate -->
         <div class="q-mb-lg">
@@ -123,25 +120,57 @@ export default defineComponent({
     },
   },
   setup(data, { emit }) {
-    const { NATIVE_TOKEN } = useWalletStore();
+    const { NATIVE_TOKEN, getPrivateKeys } = useWalletStore();
     const { setIsInWithdrawFlow, isInWithdrawFlow } = useStatusesStore();
     const { needSignature } = useWalletStore();
     const content = ref<string>(data.destinationAddress || '');
     const nativeTokenSymbol = NATIVE_TOKEN.value.symbol;
+    const isSigningInProgress = ref(false);
 
     function emitUpdateDestinationAddress(val: string) {
       emit('updateDestinationAddress', val);
     }
 
+    function initializeWithdraw() {
+      // Simple validation
+      if (!content.value || content.value.length <= 4) return;
+
+      emit('initializeWithdraw');
+      setIsInWithdrawFlow(true);
+    }
+
+    async function handleSubmit() {
+      if (needSignature.value) {
+        try {
+          isSigningInProgress.value = true;
+          const success = await getPrivateKeys();
+          if (success === 'denied') {
+            console.log('User denied signature request');
+            isSigningInProgress.value = false;
+            return;
+          }
+          initializeWithdraw();
+        } catch (error) {
+          console.error('Error getting private keys:', error);
+        } finally {
+          isSigningInProgress.value = false;
+        }
+      } else {
+        initializeWithdraw();
+      }
+    }
+
     return {
-      formatUnits,
-      humanizeTokenAmount,
+      content,
       emit,
       emitUpdateDestinationAddress,
-      content,
+      formatUnits,
+      handleSubmit,
+      humanizeTokenAmount,
+      isInWithdrawFlow,
+      isSigningInProgress,
       nativeTokenSymbol,
       needSignature,
-      isInWithdrawFlow,
       setIsInWithdrawFlow,
     };
   },
diff --git a/frontend/src/i18n/locales/en-US.json b/frontend/src/i18n/locales/en-US.json
index a238e011..e0758cd6 100644
--- a/frontend/src/i18n/locales/en-US.json
+++ b/frontend/src/i18n/locales/en-US.json
@@ -358,7 +358,7 @@
     "view-on-explorer": "View on explorer"
   },
   "WithdrawForm": {
-    "need-signature": "Need Signature",
+    "need-signature": "Sign",
     "withdraw-address": "Enter address to withdraw funds to",
     "address": "Address",
     "fetching-fee-estimate": "Fetching fee estimate...",
diff --git a/frontend/src/i18n/locales/zh-CN.json b/frontend/src/i18n/locales/zh-CN.json
index def367d0..6234d9e8 100644
--- a/frontend/src/i18n/locales/zh-CN.json
+++ b/frontend/src/i18n/locales/zh-CN.json
@@ -357,7 +357,7 @@
     "view-on-explorer": "在区块链浏览器上查看"
   },
   "WithdrawForm": {
-    "need-signature": "此应用程序需要您的签名才能扫描您收到的资金",
+    "need-signature": "签名",
     "withdraw-address": "输入提款地址",
     "address": "地址",
     "fetching-fee-estimate": "在接收费用估计...",

From e39a6900fb57dfa76d1764b7ec2ff7d64683135f Mon Sep 17 00:00:00 2001
From: marcomariscal <42938673+marcomariscal@users.noreply.github.com>
Date: Mon, 8 Jul 2024 13:23:19 -0700
Subject: [PATCH 29/48] Update frontend/src/i18n/locales/zh-CN.json

Co-authored-by: Gary Ghayrat <61768337+garyghayrat@users.noreply.github.com>
---
 frontend/src/i18n/locales/zh-CN.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/src/i18n/locales/zh-CN.json b/frontend/src/i18n/locales/zh-CN.json
index 6234d9e8..76a27944 100644
--- a/frontend/src/i18n/locales/zh-CN.json
+++ b/frontend/src/i18n/locales/zh-CN.json
@@ -34,7 +34,7 @@
   },
   "Base-Layout": {
     "clear-local-storage": "清除本地存储",
-    "clear-local-storage-description": "清除所有本地存储数据，包括发送历史记录和钱包连接信息。",
+    "clear-local-storage-description": "清除所有本地存储数据，包括发送历史记录，公告，和钱包连接信息。",
     "connect-wallet": "连接钱包",
     "settings": "设置",
     "dark-mode": "深色模式",

From ba09324b2bb07d4115de28ac9bcbe3dcf9f07ec1 Mon Sep 17 00:00:00 2001
From: marcomariscal <marco.a.mariscal@gmail.com>
Date: Mon, 8 Jul 2024 13:25:10 -0700
Subject: [PATCH 30/48] fix: move local storage clear button above lang

---
 frontend/src/layouts/BaseLayout.vue | 28 ++++++++++++++--------------
 1 file changed, 14 insertions(+), 14 deletions(-)

diff --git a/frontend/src/layouts/BaseLayout.vue b/frontend/src/layouts/BaseLayout.vue
index cb220e00..d2a5f5bf 100644
--- a/frontend/src/layouts/BaseLayout.vue
+++ b/frontend/src/layouts/BaseLayout.vue
@@ -208,6 +208,20 @@
               </span>
             </p>
 
+            <!-- Clear local storage button -->
+            <div class="q-mt-md row items-center">
+              <base-button
+                @click="clearLocalStorage"
+                color="warning"
+                :label="$t('Base-Layout.clear-local-storage')"
+                :outline="true"
+                :rounded="true"
+              />
+              <base-tooltip class="q-ml-sm" icon="fas fa-question-circle">
+                {{ $t('Base-Layout.clear-local-storage-description') }}
+              </base-tooltip>
+            </div>
+
             <!-- Language selection -->
             <base-select
               class="language-selector"
@@ -224,20 +238,6 @@
               rounded
             />
 
-            <!-- Clear local storage button -->
-            <div class="q-mt-md row items-center">
-              <base-button
-                @click="clearLocalStorage"
-                color="warning"
-                :label="$t('Base-Layout.clear-local-storage')"
-                :outline="true"
-                :rounded="true"
-              />
-              <base-tooltip class="q-ml-sm" icon="fas fa-question-circle">
-                {{ $t('Base-Layout.clear-local-storage-description') }}
-              </base-tooltip>
-            </div>
-
             <p class="text-caption dark-toggle" style="font-size: 0.65rem">version {{ version }}</p>
           </div>
 

From a72ff26f40e576630de8b78bfc4417ebb4fdfb26 Mon Sep 17 00:00:00 2001
From: marcomariscal <marco.a.mariscal@gmail.com>
Date: Mon, 8 Jul 2024 20:13:36 -0700
Subject: [PATCH 31/48] fix: spacing more uniform

---
 frontend/src/components/AccountReceiveTable.vue | 2 +-
 frontend/src/pages/AccountReceive.vue           | 8 ++++----
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/frontend/src/components/AccountReceiveTable.vue b/frontend/src/components/AccountReceiveTable.vue
index bbbcdca8..2f8de166 100644
--- a/frontend/src/components/AccountReceiveTable.vue
+++ b/frontend/src/components/AccountReceiveTable.vue
@@ -60,7 +60,7 @@
         >.
       </div>
 
-      <div v-if="mostRecentAnnouncementBlockNumber && mostRecentAnnouncementTimestamp" class="text-caption q-mb-sm">
+      <div v-if="mostRecentAnnouncementBlockNumber && mostRecentAnnouncementTimestamp" class="text-caption q-mb-md">
         <!-- Container for block data and fetching status -->
         <div class="block-data-container row items-center justify-between q-col-gutter-md">
           <!-- Block data -->
diff --git a/frontend/src/pages/AccountReceive.vue b/frontend/src/pages/AccountReceive.vue
index 9ccc7b13..f5c631ed 100644
--- a/frontend/src/pages/AccountReceive.vue
+++ b/frontend/src/pages/AccountReceive.vue
@@ -1,6 +1,6 @@
 <template>
   <q-page padding>
-    <h2 class="page-title">{{ $t('Receive.receive') }}</h2>
+    <h2 class="send-page-title">{{ $t('Receive.receive') }}</h2>
     <!-- User has not connected wallet  -->
     <div v-if="!userAddress">
       <p class="text-center">{{ $t('Receive.connect-your-wallet') }}</p>
@@ -24,7 +24,7 @@
     <div v-else-if="userAddress" class="q-mx-auto" style="max-width: 800px">
       <!-- Waiting for signature -->
       <div v-if="needsSignature || scanStatus === 'waiting'" class="form">
-        <div v-if="needsSignature" class="text-center q-mb-md">
+        <div v-if="needsSignature" class="text-center q-my-md">
           <template v-if="userAnnouncements.length">
             {{ $t('Receive.need-signature-lately') }}
           </template>
@@ -35,12 +35,12 @@
         <div v-else class="text-center q-mb-md">{{ $t('Receive.scan-funds') }}</div>
         <base-button
           @click="getPrivateKeysHandler"
-          class="text-center q-mb-lg"
+          class="text-center q-my-md"
           :label="needsSignature ? $t('Receive.sign') : $t('Receive.scan')"
         />
 
         <!-- Advanced mode settings -->
-        <q-card v-if="advancedMode" class="q-pt-md q-px-md q-mt-xl">
+        <q-card v-if="advancedMode" class="q-pt-md q-px-md q-my-md">
           <q-card-section class="text-center text-primary text-h6 header-black q-pb-none">
             {{ $t('Receive.scan-settings') }}
           </q-card-section>

From d8b730b65a142fcd8beb5712d29c081a3c546a2b Mon Sep 17 00:00:00 2001
From: marcomariscal <marco.a.mariscal@gmail.com>
Date: Mon, 8 Jul 2024 20:48:39 -0700
Subject: [PATCH 32/48] fix: use computed ref as param, and set
 setIsInWithdrawFlow to false on mount

---
 frontend/src/components/AccountReceiveTable.vue | 12 ++++++++----
 1 file changed, 8 insertions(+), 4 deletions(-)

diff --git a/frontend/src/components/AccountReceiveTable.vue b/frontend/src/components/AccountReceiveTable.vue
index 2f8de166..2aec820e 100644
--- a/frontend/src/components/AccountReceiveTable.vue
+++ b/frontend/src/components/AccountReceiveTable.vue
@@ -414,7 +414,7 @@
 </template>
 
 <script lang="ts">
-import { computed, defineComponent, watch, PropType, ref, watchEffect, Ref } from 'vue';
+import { computed, defineComponent, watch, PropType, ref, watchEffect, Ref, ComputedRef, onMounted } from 'vue';
 import { copyToClipboard } from 'quasar';
 import { BigNumber, Contract, joinSignature, formatUnits, TransactionResponse, Web3Provider } from 'src/utils/ethers';
 import { Umbra, UserAnnouncement, KeyPair, utils } from '@umbracash/umbra-js';
@@ -490,7 +490,7 @@ interface ReceiveTableAnnouncement extends UserAnnouncement {
   formattedFrom: string;
 }
 
-function useReceivedFundsTable(userAnnouncements: Ref<UserAnnouncement[]>, spendingKeyPair: KeyPair) {
+function useReceivedFundsTable(userAnnouncements: Ref<UserAnnouncement[]>, spendingKeyPair: ComputedRef<KeyPair>) {
   const { NATIVE_TOKEN, network, provider, signer, umbra, userAddress, relayer, tokens } = useWalletStore();
   const { setIsInWithdrawFlow } = useStatusesStore();
   const paginationConfig = { rowsPerPage: 25 };
@@ -709,7 +709,7 @@ function useReceivedFundsTable(userAnnouncements: Ref<UserAnnouncement[]>, spend
     // Get token info, stealth private key, and destination (acceptor) address
     const announcement = activeAnnouncement.value;
     const token = getTokenInfo(announcement.token);
-    const stealthKeyPair = spendingKeyPair.mulPrivateKey(announcement.randomNumber);
+    const stealthKeyPair = spendingKeyPair.value.mulPrivateKey(announcement.randomNumber);
     const spendingPrivateKey = stealthKeyPair.privateKeyHex as string;
     const acceptor = await toAddress(destinationAddress.value, provider.value);
     await utils.assertSupportedAddress(acceptor);
@@ -870,6 +870,10 @@ export default defineComponent({
       }
     );
 
+    onMounted(() => {
+      setIsInWithdrawFlow(false);
+    });
+
     return {
       advancedMode,
       context,
@@ -881,7 +885,7 @@ export default defineComponent({
       userAnnouncements,
       setIsInWithdrawFlow,
       ...useAdvancedFeatures(spendingKeyPair.value),
-      ...useReceivedFundsTable(userAnnouncements, spendingKeyPair.value),
+      ...useReceivedFundsTable(userAnnouncements, spendingKeyPair),
     };
   },
 });

From 5d63f2a6a20968be854e2b8e2b58cc2bef5be880 Mon Sep 17 00:00:00 2001
From: marcomariscal <marco.a.mariscal@gmail.com>
Date: Tue, 9 Jul 2024 11:49:31 -0700
Subject: [PATCH 33/48] feat: sign and withdraw

---
 frontend/src/i18n/locales/en-US.json | 2 +-
 frontend/src/i18n/locales/zh-CN.json | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/frontend/src/i18n/locales/en-US.json b/frontend/src/i18n/locales/en-US.json
index e0758cd6..00cb6d0d 100644
--- a/frontend/src/i18n/locales/en-US.json
+++ b/frontend/src/i18n/locales/en-US.json
@@ -358,7 +358,7 @@
     "view-on-explorer": "View on explorer"
   },
   "WithdrawForm": {
-    "need-signature": "Sign",
+    "need-signature": "Sign and Withdraw",
     "withdraw-address": "Enter address to withdraw funds to",
     "address": "Address",
     "fetching-fee-estimate": "Fetching fee estimate...",
diff --git a/frontend/src/i18n/locales/zh-CN.json b/frontend/src/i18n/locales/zh-CN.json
index 76a27944..e43ed368 100644
--- a/frontend/src/i18n/locales/zh-CN.json
+++ b/frontend/src/i18n/locales/zh-CN.json
@@ -357,7 +357,7 @@
     "view-on-explorer": "在区块链浏览器上查看"
   },
   "WithdrawForm": {
-    "need-signature": "签名",
+    "need-signature": "签名并提取",
     "withdraw-address": "输入提款地址",
     "address": "地址",
     "fetching-fee-estimate": "在接收费用估计...",

From dcd0ab247709d6d146d0cc808f6d69b0dbc56c52 Mon Sep 17 00:00:00 2001
From: marcomariscal <42938673+marcomariscal@users.noreply.github.com>
Date: Tue, 9 Jul 2024 11:51:14 -0700
Subject: [PATCH 34/48] fix: contract periphery tests (#688)

* fix: explicitly sort the tokens by addr

* fix: use vm.computeCreateAddress

* fix: mirror test sender params

* fix: use actual owner

* fix: add back gnosis

* Remove all reference to INFURA_ID (#687)

---------

Co-authored-by: John Feras <jferas@ferasinfotech.com>
---
 .github/workflows/ci.yaml                     |  1 -
 contracts-core/.env.example                   |  1 -
 contracts-periphery/Makefile                  |  2 +-
 .../script/ApproveBatchSendTokens.s.sol       |  3 +-
 .../script/DeployBatchSend.s.sol              |  2 +-
 .../test/ApproveBatchSendTokens.t.sol         |  8 +++-
 .../test/DeployBatchSend.t.sol                |  2 +-
 contracts-periphery/test/UmbraBatchSend.t.sol | 14 ++++++
 frontend/.env.example                         |  1 -
 umbra-js/.env.example                         |  1 -
 umbra-js/hardhat.config.ts                    | 11 ++---
 umbra-js/test/cns.test.ts                     |  8 ++--
 umbra-js/test/utils.test.ts                   | 44 +++++++++++--------
 13 files changed, 59 insertions(+), 39 deletions(-)

diff --git a/.github/workflows/ci.yaml b/.github/workflows/ci.yaml
index 375b1173..630cdb46 100644
--- a/.github/workflows/ci.yaml
+++ b/.github/workflows/ci.yaml
@@ -28,7 +28,6 @@ env:
   GNOSIS_CHAIN_RPC_URL: ${{ secrets.GNOSIS_CHAIN_RPC_URL }}
   BASE_RPC_URL: $${{ secrets.BASE_RPC_URL }}
   FOUNDRY_PROFILE: ci
-  INFURA_ID: ${{ secrets.INFURA_ID }}
   WALLET_CONNECT_PROJECT_ID: ${{ secrets.WALLET_CONNECT_PROJECT_ID }}
 
 jobs:
diff --git a/contracts-core/.env.example b/contracts-core/.env.example
index 4777fb8b..b7951bc4 100644
--- a/contracts-core/.env.example
+++ b/contracts-core/.env.example
@@ -1,4 +1,3 @@
-INFURA_ID=zzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzz
 MNEMONIC=here is where your twelve words mnemonic should be put my friend
 DEPLOY_GSN=false
 ETHERSCAN_VERIFICATION_API_KEY="YOUR_API_KEY"
diff --git a/contracts-periphery/Makefile b/contracts-periphery/Makefile
index 4d626295..87a435aa 100644
--- a/contracts-periphery/Makefile
+++ b/contracts-periphery/Makefile
@@ -13,4 +13,4 @@ install :; $(INSTALL_CMD)
 test :; forge test --sender 0x4f78F7f3482D9f1790649f9DD18Eec5A1Cc70F86 --no-match-contract ApproveBatchSendTokensTest
 test-gas :; forge test --match-path *.gas.t.sol
 snapshot-gas :; forge test --match-path *.gas.t.sol --gas-report > snapshot/.gas
-coverage :; forge coverage --report lcov --report summary && sed -i'.bak' 's/SF:/SF:contracts-periphery\//gI' lcov.info
+coverage :; forge coverage --sender 0x4f78F7f3482D9f1790649f9DD18Eec5A1Cc70F86 --report lcov --report summary && sed -i'.bak' 's/SF:/SF:contracts-periphery\//gI' lcov.info
diff --git a/contracts-periphery/script/ApproveBatchSendTokens.s.sol b/contracts-periphery/script/ApproveBatchSendTokens.s.sol
index 0ce27a10..5f29461a 100644
--- a/contracts-periphery/script/ApproveBatchSendTokens.s.sol
+++ b/contracts-periphery/script/ApproveBatchSendTokens.s.sol
@@ -7,11 +7,12 @@ import {UmbraBatchSend} from "src/UmbraBatchSend.sol";
 
 contract ApproveBatchSendTokens is Script {
   function run(
+    address _owner,
     address _umbraContractAddress,
     address _batchSendContractAddress,
     address[] calldata _tokenAddressesToApprove
   ) public {
-    vm.startBroadcast();
+    vm.startBroadcast(_owner);
     for (uint256 _i = 0; _i < _tokenAddressesToApprove.length; _i++) {
       uint256 _currentAllowance = IERC20(_tokenAddressesToApprove[_i]).allowance(
         _batchSendContractAddress, _umbraContractAddress
diff --git a/contracts-periphery/script/DeployBatchSend.s.sol b/contracts-periphery/script/DeployBatchSend.s.sol
index 31ead2d4..d840a5d5 100644
--- a/contracts-periphery/script/DeployBatchSend.s.sol
+++ b/contracts-periphery/script/DeployBatchSend.s.sol
@@ -30,7 +30,7 @@ contract DeployBatchSend is Script {
   /// @notice Deploy the contract to the list of networks,
   function run() public {
     // Compute the address the contract will be deployed to
-    address expectedContractAddress = computeCreateAddress(msg.sender, EXPECTED_NONCE);
+    address expectedContractAddress = vm.computeCreateAddress(msg.sender, EXPECTED_NONCE);
     console2.log("Expected contract address: %s", expectedContractAddress);
 
     // Turn off fallback to default RPC URLs since they can be flaky.
diff --git a/contracts-periphery/test/ApproveBatchSendTokens.t.sol b/contracts-periphery/test/ApproveBatchSendTokens.t.sol
index cd7c29a0..db28cd58 100644
--- a/contracts-periphery/test/ApproveBatchSendTokens.t.sol
+++ b/contracts-periphery/test/ApproveBatchSendTokens.t.sol
@@ -17,6 +17,7 @@ contract ApproveBatchSendTokensTest is Test {
   address constant WBTC_ADDRESS = 0x2260FAC5E5542a773Aa44fBCfeDf7C193bc2C599;
   address[] tokensToApprove =
     [DAI_ADDRESS, LUSD_ADDRESS, RAI_ADDRESS, USDC_ADDRESS, USDT_ADDRESS, WBTC_ADDRESS];
+  address owner = 0xB7EE870E2c49B2DEEe70003519cF056247Aac3D4;
 
   function setUp() public {
     vm.createSelectFork(vm.rpcUrl("mainnet"), 18_428_858);
@@ -27,7 +28,10 @@ contract ApproveBatchSendTokensTest is Test {
     address[] memory tokenAddressesToApprove = new address[](1);
     tokenAddressesToApprove[0] = DAI_ADDRESS;
     approveTokensScript.run(
-      umbraContractAddressOnMainnet, batchSendContractAddressOnMainnet, tokenAddressesToApprove
+      owner,
+      umbraContractAddressOnMainnet,
+      batchSendContractAddressOnMainnet,
+      tokenAddressesToApprove
     );
 
     assertEq(
@@ -40,7 +44,7 @@ contract ApproveBatchSendTokensTest is Test {
 
   function test_ApproveMultipleTokens() public {
     approveTokensScript.run(
-      umbraContractAddressOnMainnet, batchSendContractAddressOnMainnet, tokensToApprove
+      owner, umbraContractAddressOnMainnet, batchSendContractAddressOnMainnet, tokensToApprove
     );
 
     for (uint256 _i; _i < tokensToApprove.length; _i++) {
diff --git a/contracts-periphery/test/DeployBatchSend.t.sol b/contracts-periphery/test/DeployBatchSend.t.sol
index aeb185f3..4fd04797 100644
--- a/contracts-periphery/test/DeployBatchSend.t.sol
+++ b/contracts-periphery/test/DeployBatchSend.t.sol
@@ -14,7 +14,7 @@ contract DeployBatchSendTest is DeployBatchSend, Test {
   bytes batchSendCode;
 
   function setUp() public {
-    expectedContractAddress = computeCreateAddress(sender, EXPECTED_NONCE);
+    expectedContractAddress = vm.computeCreateAddress(sender, EXPECTED_NONCE);
     umbraBatchSendTest = new UmbraBatchSend(IUmbra(UMBRA));
     batchSendCode = address(umbraBatchSendTest).code;
   }
diff --git a/contracts-periphery/test/UmbraBatchSend.t.sol b/contracts-periphery/test/UmbraBatchSend.t.sol
index 65f1b602..25eb3c20 100644
--- a/contracts-periphery/test/UmbraBatchSend.t.sol
+++ b/contracts-periphery/test/UmbraBatchSend.t.sol
@@ -20,6 +20,18 @@ abstract contract UmbraBatchSendTest is DeployUmbraTest {
   error NotSorted();
   error TooMuchEthSent();
 
+  function _sortSendDataByToken(UmbraBatchSend.SendData[] storage arr) internal {
+    for (uint256 i = 0; i < arr.length - 1; i++) {
+      for (uint256 j = 0; j < arr.length - i - 1; j++) {
+        if (arr[j].tokenAddr > arr[j + 1].tokenAddr) {
+          UmbraBatchSend.SendData memory temp = arr[j];
+          arr[j] = arr[j + 1];
+          arr[j + 1] = temp;
+        }
+      }
+    }
+  }
+
   function setUp() public virtual override {
     super.setUp();
     router = new UmbraBatchSend(IUmbra(address(umbra)));
@@ -94,6 +106,8 @@ abstract contract UmbraBatchSendTest is DeployUmbraTest {
     sendData.push(UmbraBatchSend.SendData(alice, address(token), amount, pkx, ciphertext));
     sendData.push(UmbraBatchSend.SendData(bob, address(token), amount2, pkx, ciphertext));
 
+    _sortSendDataByToken(sendData);
+
     uint256 totalToll = toll * sendData.length;
     token.approve(address(router), totalAmount);
     token2.approve(address(router), totalAmount2);
diff --git a/frontend/.env.example b/frontend/.env.example
index ee9dccc1..3062ba0b 100644
--- a/frontend/.env.example
+++ b/frontend/.env.example
@@ -3,7 +3,6 @@ OPTIMISTIC_ETHERSCAN_API_KEY=yourOptimisticEtherscanApiKey
 POLYGONSCAN_API_KEY=yourPolygonscanApiKey
 ARBISCAN_API_KEY=yourArbiscanApiKey
 
-INFURA_ID=yourKeyHere
 BLOCKNATIVE_API_KEY=yourKeyHere
 FORTMATIC_API_KEY=yourKeyHere
 PORTIS_API_KEY=yourKeyHere
diff --git a/umbra-js/.env.example b/umbra-js/.env.example
index 0317f16b..0b36f09e 100644
--- a/umbra-js/.env.example
+++ b/umbra-js/.env.example
@@ -3,7 +3,6 @@ OPTIMISTIC_ETHERSCAN_API_KEY=yourOptimisticEtherscanApiKey
 POLYGONSCAN_API_KEY=yourPolygonscanApiKey
 ARBISCAN_API_KEY=yourArbiscanApiKey
 GNOSISSCAN_API_KEY=yourGnosisSafeScanApiKey
-INFURA_ID=zzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzz
 MAINNET_RPC_URL=yourMainnetRpcUrl
 OPTIMISM_RPC_URL=yourOptimismRpcUrl
 GNOSIS_CHAIN_RPC_URL=yourGnosisChainRpcUrl
diff --git a/umbra-js/hardhat.config.ts b/umbra-js/hardhat.config.ts
index cf6fe252..1d97311d 100644
--- a/umbra-js/hardhat.config.ts
+++ b/umbra-js/hardhat.config.ts
@@ -19,11 +19,10 @@ const chainIds = {
 // Ensure that we have all the environment variables we need.
 const mnemonic = 'test test test test test test test test test test test junk';
 
-const infuraApiKey = process.env.INFURA_ID;
-if (!infuraApiKey) throw new Error('Please set your INFURA_ID in a .env file');
-
 function createTestnetConfig(network: keyof typeof chainIds): NetworkUserConfig {
-  const url = `https://${network}.infura.io/v3/${infuraApiKey as string}`;
+  const rpcUrlString = `${network.toUpperCase()}_RPC_URL`;
+  const url = process.env[rpcUrlString];
+  if (!url) throw new Error(`Please set the ${url} in a .env file`);
   return {
     accounts: {
       count: 10,
@@ -36,12 +35,14 @@ function createTestnetConfig(network: keyof typeof chainIds): NetworkUserConfig
   };
 }
 
+const rpcUrlString = process.env.SEPOLIA_RPC_URL;
+if (!rpcUrlString) throw new Error('Please set the SEPOLIA_RPC_URL in a .env file');
 const config: HardhatUserConfig = {
   defaultNetwork: 'hardhat',
   networks: {
     hardhat: {
       forking: {
-        url: `https://sepolia.infura.io/v3/${infuraApiKey}`,
+        url: rpcUrlString,
       },
       chainId: chainIds.hardhat,
       accounts: {
diff --git a/umbra-js/test/cns.test.ts b/umbra-js/test/cns.test.ts
index 9f693316..20f1dad1 100644
--- a/umbra-js/test/cns.test.ts
+++ b/umbra-js/test/cns.test.ts
@@ -11,11 +11,11 @@ const resolution = new Resolution({
     uns: {
       locations: {
         Layer1: {
-          url: `https://mainnet.infura.io/v3/${String(process.env.INFURA_ID)}`,
+          url: `${String(process.env.MAINNET_RPC_URL)}`,
           network: 'mainnet',
         },
         Layer2: {
-          url: `https://polygon-mainnet.infura.io/v3/${String(process.env.INFURA_ID)}`,
+          url: `${String(process.env.POLYGON_RPC_URL)}`,
           network: 'polygon-mainnet',
         },
       },
@@ -43,9 +43,7 @@ describe('СNS functions', () => {
 
   it('gets the public keys associated with a CNS address', async () => {
     const address = await resolution.addr(name, 'ETH');
-    const ethersProvider = new StaticJsonRpcProvider(
-      `https://polygon-mainnet.infura.io/v3/${String(process.env.INFURA_ID)}`
-    );
+    const ethersProvider = new StaticJsonRpcProvider(`${String(process.env.POLYGON_RPC_URL)}`);
     const keys = await utils.lookupRecipient(address, ethersProvider);
     expect(keys.spendingPublicKey).to.equal(nameSpendingPublicKey);
     expect(keys.viewingPublicKey).to.equal(nameViewingPublicKey);
diff --git a/umbra-js/test/utils.test.ts b/umbra-js/test/utils.test.ts
index 86c42b24..37ae2afa 100644
--- a/umbra-js/test/utils.test.ts
+++ b/umbra-js/test/utils.test.ts
@@ -8,8 +8,20 @@ import { Event } from '../src/ethers';
 
 const ethersProvider = ethers.provider;
 
-const INFURA_ID = <string>process.env.INFURA_ID;
-if (!INFURA_ID) throw new Error('Please set your INFURA_ID in a .env file');
+const MAINNET_RPC_URL = <string>process.env.MAINNET_RPC_URL;
+if (!MAINNET_RPC_URL) throw new Error('Please set your MAINNET_RPC_URL in a .env file');
+
+const SEPOLIA_RPC_URL = <string>process.env.SEPOLIA_RPC_URL;
+if (!SEPOLIA_RPC_URL) throw new Error('Please set your SEPOLIA_RPC_URL in a .env file');
+
+const POLYGON_RPC_URL = <string>process.env.POLYGON_RPC_URL;
+if (!POLYGON_RPC_URL) throw new Error('Please set your POLYGON_RPC_URL in a .env file');
+
+const OPTIMISM_RPC_URL = <string>process.env.OPTIMISM_RPC_URL;
+if (!OPTIMISM_RPC_URL) throw new Error('Please set your OPTIMISM_RPC_URL in a .env file');
+
+const ARBITRUM_ONE_RPC_URL = <string>process.env.ARBITRUM_ONE_RPC_URL;
+if (!ARBITRUM_ONE_RPC_URL) throw new Error('Please set your ARBITRUM_ONE_RPC_URL in a .env file');
 
 // Public key and address corresponding to stratus4.eth
 const publicKey = '0x04458465db23fe07d148c8c9078d8b67497998a66f4f2aa479973a9cbaaf8b5a96e6ba166a389b8f794b68010849b64b91343e72c7fa4cfcc178607c4b1d4870ed'; // prettier-ignore
@@ -109,21 +121,21 @@ describe('Utilities', () => {
 
     // --- Address, advanced mode on (i.e. don't use the StealthKeyRegistry) ---
     it('looks up recipients by address, advanced mode on', async () => {
-      const ethersProvider = new StaticJsonRpcProvider(`https://sepolia.infura.io/v3/${String(process.env.INFURA_ID)}`);
+      const ethersProvider = new StaticJsonRpcProvider(SEPOLIA_RPC_URL);
       const keys = await utils.lookupRecipient(address, ethersProvider, { advanced: true });
       expect(keys.spendingPublicKey).to.equal(pubKeysWallet.spendingPublicKey);
       expect(keys.viewingPublicKey).to.equal(pubKeysWallet.viewingPublicKey);
     });
 
     it('looks up recipients by ENS, advanced mode on', async () => {
-      const ethersProvider = new StaticJsonRpcProvider(`https://sepolia.infura.io/v3/${String(process.env.INFURA_ID)}`);
+      const ethersProvider = new StaticJsonRpcProvider(SEPOLIA_RPC_URL);
       const keys = await utils.lookupRecipient('stratus4.eth', ethersProvider, { advanced: true });
       expect(keys.spendingPublicKey).to.equal(pubKeysWallet.spendingPublicKey);
       expect(keys.viewingPublicKey).to.equal(pubKeysWallet.viewingPublicKey);
     });
 
     it.skip('looks up recipients by CNS, advanced mode on', async () => {
-      const ethersProvider = new StaticJsonRpcProvider(`https://sepolia.infura.io/v3/${INFURA_ID}`);
+      const ethersProvider = new StaticJsonRpcProvider(SEPOLIA_RPC_URL);
       const keys = await utils.lookupRecipient('udtestdev-msolomon.crypto', ethersProvider, { advanced: true });
       expect(keys.spendingPublicKey).to.equal(pubKeysWallet.spendingPublicKey);
       expect(keys.viewingPublicKey).to.equal(pubKeysWallet.viewingPublicKey);
@@ -131,7 +143,7 @@ describe('Utilities', () => {
 
     // --- Address, advanced mode off (i.e. use the StealthKeyRegistry) ---
     it('looks up recipients by address, advanced mode off', async () => {
-      const ethersProvider = new StaticJsonRpcProvider(`https://sepolia.infura.io/v3/${INFURA_ID}`); // otherwise throws with unsupported network since we're on localhost
+      const ethersProvider = new StaticJsonRpcProvider(SEPOLIA_RPC_URL); // otherwise throws with unsupported network since we're on localhost
       const keys = await utils.lookupRecipient(address, ethersProvider);
       expect(keys.spendingPublicKey).to.equal(pubKeysUmbra.spendingPublicKey);
       expect(keys.viewingPublicKey).to.equal(pubKeysUmbra.viewingPublicKey);
@@ -143,7 +155,7 @@ describe('Utilities', () => {
     });
 
     it('looks up recipients by ENS, advanced mode off', async () => {
-      const ethersProvider = new StaticJsonRpcProvider(`https://sepolia.infura.io/v3/${INFURA_ID}`);
+      const ethersProvider = new StaticJsonRpcProvider(SEPOLIA_RPC_URL);
       const keys = await utils.lookupRecipient('stratus4.eth', ethersProvider);
       // These values are set on the Sepolia resolver
       expect(keys.spendingPublicKey).to.equal(pubKeysUmbra.spendingPublicKey);
@@ -181,37 +193,31 @@ describe('Utilities', () => {
 
     // --- Address history by network ---
     it('looks up transaction history on mainnet', async () => {
-      const ethersProvider = new StaticJsonRpcProvider(`https://mainnet.infura.io/v3/${INFURA_ID}`);
+      const ethersProvider = new StaticJsonRpcProvider(MAINNET_RPC_URL);
       const txHash = await utils.getSentTransaction(address, ethersProvider);
       expect(txHash).to.have.lengthOf(66);
     });
 
     it('looks up transaction history on sepolia', async () => {
-      const ethersProvider = new StaticJsonRpcProvider(`https://sepolia.infura.io/v3/${INFURA_ID}`);
+      const ethersProvider = new StaticJsonRpcProvider(SEPOLIA_RPC_URL);
       const txHash = await utils.getSentTransaction(address, ethersProvider);
       expect(txHash).to.have.lengthOf(66);
     });
 
     it('looks up transaction history on polygon', async () => {
-      const ethersProvider = new ethers.providers.StaticJsonRpcProvider(
-        `https://polygon-mainnet.infura.io/v3/${INFURA_ID}`
-      ) as EthersProvider;
+      const ethersProvider = new ethers.providers.StaticJsonRpcProvider(POLYGON_RPC_URL) as EthersProvider;
       const txHash = await utils.getSentTransaction(address, ethersProvider);
       expect(txHash).to.have.lengthOf(66);
     });
 
     it('looks up transaction history on optimism', async () => {
-      const ethersProvider = new ethers.providers.StaticJsonRpcProvider(
-        `https://optimism-mainnet.infura.io/v3/${INFURA_ID}`
-      ) as EthersProvider;
+      const ethersProvider = new ethers.providers.StaticJsonRpcProvider(OPTIMISM_RPC_URL) as EthersProvider;
       const txHash = await utils.getSentTransaction(address, ethersProvider);
       expect(txHash).to.have.lengthOf(66);
     });
 
     it('looks up transaction history on arbitrum one', async () => {
-      const ethersProvider = new ethers.providers.StaticJsonRpcProvider(
-        `https://arbitrum-mainnet.infura.io/v3/${INFURA_ID}`
-      ) as EthersProvider;
+      const ethersProvider = new ethers.providers.StaticJsonRpcProvider(ARBITRUM_ONE_RPC_URL) as EthersProvider;
       const txHash = await utils.getSentTransaction(address, ethersProvider);
       expect(txHash).to.have.lengthOf(66);
     });
@@ -238,7 +244,7 @@ describe('Utilities', () => {
 
     it('throws when looking up an address that has not sent a transaction', async () => {
       const address = '0x0000000000000000000000000000000000000002';
-      const ethersProvider = new StaticJsonRpcProvider(`https://sepolia.infura.io/v3/${INFURA_ID}`); // otherwise throws with unsupported network since we're on localhost
+      const ethersProvider = new StaticJsonRpcProvider(SEPOLIA_RPC_URL); // otherwise throws with unsupported network since we're on localhost
       const errorMsg = `Address ${address} has not registered stealth keys. Please ask them to setup their Umbra account`;
       await expectRejection(utils.lookupRecipient(address, ethersProvider), errorMsg);
     });

From af15d8cd0874c1b48ee341218cfd84e5b9e1db38 Mon Sep 17 00:00:00 2001
From: marcomariscal <marco.a.mariscal@gmail.com>
Date: Tue, 9 Jul 2024 13:37:20 -0700
Subject: [PATCH 35/48] fix: use balanceIndex to ensure that the correct
 balance is fetched from the stealthBalances array

---
 frontend/src/components/AccountReceiveTable.vue | 13 ++++++++++---
 1 file changed, 10 insertions(+), 3 deletions(-)

diff --git a/frontend/src/components/AccountReceiveTable.vue b/frontend/src/components/AccountReceiveTable.vue
index 2aec820e..b4206dc8 100644
--- a/frontend/src/components/AccountReceiveTable.vue
+++ b/frontend/src/components/AccountReceiveTable.vue
@@ -617,9 +617,16 @@ function useReceivedFundsTable(userAnnouncements: Ref<UserAnnouncement[]>, spend
     const stealthBalanceResponses: Response[] = await multicall.callStatic.aggregate3(stealthBalanceCalls);
     const stealthBalances = stealthBalanceResponses.map((r) => BigNumber.from(r.returnData));
 
-    formattedAnnouncements.value.forEach((announcement, index) => {
-      if (newAnnouncements.some((newAnnouncement) => newAnnouncement.txHash === announcement.txHash))
-        announcement.isWithdrawn = stealthBalances[index].lt(announcement.amount);
+    formattedAnnouncements.value.forEach((announcement) => {
+      const isNewAnnouncement = newAnnouncements.some(
+        (newAnnouncement) => newAnnouncement.txHash === announcement.txHash
+      );
+
+      if (isNewAnnouncement) {
+        const balanceIndex = userAnnouncements.value.findIndex((a) => a.txHash === announcement.txHash);
+        const stealthBalance = stealthBalances[balanceIndex];
+        announcement.isWithdrawn = stealthBalance.lt(announcement.amount);
+      }
     });
     isLoading.value = false;
   });

From c6d04ed7c8f0902e7b9a63019795358c2c4e8c8a Mon Sep 17 00:00:00 2001
From: marcomariscal <marco.a.mariscal@gmail.com>
Date: Tue, 9 Jul 2024 16:20:08 -0700
Subject: [PATCH 36/48] fix: dedupe by tx hash and receiver instead of just tx
 hash

---
 frontend/src/pages/AccountReceive.vue | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/frontend/src/pages/AccountReceive.vue b/frontend/src/pages/AccountReceive.vue
index f5c631ed..84eb743a 100644
--- a/frontend/src/pages/AccountReceive.vue
+++ b/frontend/src/pages/AccountReceive.vue
@@ -256,8 +256,10 @@ function useScan() {
   function deduplicateAnnouncements(announcements: UserAnnouncement[]) {
     const seen = new Set();
     return announcements.filter((announcement) => {
-      const duplicate = seen.has(announcement.txHash);
-      seen.add(announcement.txHash);
+      // Deduplicate by txHash and receiver address (stealth address) to handle batch sends
+      const uniqueId = `${announcement.txHash}-${announcement.receiver}`;
+      const duplicate = seen.has(uniqueId);
+      seen.add(uniqueId);
       return !duplicate;
     });
   }

From a6d895269cc3bc764195525f5a59594dc3bcae53 Mon Sep 17 00:00:00 2001
From: marcomariscal <marco.a.mariscal@gmail.com>
Date: Wed, 10 Jul 2024 18:00:40 -0700
Subject: [PATCH 37/48] fix: include receiver to derive isWithdrawn

---
 frontend/src/components/AccountReceiveTable.vue | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/frontend/src/components/AccountReceiveTable.vue b/frontend/src/components/AccountReceiveTable.vue
index b4206dc8..609be2b4 100644
--- a/frontend/src/components/AccountReceiveTable.vue
+++ b/frontend/src/components/AccountReceiveTable.vue
@@ -619,11 +619,14 @@ function useReceivedFundsTable(userAnnouncements: Ref<UserAnnouncement[]>, spend
 
     formattedAnnouncements.value.forEach((announcement) => {
       const isNewAnnouncement = newAnnouncements.some(
-        (newAnnouncement) => newAnnouncement.txHash === announcement.txHash
+        (newAnnouncement) =>
+          newAnnouncement.txHash === announcement.txHash && newAnnouncement.receiver === announcement.receiver
       );
 
       if (isNewAnnouncement) {
-        const balanceIndex = userAnnouncements.value.findIndex((a) => a.txHash === announcement.txHash);
+        const balanceIndex = userAnnouncements.value.findIndex(
+          (a) => a.txHash === announcement.txHash && a.receiver === announcement.receiver
+        );
         const stealthBalance = stealthBalances[balanceIndex];
         announcement.isWithdrawn = stealthBalance.lt(announcement.amount);
       }

From b6278897deab200b572900b6ffd6ad76fb4d8d85 Mon Sep 17 00:00:00 2001
From: marcomariscal <marco.a.mariscal@gmail.com>
Date: Thu, 11 Jul 2024 11:13:12 -0700
Subject: [PATCH 38/48] fix: img

---
 frontend/src/components/AccountReceiveTable.vue | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/frontend/src/components/AccountReceiveTable.vue b/frontend/src/components/AccountReceiveTable.vue
index 609be2b4..a6858921 100644
--- a/frontend/src/components/AccountReceiveTable.vue
+++ b/frontend/src/components/AccountReceiveTable.vue
@@ -132,8 +132,12 @@
           <div :key="props.row.id" class="col-12">
             <q-card class="card-border cursor-pointer q-pt-md col justify-center items-center">
               <q-card-section class="row justify-center items-center">
-                <img v-if="getTokenInfo(props.row.token)" src="path/to/image.jpg" />props.row.token, tokens)"
-                style="width: 1.2rem" v-if="getTokenInfo(props.row.token)" />
+                <img
+                  class="q-mr-md"
+                  :src="getTokenLogoUri(props.row.token, tokens)"
+                  style="width: 1.2rem"
+                  v-if="getTokenInfo(props.row.token)"
+                />
                 <div class="text-primary text-h6 header-black q-pb-none">
                   {{ formatAmount(props.row.amount, props.row.token, tokens) }}
                   {{ getTokenSymbol(props.row.token, tokens) }}

From 16a1045d0c2eec2428700ec21e0cd279f5764e59 Mon Sep 17 00:00:00 2001
From: John Feras <jferas@ferasinfotech.com>
Date: Thu, 2 May 2024 15:38:20 -0400
Subject: [PATCH 39/48] Query StealthKeyChanged events from subgraph for user
 registration block number and stealthkeys

---
 frontend/package.json         |   2 +-
 umbra-js/package.json         |   2 +-
 umbra-js/src/classes/Umbra.ts |  76 ++----------
 umbra-js/src/types.ts         |  15 +++
 umbra-js/src/utils/utils.ts   | 217 ++++++++++++++++++++++++++++++++--
 5 files changed, 229 insertions(+), 83 deletions(-)

diff --git a/frontend/package.json b/frontend/package.json
index aa2fb67a..b3301757 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -20,7 +20,7 @@
     "@adraffy/ens-normalize": "1.9.2",
     "@metamask/jazzicon": "^2.0.0",
     "@quasar/extras": "^1.15.8",
-    "@umbracash/umbra-js": "0.1.6",
+    "@umbracash/umbra-js": "file:../umbra-js",
     "@uniswap/token-lists": "^1.0.0-beta.19",
     "@unstoppabledomains/resolution": "8.5.0",
     "@web3-onboard/coinbase": "2.2.7",
diff --git a/umbra-js/package.json b/umbra-js/package.json
index a82d9e58..f5566eee 100644
--- a/umbra-js/package.json
+++ b/umbra-js/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@umbracash/umbra-js",
-  "version": "0.1.6",
+  "version": "0.2.0",
   "description": "Send and receive stealth payments",
   "main": "build/src/index.js",
   "types": "build/src/index.d.ts",
diff --git a/umbra-js/src/classes/Umbra.ts b/umbra-js/src/classes/Umbra.ts
index 7271dfab..1deba5e6 100644
--- a/umbra-js/src/classes/Umbra.ts
+++ b/umbra-js/src/classes/Umbra.ts
@@ -33,10 +33,11 @@ import {
   assertSupportedAddress,
   checkSupportedAddresses,
   getBlockNumberUserRegistered,
+  recursiveGraphFetch,
 } from '../utils/utils';
 import { Umbra as UmbraContract, Umbra__factory, ERC20__factory } from '../typechain';
 import { ETH_ADDRESS, UMBRA_BATCH_SEND_ABI } from '../utils/constants';
-import type { Announcement, ChainConfig, EthersProvider, GraphFilterOverride, ScanOverrides, SendOverrides, SubgraphAnnouncement, UserAnnouncement, AnnouncementDetail, SendBatch, SendData} from '../types'; // prettier-ignore
+import type { Announcement, ChainConfig, EthersProvider, ScanOverrides, SendOverrides, SubgraphAnnouncement, UserAnnouncement, AnnouncementDetail, SendBatch, SendData} from '../types'; // prettier-ignore
 
 // Mapping from chainId to contract information
 const umbraAddress = '0xFb2dc580Eed955B528407b4d36FfaFe3da685401'; // same on all supported networks
@@ -72,7 +73,7 @@ const chainConfigs: Record<number, ChainConfig> = {
  * @notice Helper method to parse chainConfig input and return a valid chain configuration
  * @param chainConfig Supported chainID as number, or custom ChainConfig
  */
-const parseChainConfig = (chainConfig: ChainConfig | number) => {
+export const parseChainConfig = (chainConfig: ChainConfig | number) => {
   if (!chainConfig) {
     throw new Error('chainConfig not provided');
   }
@@ -372,7 +373,7 @@ export class Umbra {
   }
 
   /**
-   * @notice Fetches all Umbra event logs using Goldsky, if available, falling back to RPC if not
+   * @notice Fetches all Umbra event logs using a subgraph, if available, falling back to RPC if not
    * @param overrides Override the start and end block used for scanning;
    * @returns A list of Announcement events supplemented with additional metadata, such as the sender, block,
    * timestamp, and txhash
@@ -397,7 +398,7 @@ export class Umbra {
       return filtered.filter((i) => i !== null) as AnnouncementDetail[];
     };
 
-    // Try querying events using Goldsky, fallback to querying logs.
+    // Try querying events using a subgraph, fallback to querying logs.
     if (this.chainConfig.subgraphUrl) {
       try {
         for await (const subgraphAnnouncements of this.fetchAllAnnouncementsFromSubgraph(startBlock, endBlock)) {
@@ -417,7 +418,7 @@ export class Umbra {
 
   /**
    * @notice Fetches Umbra event logs starting from the block user registered their stealth keys in using
-   * Goldsky, if available, falling back to RPC if not
+   * a subgraph, if available, falling back to RPC if not
    * @param overrides Override the start and end block used for scanning;
    * @returns A list of Announcement events supplemented with additional metadata, such as the sender, block,
    * timestamp, and txhash
@@ -427,7 +428,7 @@ export class Umbra {
     address: string,
     overrides: ScanOverrides = {}
   ): AsyncGenerator<AnnouncementDetail[]> {
-    const registeredBlockNumber = await getBlockNumberUserRegistered(address, Signer.provider);
+    const registeredBlockNumber = await getBlockNumberUserRegistered(address, Signer.provider, this.chainConfig);
     // Get start and end blocks to scan events for
     const startBlock = overrides.startBlock || registeredBlockNumber || this.chainConfig.startBlock;
     const endBlock = overrides.endBlock || 'latest';
@@ -437,7 +438,7 @@ export class Umbra {
   }
 
   /**
-   * @notice Fetches all Umbra event logs using Goldsky
+   * @notice Fetches all Umbra event logs using a subgraph
    * @param startBlock Scanning start block
    * @param endBlock Scannding end block
    * @returns A list of Announcement events supplemented with additional metadata, such as the sender, block,
@@ -732,67 +733,6 @@ export class Umbra {
 
 // ============================== PRIVATE, FUNCTIONAL HELPER METHODS ==============================
 
-/**
- * @notice Generic method to recursively grab every 'page' of results
- * @dev NOTE: the query MUST return the ID field
- * @dev Modifies from: https://github.com/dcgtc/dgrants/blob/f5a783524d0b56eea12c127b2146fba8fb9273b4/app/src/utils/utils.ts#L443
- * @dev Relevant docs: https://thegraph.com/docs/developer/graphql-api#example-3
- * @dev Lives outside of the class instance because user's should not need access to this method
- * @dev TODO support node.js by replacing reliance on browser's fetch module with https://github.com/paulmillr/micro-ftch
- * @param url the url we will recursively fetch from
- * @param key the key in the response object which holds results
- * @param query a function which will return the query string (with the page in place)
- * @param before the current array of objects
- */
-async function* recursiveGraphFetch(
-  url: string,
-  key: string,
-  query: (filter: string) => string,
-  before: any[] = [],
-  overrides?: GraphFilterOverride
-): AsyncGenerator<any[]> {
-  // retrieve the last ID we collected to use as the starting point for this query
-  const fromId = before.length ? (before[before.length - 1].id as string | number) : false;
-  let startBlockFilter = '';
-  let endBlockFilter = '';
-  const startBlock = overrides?.startBlock ? overrides.startBlock.toString() : '';
-  const endBlock = overrides?.endBlock ? overrides?.endBlock.toString() : '';
-
-  if (startBlock) {
-    startBlockFilter = `block_gte: "${startBlock}",`;
-  }
-
-  if (endBlock && endBlock !== 'latest') {
-    endBlockFilter = `block_lte: "${endBlock}",`;
-  }
-  // Fetch this 'page' of results - please note that the query MUST return an ID
-  const res = await fetch(url, {
-    method: 'POST',
-    headers: { 'Content-Type': 'application/json' },
-    body: JSON.stringify({
-      query: query(`
-        first: 1000,
-        orderBy: id,
-        orderDirection: desc,
-        where: {
-          ${fromId ? `id_lt: "${fromId}",` : ''}
-          ${startBlockFilter}
-          ${endBlockFilter}
-        }
-      `),
-    }),
-  });
-
-  // Resolve the json
-  const json = await res.json();
-
-  // If there were results on this page yield the results then query the next page, otherwise do nothing.
-  if (json.data[key].length) {
-    yield json.data[key]; // yield the data for this page
-    yield* recursiveGraphFetch(url, key, query, [...before, ...json.data[key]], overrides); // yield the data for the next pages
-  }
-}
-
 /**
  * @notice Tries withdrawing ETH from a stealth address on behalf of a user
  * @dev Attempts multiple retries before returning an error. Retries only occur if there was an
diff --git a/umbra-js/src/types.ts b/umbra-js/src/types.ts
index b50285e0..351b3b19 100644
--- a/umbra-js/src/types.ts
+++ b/umbra-js/src/types.ts
@@ -118,6 +118,20 @@ export interface UserAnnouncement {
   txHash: string;
 }
 
+// StealthKeyChanged event data received from subgraph queries
+export interface SubgraphStealthKeyChangedEvent {
+  block: string;
+  from: string;
+  id: string; // the subgraph uses an ID of `timestamp-logIndex`
+  registrant: string;
+  spendingPubKeyPrefix: BigNumber;
+  spendingPubKey: BigNumber;
+  timestamp: string;
+  txHash: string;
+  viewingPubKeyPrefix: BigNumber;
+  viewingPubKey: BigNumber;
+}
+
 export interface SendBatch {
   token: string;
   amount: BigNumberish;
@@ -135,4 +149,5 @@ export interface SendData {
 export type GraphFilterOverride = {
   startBlock?: number | string;
   endBlock?: number | string;
+  registrant?: string;
 };
diff --git a/umbra-js/src/utils/utils.ts b/umbra-js/src/utils/utils.ts
index 617d0ce8..ce4347c7 100644
--- a/umbra-js/src/utils/utils.ts
+++ b/umbra-js/src/utils/utils.ts
@@ -24,8 +24,17 @@ import { ens, cns } from '..';
 import { default as Resolution } from '@unstoppabledomains/resolution';
 import { StealthKeyRegistry } from '../classes/StealthKeyRegistry';
 import { TxHistoryProvider } from '../classes/TxHistoryProvider';
-import { EthersProvider, TransactionResponseExtended } from '../types';
+import { KeyPair } from '../classes/KeyPair';
+import {
+  EthersProvider,
+  TransactionResponseExtended,
+  GraphFilterOverride,
+  ChainConfig,
+  SubgraphStealthKeyChangedEvent,
+  ScanOverrides,
+} from '../types';
 import { StealthKeyChangedEvent } from 'src/typechain/contracts/StealthKeyRegistry';
+import { parseChainConfig } from '../classes/Umbra';
 
 // Lengths of various properties when represented as full hex strings
 export const lengths = {
@@ -216,6 +225,7 @@ export async function lookupRecipient(
     supportTxHash,
   }: { advanced?: boolean; supportPubKey?: boolean; supportTxHash?: boolean } = {}
 ) {
+  const chainId = (await provider.getNetwork()).chainId;
   // Check if identifier is a public key. If so we just return that directly
   const isPublicKey = id.length === 132 && isHexString(id);
   if (supportPubKey && isPublicKey) {
@@ -235,10 +245,31 @@ export async function lookupRecipient(
   // ENS name, CNS name, or address, so we resolve it to an address
   const address = await toAddress(id, provider); // throws if an invalid address is provided
 
-  // If we're not using advanced mode, use the StealthKeyRegistry
+  // If we're not using advanced mode, use the StealthKeyRegistry events
   if (!advanced) {
-    const registry = new StealthKeyRegistry(provider);
-    return registry.getStealthKeys(address);
+    // Fetch the stealth key registry event from the subgraph and fall back to the registry contract if the subgraph returns an error
+    try {
+      const chainConfig = parseChainConfig(chainId);
+      const stealthKeyChangedEvent = await getMostRecentSubgraphStealthKeyChangedEventFromAddress(address, chainConfig);
+      const spendingPublicKey = KeyPair.getUncompressedFromX(
+        stealthKeyChangedEvent.spendingPubKey,
+        stealthKeyChangedEvent.spendingPubKeyPrefix.toString()
+      );
+      const viewingPublicKey = KeyPair.getUncompressedFromX(
+        stealthKeyChangedEvent.viewingPubKey,
+        stealthKeyChangedEvent.viewingPubKeyPrefix.toString()
+      );
+      return { spendingPublicKey: spendingPublicKey, viewingPublicKey: viewingPublicKey };
+    } catch (error) {
+      if (error instanceof Error) {
+        console.log('Public key subgraph fetch error: ', error.message);
+      } else {
+        console.log('An unknown error occurred: ', error);
+      }
+      console.log('Error using subgraph to lookup receipient stealth keys, will query registry contract');
+      const registry = new StealthKeyRegistry(provider);
+      return registry.getStealthKeys(address);
+    }
   }
 
   // Otherwise, get public key based on the most recent transaction sent by that address
@@ -249,21 +280,181 @@ export async function lookupRecipient(
   return { spendingPublicKey: publicKey, viewingPublicKey: publicKey };
 }
 
-export async function getBlockNumberUserRegistered(address: string, provider: StaticJsonRpcProvider) {
+export async function getBlockNumberUserRegistered(
+  address: string,
+  provider: StaticJsonRpcProvider,
+  chainConfig: ChainConfig
+) {
+  // Fetch the stealth key registry event from the subgraph and fall back to the registry contract if the subgraph returns an error
   address = getAddress(address); // address input validation
-  const registry = new StealthKeyRegistry(provider);
-  const filter = registry._registry.filters.StealthKeyChanged(address, null, null, null, null);
   try {
-    const timeout = (ms: number) => new Promise((reject) => setTimeout(() => reject(new Error('timeout')), ms));
-    const stealthKeyLogsPromise = registry._registry.queryFilter(filter);
-    const stealthKeyLogs = (await Promise.race([stealthKeyLogsPromise, timeout(3000)])) as StealthKeyChangedEvent[];
-    const registryBlock = sortStealthKeyLogs(stealthKeyLogs)[0]?.blockNumber || undefined;
-    return registryBlock;
+    console.log('Using subgraph to get block number when user registered');
+    const stealthKeyChangedEvent = await getMostRecentSubgraphStealthKeyChangedEventFromAddress(address, chainConfig);
+    console.log(`stealthKeyChangedEvent.block: ${stealthKeyChangedEvent.block}`);
+    return stealthKeyChangedEvent.block;
   } catch {
-    return undefined;
+    console.log('Error using subgraph to get block number when user registered, will query registry contract');
+    const registry = new StealthKeyRegistry(provider);
+    const filter = registry._registry.filters.StealthKeyChanged(address, null, null, null, null);
+    try {
+      const timeout = (ms: number) => new Promise((reject) => setTimeout(() => reject(new Error('timeout')), ms));
+      const stealthKeyLogsPromise = registry._registry.queryFilter(filter);
+      const stealthKeyLogs = (await Promise.race([stealthKeyLogsPromise, timeout(3000)])) as StealthKeyChangedEvent[];
+      const registryBlock = sortStealthKeyLogs(stealthKeyLogs)[0]?.blockNumber || undefined;
+      return registryBlock;
+    } catch {
+      return undefined;
+    }
+  }
+}
+
+export async function getMostRecentSubgraphStealthKeyChangedEventFromAddress(
+  address: string,
+  chainConfig: ChainConfig,
+  overrides: ScanOverrides = {}
+): Promise<SubgraphStealthKeyChangedEvent> {
+  const startBlock = overrides.startBlock || chainConfig.startBlock;
+  const endBlock = overrides.endBlock || 'latest';
+
+  // Fetch stealth key changed events from the subgraph
+  const stealthKeyChangedEvents = fetchAllStealthKeyChangedEventsForRecipientAddressFromSubgraph(
+    startBlock,
+    endBlock,
+    address,
+    chainConfig
+  );
+  let theEvent: SubgraphStealthKeyChangedEvent | undefined;
+  for await (const event of stealthKeyChangedEvents) {
+    for (let i = 0; i < event.length; i++) {
+      if (theEvent) {
+        console.log(
+          `We found a previous StealthKeyChangedEvent for address ${address} in the subgraph at block ${event[i].block} with transaction hash ${event[i].txHash}`
+        );
+      } else {
+        theEvent = event[i];
+        console.log(
+          `We found a StealthKeyChangedEvent for address ${address} in the subgraph at block ${event[i].block} with transaction hash ${event[i].txHash}`
+        );
+      }
+    }
   }
+
+  if (!theEvent) {
+    throw new Error('No stealthKeyChangedEvents found matching address in subgraph');
+  }
+  return theEvent;
 }
 
+/**
+ * @notice Fetches all Umbra event logs using a subgraph
+ * @param startBlock Scanning start block
+ * @param endBlock Scannding end block
+ * @returns A list of StealthKeyChanged events supplemented with additional metadata, such as the sender, block,
+ * timestamp, txhash, and the subgraph identifier
+ */
+async function* fetchAllStealthKeyChangedEventsForRecipientAddressFromSubgraph(
+  startBlock: string | number,
+  endBlock: string | number,
+  registrant: string,
+  chainConfig: ChainConfig
+): AsyncGenerator<SubgraphStealthKeyChangedEvent[]> {
+  if (!chainConfig.subgraphUrl) {
+    console.log('throwing error because subgraphUrl is not defined');
+    throw new Error('Subgraph URL must be defined to fetch via subgraph');
+  }
+
+  // Query subgraph
+  for await (const stealthKeyChangedEvents of recursiveGraphFetch(
+    chainConfig.subgraphUrl,
+    'stealthKeyChangedEntities',
+    (filter: string) => `{
+      stealthKeyChangedEntities(${filter}) {
+        block
+        from
+        id
+        registrant
+        spendingPubKey
+        spendingPubKeyPrefix
+        timestamp
+        txHash
+        viewingPubKey
+        viewingPubKeyPrefix
+      }
+    }`,
+    [],
+    {
+      startBlock,
+      endBlock,
+      registrant,
+    }
+  )) {
+    yield stealthKeyChangedEvents;
+  }
+}
+
+/**
+ * @notice Generic method to recursively grab every 'page' of results
+ * @dev NOTE: the query MUST return the ID field
+ * @dev Modifies from: https://github.com/dcgtc/dgrants/blob/f5a783524d0b56eea12c127b2146fba8fb9273b4/app/src/utils/utils.ts#L443
+ * @dev Relevant docs: https://thegraph.com/docs/developer/graphql-api#example-3
+ * @dev Lives outside of the class instance because user's should not need access to this method
+ * @dev TODO support node.js by replacing reliance on browser's fetch module with https://github.com/paulmillr/micro-ftch
+ * @param url the url we will recursively fetch from
+ * @param key the key in the response object which holds results
+ * @param query a function which will return the query string (with the page in place)
+ * @param before the current array of objects
+ */
+export async function* recursiveGraphFetch(
+  url: string,
+  key: string,
+  query: (filter: string) => string,
+  before: any[] = [],
+  overrides?: GraphFilterOverride
+): AsyncGenerator<any[]> {
+  // retrieve the last ID we collected to use as the starting point for this query
+  const fromId = before.length ? (before[before.length - 1].id as string | number) : false;
+  let startBlockFilter = '';
+  let endBlockFilter = '';
+  const startBlock = overrides?.startBlock ? overrides.startBlock.toString() : '';
+  const endBlock = overrides?.endBlock ? overrides?.endBlock.toString() : '';
+  const registrantFilter = overrides?.registrant ? 'registrant: "' + overrides.registrant.toLowerCase() + '"' : '';
+
+  if (startBlock) {
+    startBlockFilter = `block_gte: "${startBlock}",`;
+  }
+
+  if (endBlock && endBlock !== 'latest') {
+    endBlockFilter = `block_lte: "${endBlock}",`;
+  }
+
+  // Fetch this 'page' of results - please note that the query MUST return an ID
+  const res = await fetch(url, {
+    method: 'POST',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify({
+      query: query(`
+        first: 1000,
+        orderBy: id,
+        orderDirection: desc,
+        where: {
+          ${fromId ? `id_lt: "${fromId}",` : ''}
+          ${startBlockFilter}
+          ${endBlockFilter}
+          ${registrantFilter}
+        }
+      `),
+    }),
+  });
+
+  // Resolve the json
+  const json = await res.json();
+
+  // If there were results on this page yield the results then query the next page, otherwise do nothing.
+  if (json.data[key].length) {
+    yield json.data[key]; // yield the data for this page
+    yield* recursiveGraphFetch(url, key, query, [...before, ...json.data[key]], overrides); // yield the data for the next pages
+  }
+}
 // Sorts stealth key logs in ascending order by block number
 export function sortStealthKeyLogs(stealthKeyLogs: Event[]) {
   return stealthKeyLogs.sort(function (a, b) {

From 9fb7573b217d54a0fd813a8b1fd69a69e075bc00 Mon Sep 17 00:00:00 2001
From: John Feras <jferas@ferasinfotech.com>
Date: Thu, 2 May 2024 16:04:37 -0400
Subject: [PATCH 40/48] Added valid non-found in subgraph error (vs schema
 error) and removed wasteful retries from wallet function
 getRegisteredStealthKeys

---
 frontend/src/store/wallet.ts | 20 ++++++--------------
 umbra-js/src/utils/utils.ts  |  1 +
 2 files changed, 7 insertions(+), 14 deletions(-)

diff --git a/frontend/src/store/wallet.ts b/frontend/src/store/wallet.ts
index e886d120..ead6cf51 100644
--- a/frontend/src/store/wallet.ts
+++ b/frontend/src/store/wallet.ts
@@ -632,19 +632,11 @@ const hasSetPublicKeysLegacy = async (name: string, provider: Provider) => {
 
 // Helper method to check if user has registered public keys in the StealthKeyRegistry
 async function getRegisteredStealthKeys(account: string, provider: Provider) {
-  let retryCounter = 0;
-  while (retryCounter < 3) {
-    try {
-      console.log(`getting stealth keys for ${account}, try ${retryCounter + 1} of 3`);
-      const stealthPubKeys = await utils.lookupRecipient(account, provider); // throws if no keys found
-      return stealthPubKeys;
-    } catch (err) {
-      window.logger.warn(err);
-      retryCounter++;
-      if (retryCounter < 3) {
-        await new Promise((resolve) => setTimeout(resolve, 2000)); // Wait for 2 seconds
-      }
-    }
+  try {
+    const stealthPubKeys = await utils.lookupRecipient(account, provider); // throws if no keys found
+    return stealthPubKeys;
+  } catch (err) {
+    window.logger.warn(err);
+    return null;
   }
-  return null;
 }
diff --git a/umbra-js/src/utils/utils.ts b/umbra-js/src/utils/utils.ts
index ce4347c7..42dd6d45 100644
--- a/umbra-js/src/utils/utils.ts
+++ b/umbra-js/src/utils/utils.ts
@@ -340,6 +340,7 @@ export async function getMostRecentSubgraphStealthKeyChangedEventFromAddress(
   }
 
   if (!theEvent) {
+    console.log(`Searched the subgraph, but found no StealthKeyChangedEvents for address ${address}`);
     throw new Error('No stealthKeyChangedEvents found matching address in subgraph');
   }
   return theEvent;

From f029262e2d1fa13265268cb8e62f1a517e6a58e3 Mon Sep 17 00:00:00 2001
From: John Feras <jferas@ferasinfotech.com>
Date: Mon, 6 May 2024 14:47:39 -0400
Subject: [PATCH 41/48] When getting stealthKeys via subgraph StealthKeyChanged
 event, save block number of event in storage as starting point of
 announcements scan

---
 frontend/src/pages/AccountReceive.vue |  2 ++
 frontend/src/store/settings.ts        | 16 +++++++++++++++-
 frontend/src/store/wallet.ts          |  6 ++++--
 umbra-js/src/classes/Umbra.ts         | 10 ++++++++--
 umbra-js/src/utils/utils.ts           | 19 ++++++++++++-------
 5 files changed, 41 insertions(+), 12 deletions(-)

diff --git a/frontend/src/pages/AccountReceive.vue b/frontend/src/pages/AccountReceive.vue
index 84eb743a..93e8c6aa 100644
--- a/frontend/src/pages/AccountReceive.vue
+++ b/frontend/src/pages/AccountReceive.vue
@@ -178,6 +178,7 @@ function useScan() {
     setScanPrivateKey,
     scanPrivateKey,
     resetScanSettings: resetScanSettingsInSettingsStore,
+    getRegisteredBlockNumber,
   } = useSettingsStore();
   const { signer, userAddress: userWalletAddress, isAccountSetup, provider } = useWalletStore();
 
@@ -484,6 +485,7 @@ function useScan() {
 
         // Default scan behavior
         for await (const announcementsBatch of umbra.value.fetchSomeAnnouncements(
+          getRegisteredBlockNumber(),
           signer.value,
           userWalletAddress.value,
           overrides
diff --git a/frontend/src/store/settings.ts b/frontend/src/store/settings.ts
index 82b2ad85..f6b6ac70 100644
--- a/frontend/src/store/settings.ts
+++ b/frontend/src/store/settings.ts
@@ -12,6 +12,7 @@ const settings = {
   language: 'language',
   sendHistorySave: 'send-history-save',
   UmbraApiVersion: 'umbra-api-version',
+  registeredBlockNumber: 'registered-block-number',
 };
 
 
@@ -29,6 +30,7 @@ const startBlock = ref<number | undefined>(undefined); // block number to start
 const endBlock = ref<number | undefined>(undefined); // block number to scan through
 const scanPrivateKey = ref<string>(); // private key entered when scanning
 const lastWallet = ref<string>(); // name of last wallet used
+const registeredBlockNumber = ref<number | undefined>(undefined); // block number of the when the user registered
 const params = new URLSearchParams(window.location.search);
 const paramLocale = params.get('locale') || undefined;
 
@@ -43,7 +45,9 @@ export default function useSettingsStore() {
     lastWallet.value = LocalStorage.getItem(settings.lastWallet)
       ? String(LocalStorage.getItem(settings.lastWallet))
       : undefined;
-
+    registeredBlockNumber.value = LocalStorage.getItem(settings.registeredBlockNumber)
+      ? Number(LocalStorage.getItem(settings.registeredBlockNumber))
+      : undefined;
   });
   setLanguage(
     paramLocale
@@ -140,6 +144,14 @@ export default function useSettingsStore() {
     LocalStorage.remove(settings.UmbraApiVersion);
   }
 
+  function getRegisteredBlockNumber() {
+    return registeredBlockNumber.value;
+  }
+
+  function setRegisteredBlockNumber(blockNumber: number) {
+    registeredBlockNumber.value = blockNumber;
+    LocalStorage.set(settings.registeredBlockNumber, blockNumber);
+  }
 
   return {
     toggleDarkMode,
@@ -162,5 +174,7 @@ export default function useSettingsStore() {
     getUmbraApiVersion,
     setUmbraApiVersion,
     clearUmbraApiVersion,
+    getRegisteredBlockNumber,
+    setRegisteredBlockNumber,
   };
 }
diff --git a/frontend/src/store/wallet.ts b/frontend/src/store/wallet.ts
index ead6cf51..737ed505 100644
--- a/frontend/src/store/wallet.ts
+++ b/frontend/src/store/wallet.ts
@@ -632,9 +632,11 @@ const hasSetPublicKeysLegacy = async (name: string, provider: Provider) => {
 
 // Helper method to check if user has registered public keys in the StealthKeyRegistry
 async function getRegisteredStealthKeys(account: string, provider: Provider) {
+  const { setRegisteredBlockNumber } = useSettingsStore();
   try {
-    const stealthPubKeys = await utils.lookupRecipient(account, provider); // throws if no keys found
-    return stealthPubKeys;
+    const registrationInfo = await utils.lookupRecipient(account, provider); // throws if no keys found
+    setRegisteredBlockNumber(Number(registrationInfo.block));
+    return registrationInfo;
   } catch (err) {
     window.logger.warn(err);
     return null;
diff --git a/umbra-js/src/classes/Umbra.ts b/umbra-js/src/classes/Umbra.ts
index 1deba5e6..31ef4e44 100644
--- a/umbra-js/src/classes/Umbra.ts
+++ b/umbra-js/src/classes/Umbra.ts
@@ -30,9 +30,9 @@ import {
   invalidStealthAddresses,
   getEthSweepGasInfo,
   lookupRecipient,
+  getBlockNumberUserRegistered,
   assertSupportedAddress,
   checkSupportedAddresses,
-  getBlockNumberUserRegistered,
   recursiveGraphFetch,
 } from '../utils/utils';
 import { Umbra as UmbraContract, Umbra__factory, ERC20__factory } from '../typechain';
@@ -419,16 +419,22 @@ export class Umbra {
   /**
    * @notice Fetches Umbra event logs starting from the block user registered their stealth keys in using
    * a subgraph, if available, falling back to RPC if not
+   * @param possibleRegisteredBlockNumber Block number when user registered their stealth keys (if known)
+   * @param Signer Signer with provider to use for fetching the block number (if not known) from the StealthKeyRegistry contract
+   * @param address Address of the user for fetching the block number (if not known) from the subgraph or StealthKeyRegistry contract
    * @param overrides Override the start and end block used for scanning;
    * @returns A list of Announcement events supplemented with additional metadata, such as the sender, block,
    * timestamp, and txhash
+   * @dev If the registered block number is not known, it will be fetched from the subgraph or the StealthKeyRegistry contract
    */
   async *fetchSomeAnnouncements(
+    possibleRegisteredBlockNumber: number | undefined,
     Signer: JsonRpcSigner,
     address: string,
     overrides: ScanOverrides = {}
   ): AsyncGenerator<AnnouncementDetail[]> {
-    const registeredBlockNumber = await getBlockNumberUserRegistered(address, Signer.provider, this.chainConfig);
+    const registeredBlockNumber =
+      possibleRegisteredBlockNumber || (await getBlockNumberUserRegistered(address, Signer.provider, this.chainConfig));
     // Get start and end blocks to scan events for
     const startBlock = overrides.startBlock || registeredBlockNumber || this.chainConfig.startBlock;
     const endBlock = overrides.endBlock || 'latest';
diff --git a/umbra-js/src/utils/utils.ts b/umbra-js/src/utils/utils.ts
index 42dd6d45..da95eb38 100644
--- a/umbra-js/src/utils/utils.ts
+++ b/umbra-js/src/utils/utils.ts
@@ -207,8 +207,8 @@ export async function toAddress(name: string, provider: EthersProvider) {
 /**
  * @notice Returns public keys from the recipientId
  * @dev When providing a public key, transaction hash, or address with advanced mode, the spending and viewing
- * public keys will be the same. Only keys retrieved from the StealthKeyRegistry will have different spending
- * and viewing keys
+ * public keys will be the same. Only keys retrieved from the StealthKeyRegistry (or the subgraph) will have different spending
+ * and viewing keys. Additionally, the block number when the user registered will be returned.
  * @param id Recipient identifier, must be an ENS name, CNS name, address, transaction hash, or public key
  * @param provider ethers provider to use
  * @param options Object containing lookup options:
@@ -230,7 +230,7 @@ export async function lookupRecipient(
   const isPublicKey = id.length === 132 && isHexString(id);
   if (supportPubKey && isPublicKey) {
     assertValidPoint(id);
-    return { spendingPublicKey: id, viewingPublicKey: id };
+    return { spendingPublicKey: id, viewingPublicKey: id, block: undefined };
   }
 
   // Check if identifier is a transaction hash. If so, we recover the sender's public keys from the transaction
@@ -238,7 +238,7 @@ export async function lookupRecipient(
   if (supportTxHash && isTxHash) {
     const publicKey = await recoverPublicKeyFromTransaction(id, provider);
     assertValidPoint(publicKey);
-    return { spendingPublicKey: publicKey, viewingPublicKey: publicKey };
+    return { spendingPublicKey: publicKey, viewingPublicKey: publicKey, block: undefined };
   }
 
   // The remaining checks are dependent on the advanced mode option. The provided identifier is now either an
@@ -259,7 +259,11 @@ export async function lookupRecipient(
         stealthKeyChangedEvent.viewingPubKey,
         stealthKeyChangedEvent.viewingPubKeyPrefix.toString()
       );
-      return { spendingPublicKey: spendingPublicKey, viewingPublicKey: viewingPublicKey };
+      return {
+        spendingPublicKey: spendingPublicKey,
+        viewingPublicKey: viewingPublicKey,
+        block: stealthKeyChangedEvent.block,
+      };
     } catch (error) {
       if (error instanceof Error) {
         console.log('Public key subgraph fetch error: ', error.message);
@@ -268,7 +272,8 @@ export async function lookupRecipient(
       }
       console.log('Error using subgraph to lookup receipient stealth keys, will query registry contract');
       const registry = new StealthKeyRegistry(provider);
-      return registry.getStealthKeys(address);
+      const { spendingPublicKey, viewingPublicKey } = await registry.getStealthKeys(address);
+      return { spendingPublicKey, viewingPublicKey, block: undefined };
     }
   }
 
@@ -277,7 +282,7 @@ export async function lookupRecipient(
   if (!txHash) throw new Error('Could not get public key because the provided account has not sent any transactions');
   const publicKey = await recoverPublicKeyFromTransaction(txHash, provider);
   assertValidPoint(publicKey);
-  return { spendingPublicKey: publicKey, viewingPublicKey: publicKey };
+  return { spendingPublicKey: publicKey, viewingPublicKey: publicKey, block: undefined };
 }
 
 export async function getBlockNumberUserRegistered(

From 8599e8eb85ffd6beee00a522047ac6da29b0026e Mon Sep 17 00:00:00 2001
From: John Feras <jferas@ferasinfotech.com>
Date: Wed, 8 May 2024 14:45:51 -0400
Subject: [PATCH 42/48] Remove unneeded 'block: undefined' return values from
 'lookupRecipient' function

---
 umbra-js/src/utils/utils.ts | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/umbra-js/src/utils/utils.ts b/umbra-js/src/utils/utils.ts
index da95eb38..eeae62e9 100644
--- a/umbra-js/src/utils/utils.ts
+++ b/umbra-js/src/utils/utils.ts
@@ -230,7 +230,7 @@ export async function lookupRecipient(
   const isPublicKey = id.length === 132 && isHexString(id);
   if (supportPubKey && isPublicKey) {
     assertValidPoint(id);
-    return { spendingPublicKey: id, viewingPublicKey: id, block: undefined };
+    return { spendingPublicKey: id, viewingPublicKey: id };
   }
 
   // Check if identifier is a transaction hash. If so, we recover the sender's public keys from the transaction
@@ -238,7 +238,7 @@ export async function lookupRecipient(
   if (supportTxHash && isTxHash) {
     const publicKey = await recoverPublicKeyFromTransaction(id, provider);
     assertValidPoint(publicKey);
-    return { spendingPublicKey: publicKey, viewingPublicKey: publicKey, block: undefined };
+    return { spendingPublicKey: publicKey, viewingPublicKey: publicKey };
   }
 
   // The remaining checks are dependent on the advanced mode option. The provided identifier is now either an
@@ -273,7 +273,7 @@ export async function lookupRecipient(
       console.log('Error using subgraph to lookup receipient stealth keys, will query registry contract');
       const registry = new StealthKeyRegistry(provider);
       const { spendingPublicKey, viewingPublicKey } = await registry.getStealthKeys(address);
-      return { spendingPublicKey, viewingPublicKey, block: undefined };
+      return { spendingPublicKey, viewingPublicKey };
     }
   }
 
@@ -282,7 +282,7 @@ export async function lookupRecipient(
   if (!txHash) throw new Error('Could not get public key because the provided account has not sent any transactions');
   const publicKey = await recoverPublicKeyFromTransaction(txHash, provider);
   assertValidPoint(publicKey);
-  return { spendingPublicKey: publicKey, viewingPublicKey: publicKey, block: undefined };
+  return { spendingPublicKey: publicKey, viewingPublicKey: publicKey };
 }
 
 export async function getBlockNumberUserRegistered(

From 3958d855c97021d2f9559593afb2b868481e8a11 Mon Sep 17 00:00:00 2001
From: garyghayrat <gary.ghayrat@pm.me>
Date: Tue, 21 May 2024 16:55:59 -0400
Subject: [PATCH 43/48] Query 10k announcements unless it's Gnosis subgraph

---
 umbra-js/src/utils/utils.ts | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/umbra-js/src/utils/utils.ts b/umbra-js/src/utils/utils.ts
index eeae62e9..f99d5d99 100644
--- a/umbra-js/src/utils/utils.ts
+++ b/umbra-js/src/utils/utils.ts
@@ -438,8 +438,9 @@ export async function* recursiveGraphFetch(
     method: 'POST',
     headers: { 'Content-Type': 'application/json' },
     body: JSON.stringify({
+      // Gnosis chain is using Goldsky subgraph, which only supports 1000 blocks per query.
       query: query(`
-        first: 1000,
+        first: ${url.includes('umbra-xdai') ? 1000 : 10000},
         orderBy: id,
         orderDirection: desc,
         where: {

From 637f0fa857c8282f9562a72677b2f459b7bb816a Mon Sep 17 00:00:00 2001
From: garyghayrat <gary.ghayrat@pm.me>
Date: Wed, 5 Jun 2024 16:35:52 -0400
Subject: [PATCH 44/48] Update `umbra-js` version and add `.npmignore`

---
 frontend/package.json | 2 +-
 umbra-js/.npmignore   | 1 +
 2 files changed, 2 insertions(+), 1 deletion(-)

diff --git a/frontend/package.json b/frontend/package.json
index b3301757..725ef15a 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -20,7 +20,7 @@
     "@adraffy/ens-normalize": "1.9.2",
     "@metamask/jazzicon": "^2.0.0",
     "@quasar/extras": "^1.15.8",
-    "@umbracash/umbra-js": "file:../umbra-js",
+    "@umbracash/umbra-js": "0.2.0",
     "@uniswap/token-lists": "^1.0.0-beta.19",
     "@unstoppabledomains/resolution": "8.5.0",
     "@web3-onboard/coinbase": "2.2.7",
diff --git a/umbra-js/.npmignore b/umbra-js/.npmignore
index e69de29b..2eea525d 100644
--- a/umbra-js/.npmignore
+++ b/umbra-js/.npmignore
@@ -0,0 +1 @@
+.env
\ No newline at end of file

From 7fc2c243ce813d4fafd897547231012c7ddec147 Mon Sep 17 00:00:00 2001
From: John Feras <jferas@ferasinfotech.com>
Date: Mon, 10 Jun 2024 13:02:53 -0400
Subject: [PATCH 45/48] Changed public key acquisition to query registry
 contract before subgraph.. umbra-js change

---
 frontend/package.json       |  2 +-
 umbra-js/src/utils/utils.ts | 22 +++++++++++-----------
 2 files changed, 12 insertions(+), 12 deletions(-)

diff --git a/frontend/package.json b/frontend/package.json
index 725ef15a..b3301757 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -20,7 +20,7 @@
     "@adraffy/ens-normalize": "1.9.2",
     "@metamask/jazzicon": "^2.0.0",
     "@quasar/extras": "^1.15.8",
-    "@umbracash/umbra-js": "0.2.0",
+    "@umbracash/umbra-js": "file:../umbra-js",
     "@uniswap/token-lists": "^1.0.0-beta.19",
     "@unstoppabledomains/resolution": "8.5.0",
     "@web3-onboard/coinbase": "2.2.7",
diff --git a/umbra-js/src/utils/utils.ts b/umbra-js/src/utils/utils.ts
index f99d5d99..d5aaa188 100644
--- a/umbra-js/src/utils/utils.ts
+++ b/umbra-js/src/utils/utils.ts
@@ -247,8 +247,18 @@ export async function lookupRecipient(
 
   // If we're not using advanced mode, use the StealthKeyRegistry events
   if (!advanced) {
-    // Fetch the stealth key registry event from the subgraph and fall back to the registry contract if the subgraph returns an error
+    // Fetch the stealth key registry event from the the registry contract and fall back to subgraph if the registry contract fetch returns an error
     try {
+      const registry = new StealthKeyRegistry(provider);
+      const { spendingPublicKey, viewingPublicKey } = await registry.getStealthKeys(address);
+      return { spendingPublicKey, viewingPublicKey };
+    } catch (error) {
+      if (error instanceof Error) {
+        console.log('StrealthKey Registry fetch error: ', error.message);
+      } else {
+        console.log('An unknown error occurred: ', error);
+      }
+      console.log('Error using Registry contract to lookup receipient stealth keys, will query subgraph');
       const chainConfig = parseChainConfig(chainId);
       const stealthKeyChangedEvent = await getMostRecentSubgraphStealthKeyChangedEventFromAddress(address, chainConfig);
       const spendingPublicKey = KeyPair.getUncompressedFromX(
@@ -264,16 +274,6 @@ export async function lookupRecipient(
         viewingPublicKey: viewingPublicKey,
         block: stealthKeyChangedEvent.block,
       };
-    } catch (error) {
-      if (error instanceof Error) {
-        console.log('Public key subgraph fetch error: ', error.message);
-      } else {
-        console.log('An unknown error occurred: ', error);
-      }
-      console.log('Error using subgraph to lookup receipient stealth keys, will query registry contract');
-      const registry = new StealthKeyRegistry(provider);
-      const { spendingPublicKey, viewingPublicKey } = await registry.getStealthKeys(address);
-      return { spendingPublicKey, viewingPublicKey };
     }
   }
 

From 798d5128db9fdc26b439d6bcd0cde28323e628c6 Mon Sep 17 00:00:00 2001
From: John Feras <jferas@ferasinfotech.com>
Date: Mon, 24 Jun 2024 16:15:52 -0400
Subject: [PATCH 46/48] Fix to return proper error string when public address
 not found in subgraph

---
 umbra-js/src/utils/utils.ts | 26 +++++++++++++++-----------
 umbra-js/test/utils.test.ts |  1 +
 2 files changed, 16 insertions(+), 11 deletions(-)

diff --git a/umbra-js/src/utils/utils.ts b/umbra-js/src/utils/utils.ts
index d5aaa188..8ccbd26a 100644
--- a/umbra-js/src/utils/utils.ts
+++ b/umbra-js/src/utils/utils.ts
@@ -329,19 +329,23 @@ export async function getMostRecentSubgraphStealthKeyChangedEventFromAddress(
     chainConfig
   );
   let theEvent: SubgraphStealthKeyChangedEvent | undefined;
-  for await (const event of stealthKeyChangedEvents) {
-    for (let i = 0; i < event.length; i++) {
-      if (theEvent) {
-        console.log(
-          `We found a previous StealthKeyChangedEvent for address ${address} in the subgraph at block ${event[i].block} with transaction hash ${event[i].txHash}`
-        );
-      } else {
-        theEvent = event[i];
-        console.log(
-          `We found a StealthKeyChangedEvent for address ${address} in the subgraph at block ${event[i].block} with transaction hash ${event[i].txHash}`
-        );
+  try {
+    for await (const event of stealthKeyChangedEvents) {
+      for (let i = 0; i < event.length; i++) {
+        if (theEvent) {
+          console.log(
+            `We found a previous StealthKeyChangedEvent for address ${address} in the subgraph at block ${event[i].block} with transaction hash ${event[i].txHash}`
+          );
+        } else {
+          theEvent = event[i];
+          console.log(
+            `We found a StealthKeyChangedEvent for address ${address} in the subgraph at block ${event[i].block} with transaction hash ${event[i].txHash}`
+          );
+        }
       }
     }
+  } catch (error) {
+    throw new Error(`Address ${address} has not registered stealth keys. Please ask them to setup their Umbra account`); // prettier-ignore
   }
 
   if (!theEvent) {
diff --git a/umbra-js/test/utils.test.ts b/umbra-js/test/utils.test.ts
index 37ae2afa..9374c0c5 100644
--- a/umbra-js/test/utils.test.ts
+++ b/umbra-js/test/utils.test.ts
@@ -242,6 +242,7 @@ describe('Utilities', () => {
       );
     });
 
+    // prove test failure is related to the ordering of RPC query vs subgraph query, and subgraph URL is not setup
     it('throws when looking up an address that has not sent a transaction', async () => {
       const address = '0x0000000000000000000000000000000000000002';
       const ethersProvider = new StaticJsonRpcProvider(SEPOLIA_RPC_URL); // otherwise throws with unsupported network since we're on localhost

From 08ec0c3305940e0b493aab9fa734d01566c74102 Mon Sep 17 00:00:00 2001
From: John Feras <jferas@ferasinfotech.com>
Date: Thu, 11 Jul 2024 17:55:22 -0400
Subject: [PATCH 47/48] Update UmbraJs version to 0.2.1

---
 umbra-js/package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/umbra-js/package.json b/umbra-js/package.json
index f5566eee..95b81a59 100644
--- a/umbra-js/package.json
+++ b/umbra-js/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@umbracash/umbra-js",
-  "version": "0.2.0",
+  "version": "0.2.1",
   "description": "Send and receive stealth payments",
   "main": "build/src/index.js",
   "types": "build/src/index.d.ts",

From 3a23a1a5d4c2ce8c77c1acfee8d4d42573c05496 Mon Sep 17 00:00:00 2001
From: garyghayrat <gary.ghayrat@pm.me>
Date: Fri, 12 Jul 2024 15:10:56 -0400
Subject: [PATCH 48/48] Use umbra-js@0.2.1 in frontend

---
 frontend/package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/package.json b/frontend/package.json
index b3301757..abae9b6d 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -20,7 +20,7 @@
     "@adraffy/ens-normalize": "1.9.2",
     "@metamask/jazzicon": "^2.0.0",
     "@quasar/extras": "^1.15.8",
-    "@umbracash/umbra-js": "file:../umbra-js",
+    "@umbracash/umbra-js": "0.2.1",
     "@uniswap/token-lists": "^1.0.0-beta.19",
     "@unstoppabledomains/resolution": "8.5.0",
     "@web3-onboard/coinbase": "2.2.7",