From 0ea66cc847cace6b12f01c7ccebe71fb5eabf759 Mon Sep 17 00:00:00 2001
From: marcomariscal <42938673+marcomariscal@users.noreply.github.com>
Date: Thu, 11 Jul 2024 12:06:27 -0700
Subject: [PATCH] feat: save user announcements to local storage and last
 fetched block (#685)

* feat: set the last fetched block as the start block

* feat: handle caching user announcements and latest fetched block

* feat: show user announcements if there are any

* fix: handle watching/loading announcements

* fix: parse out lastFetchedBlock and fix user announcement loading logic

* chore: log

* feat: handle block data caching

* feat: show most recent block data if exists

* fix: type check

* feat: handle user announcements already present and sign language

* feat: only show fetching when no user announcements

* feat: fetching latest from last fetched block component

* feat: fetching latest translation for cn

* feat: clear local storage button and functionality

* fix: start block handling logic

* feat: dedupe user announcements

* fix: logic

* fix: minimize debugging logs on userAnnouncement changes

* feat: handle scanning latest announcements from last fetched block

* feat: sort by timestamp explicitly

* feat: no loading sequence when there are announcements

* fix: need sig lately verbiage

* fix: add need sig lately to cn

* fix: little more mb

* fix: no withdraw verbiage on need-sig-lately

* feat: handle need sig

* Update frontend/src/i18n/locales/en-US.json

Co-authored-by: Gary Ghayrat <61768337+garyghayrat@users.noreply.github.com>

* feat: handle sign button instead of needs sig

* Update frontend/src/i18n/locales/zh-CN.json

Co-authored-by: Gary Ghayrat <61768337+garyghayrat@users.noreply.github.com>

* fix: move local storage clear button above lang

* fix: spacing more uniform

* fix: use computed ref as param, and set setIsInWithdrawFlow to false on mount

* feat: sign and withdraw

* 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>

* fix: use balanceIndex to ensure that the correct balance is fetched from the stealthBalances array

* fix: dedupe by tx hash and receiver instead of just tx hash

* fix: include receiver to derive isWithdrawn

* fix: img

---------

Co-authored-by: Gary Ghayrat <61768337+garyghayrat@users.noreply.github.com>
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 -
 .../src/components/AccountReceiveTable.vue    |  99 +++++-
 frontend/src/components/WithdrawForm.vue      |  56 +++-
 frontend/src/i18n/locales/en-US.json          |   6 +
 frontend/src/i18n/locales/zh-CN.json          |   7 +
 frontend/src/layouts/BaseLayout.vue           |  28 +-
 frontend/src/pages/AccountReceive.vue         | 289 ++++++++++++++++--
 frontend/src/store/settings.ts                |   8 +-
 frontend/src/store/wallet.ts                  |   3 +-
 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 +--
 21 files changed, 490 insertions(+), 104 deletions(-)

diff --git a/.github/workflows/ci.yaml b/.github/workflows/ci.yaml
index 375b1173b..630cdb469 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 4777fb8b0..b7951bc4b 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 4d6262955..87a435aa5 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 0ce27a100..5f29461a0 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 31ead2d4a..d840a5d5c 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 cd7c29a0a..db28cd580 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 aeb185f33..4fd04797c 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 65f1b602d..25eb3c20e 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 ee9dccc1b..3062ba0bd 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/frontend/src/components/AccountReceiveTable.vue b/frontend/src/components/AccountReceiveTable.vue
index b1147bdd3..a6858921e 100644
--- a/frontend/src/components/AccountReceiveTable.vue
+++ b/frontend/src/components/AccountReceiveTable.vue
@@ -60,12 +60,45 @@
         >.
       </div>
 
-      <div v-if="scanStatus === 'complete'" 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) }}
+      <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 -->
+          <div class="block-data">
+            {{ $t('AccountReceiveTable.most-recent-announcement') }}
+            {{ mostRecentAnnouncementBlockNumber }} /
+            {{ formatDate(mostRecentAnnouncementTimestamp * 1000) }}
+            {{ formatTime(mostRecentAnnouncementTimestamp * 1000) }}
+          </div>
+
+          <!-- 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>
+
         <div v-if="advancedMode" class="text-caption q-mb-sm">
           {{ $t('AccountReceiveTable.most-recent-mined') }}
           {{ mostRecentBlockNumber }} /
@@ -385,7 +418,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';
@@ -461,7 +494,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 };
@@ -542,13 +575,17 @@ 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 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 = [...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[] = [];
@@ -584,9 +621,19 @@ 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 && newAnnouncement.receiver === announcement.receiver
+      );
+
+      if (isNewAnnouncement) {
+        const balanceIndex = userAnnouncements.value.findIndex(
+          (a) => a.txHash === announcement.txHash && a.receiver === announcement.receiver
+        );
+        const stealthBalance = stealthBalances[balanceIndex];
+        announcement.isWithdrawn = stealthBalance.lt(announcement.amount);
+      }
     });
     isLoading.value = false;
   });
@@ -676,7 +723,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);
@@ -837,6 +884,10 @@ export default defineComponent({
       }
     );
 
+    onMounted(() => {
+      setIsInWithdrawFlow(false);
+    });
+
     return {
       advancedMode,
       context,
@@ -848,7 +899,7 @@ export default defineComponent({
       userAnnouncements,
       setIsInWithdrawFlow,
       ...useAdvancedFeatures(spendingKeyPair.value),
-      ...useReceivedFundsTable(userAnnouncements, spendingKeyPair.value),
+      ...useReceivedFundsTable(userAnnouncements, spendingKeyPair),
     };
   },
 });
@@ -869,4 +920,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/components/WithdrawForm.vue b/frontend/src/components/WithdrawForm.vue
index 3659e3da8..2dba5ccbe 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);
-          "
-          :appendButtonLabel="$t('WithdrawForm.withdraw')"
-          :appendButtonDisable="isInWithdrawFlow || isFeeLoading"
+          @click="handleSubmit"
+          :appendButtonLabel="needSignature ? $t('WithdrawForm.need-signature') : $t('WithdrawForm.withdraw')"
+          :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">
@@ -119,26 +116,61 @@ export default defineComponent({
     advancedMode: {
       type: Boolean,
       required: true,
+      default: true,
     },
   },
   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,
-      nativeTokenSymbol,
+      formatUnits,
+      handleSubmit,
+      humanizeTokenAmount,
       isInWithdrawFlow,
+      isSigningInProgress,
+      nativeTokenSymbol,
+      needSignature,
       setIsInWithdrawFlow,
     };
   },
diff --git a/frontend/src/i18n/locales/en-US.json b/frontend/src/i18n/locales/en-US.json
index 175468855..00cb6d0da 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, announcements, and wallet connection.",
     "connect-wallet": "Connect Wallet",
     "settings": "Settings",
     "dark-mode": "Dark mode",
@@ -105,6 +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",
     "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",
@@ -117,8 +120,10 @@
     "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...",
+    "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"
   },
@@ -353,6 +358,7 @@
     "view-on-explorer": "View on explorer"
   },
   "WithdrawForm": {
+    "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 f225bd208..e43ed368b 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": "深色模式",
@@ -106,6 +108,7 @@
     "connect-your-wallet": "连接您的钱包以扫描收到的资金",
     "connect-wallet": "链接钱包",
     "need-signature": "此应用程序需要您的签名才能扫描您收到的资金",
+    "need-signature-lately": "签名以扫描最近收到的资金或提取资金",
     "scan-funds": "点击下方来扫描您收到的资金",
     "sign": "签名",
     "scan": "扫描",
@@ -117,8 +120,11 @@
     "prv-key": "私钥",
     "fetching": "在获取所有的公告...",
     "fetching-latest": "在获取最新的 10，000 条公告...",
+    "fetching-latest-from-last-fetched-block": "正在获取最新公告...",
     "scanning": "在所有的公告中扫描资金...",
+
     "scanning-latest": "在最新公告中扫描资金...",
+    "scanning-latest-from-last-fetched-block": "在最新公告中扫描资金...",
     "wait": "这可能需要几分钟，具体取决于您的连接和设备。这是正常的 — 请耐心等待。",
     "stop": "停止"
   },
@@ -351,6 +357,7 @@
     "view-on-explorer": "在区块链浏览器上查看"
   },
   "WithdrawForm": {
+    "need-signature": "签名并提取",
     "withdraw-address": "输入提款地址",
     "address": "地址",
     "fetching-fee-estimate": "在接收费用估计...",
diff --git a/frontend/src/layouts/BaseLayout.vue b/frontend/src/layouts/BaseLayout.vue
index 83db2dc4e..d2a5f5bf2 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"
@@ -223,6 +237,7 @@
               option-label="label"
               rounded
             />
+
             <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,
diff --git a/frontend/src/pages/AccountReceive.vue b/frontend/src/pages/AccountReceive.vue
index 63442477d..84eb743a4 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,18 +24,23 @@
     <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">
-          {{ $t('Receive.need-signature') }}
+        <div v-if="needsSignature" class="text-center q-my-md">
+          <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
           @click="getPrivateKeysHandler"
-          class="text-center"
+          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>
@@ -70,8 +75,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"
@@ -84,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"
@@ -107,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')"
@@ -119,7 +124,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,33 +136,151 @@ 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'
     | 'fetching latest'
     | 'scanning'
     | 'scanning latest'
+    | 'scanning latest from last fetched block'
     | 'complete'
     | 'complete latest';
   const scanStatus = ref<ScanStatus>('waiting');
   const scanPercentage = ref<number>(0);
-  const userAnnouncements = ref<UserAnnouncement[]>([]);
-  const workers: Worker[] = [];
-  const paused = ref(false);
-
-  const mostRecentAnnouncementTimestamp = ref<number>(0);
-  const mostRecentAnnouncementBlockNumber = 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>();
+  const mostRecentAnnouncementBlockNumber = ref<number>();
   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 } =
-    useSettingsStore();
+  const {
+    advancedMode,
+    startBlock,
+    endBlock,
+    setScanBlocks,
+    setScanPrivateKey,
+    scanPrivateKey,
+    resetScanSettings: resetScanSettingsInSettingsStore,
+  } = useSettingsStore();
   const { signer, userAddress: userWalletAddress, isAccountSetup, provider } = useWalletStore();
-  const startBlockLocal = ref<number>();
-  const endBlockLocal = ref<number>();
+
+  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:', lastFetchedBlock);
+      if (lastFetchedBlock) {
+        startBlockLocal.value = Number(lastFetchedBlock);
+        setScanBlocks(Number(lastFetchedBlock), endBlockLocal.value);
+        return Number(lastFetchedBlock);
+      }
+    }
+
+    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 loadUserAnnouncements() {
+    if (!userAnnouncementsLocalStorageKey.value) return;
+
+    const storedAnnouncements = deserializeUserAnnouncements(
+      LocalStorage.getItem(userAnnouncementsLocalStorageKey.value)
+    );
+
+    if (!storedAnnouncements) {
+      window.logger.debug('No announcements found in local storage for key:', userAnnouncementsLocalStorageKey.value);
+      return;
+    }
+
+    userAnnouncements.value = storedAnnouncements;
+    window.logger.debug('Announcements loaded:', userAnnouncements.value);
+
+    return storedAnnouncements;
+  }
+
+  function resetUserAnnouncements() {
+    userAnnouncements.value = [];
+    if (userAnnouncementsLocalStorageKey.value) LocalStorage.remove(userAnnouncementsLocalStorageKey.value);
+  }
+
+  function deduplicateAnnouncements(announcements: UserAnnouncement[]) {
+    const seen = new Set();
+    return announcements.filter((announcement) => {
+      // 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;
+    });
+  }
+
+  // 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...');
+    loadUserAnnouncements();
+  });
+
+  const workers: Worker[] = [];
+  const paused = ref(false);
+
+  // 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>();
   const needsSignature = computed(() => !hasKeys.value && !scanPrivateKeyLocal.value);
   const settingsFormRef = ref<QForm>(); // for programmatically verifying settings form
@@ -179,11 +302,44 @@ function useScan() {
   };
 
   onMounted(async () => {
-    startBlockLocal.value = startBlock.value; // read in last used startBlock
-    endBlockLocal.value = endBlock.value; // read in last used endBlock
+    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, oldVal) => {
+    const serializedNewVal = serializeUserAnnouncements(newVal);
+    const serializedOldVal = serializeUserAnnouncements(oldVal);
+    if (serializedNewVal === serializedOldVal) return;
+
+    if (userAnnouncementsLocalStorageKey.value) {
+      LocalStorage.set(userAnnouncementsLocalStorageKey.value, serializedNewVal);
+      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(),
+      }))
+    );
+  }
+
+  // Deserialize userAnnouncements from LocalStorage
+  function deserializeUserAnnouncements(serialized: string | null) {
+    if (!serialized) return null;
+
+    return JSON.parse(serialized).map((announcement: UserAnnouncement) => ({
+      ...announcement,
+      amount: BigNumber.from(announcement.amount),
+    })) as UserAnnouncement[];
+  }
+
   async function getPrivateKeysHandler() {
     // Validate form and reset userAnnouncements
     if (advancedMode.value) {
@@ -238,6 +394,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
@@ -247,6 +405,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
@@ -270,9 +431,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;
@@ -318,6 +481,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,
@@ -331,18 +495,26 @@ 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) {
+                LocalStorage.set(mostRecentAnnouncementTimestampKey.value, thisTimestamp);
+              }
             }
             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) {
+                LocalStorage.set(mostRecentAnnouncementBlockNumberKey.value, thisBlock);
+              }
             }
           });
 
           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 = [];
           }
@@ -355,9 +527,15 @@ 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';
+
+        // 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
@@ -365,17 +543,62 @@ 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, () => {
-    if (userAddress.value) resetState();
+    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();
+
+    // Load the last fetched block
+    const lastFetchedBlock = loadLastFetchedBlock();
+
+    // Load the most recent announcement block data
+    loadUserAnnouncementBlockData();
+
+    if (storedAnnouncements && lastFetchedBlock) {
+      window.logger.debug('User announcements found in local storage:', storedAnnouncements);
+      startBlockLocal.value = lastFetchedBlock;
+      setScanBlocks(lastFetchedBlock, endBlockLocal.value);
+      return;
+    }
+
+    // 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();
+  });
+
+  // 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;
+    }
   });
 
   return {
diff --git a/frontend/src/store/settings.ts b/frontend/src/store/settings.ts
index 308bf265d..82b2ad85b 100644
--- a/frontend/src/store/settings.ts
+++ b/frontend/src/store/settings.ts
@@ -14,6 +14,8 @@ const settings = {
   UmbraApiVersion: 'umbra-api-version',
 };
 
+
+
 // 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
@@ -41,6 +43,7 @@ export default function useSettingsStore() {
     lastWallet.value = LocalStorage.getItem(settings.lastWallet)
       ? String(LocalStorage.getItem(settings.lastWallet))
       : undefined;
+
   });
   setLanguage(
     paramLocale
@@ -92,9 +95,9 @@ 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_;
   }
 
   function setScanPrivateKey(key: string) {
@@ -137,6 +140,7 @@ export default function useSettingsStore() {
     LocalStorage.remove(settings.UmbraApiVersion);
   }
 
+
   return {
     toggleDarkMode,
     toggleAdvancedMode,
diff --git a/frontend/src/store/wallet.ts b/frontend/src/store/wallet.ts
index 5fbb3f6db..e886d1203 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),
   };
 }
 
diff --git a/umbra-js/.env.example b/umbra-js/.env.example
index 0317f16b1..0b36f09e2 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 cf6fe252f..1d97311dc 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 9f6933161..20f1dad15 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 86c42b244..37ae2afa5 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);
     });