Skip to content

Optimize address caching with two-level structure to persist across network switches #63

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
Corey-Code merged 5 commits into from
Feb 3, 2026
Merged

Optimize address caching with two-level structure to persist across network switches #63

Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
9de96c4
Initial plan
Copilot Feb 3, 2026
3d922ab
Implement two-level cache for Bitcoin and EVM addresses
Copilot Feb 3, 2026
2d3e4da
Fix infinite loop in cache dependency arrays
Copilot Feb 3, 2026
b76bb01
Refactor cache to use useRef instead of setState for reads
Copilot Feb 3, 2026
188b571
Merge branch 'feature/changes-and-improvements' into copilot/sub-pr-5…
Corey-Code Feb 3, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
131 changes: 90 additions & 41 deletions src/popup/pages/Dashboard.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import React, { useEffect, useState } from 'react';
import React, { useEffect, useState, useRef } from 'react';
import {
Box,
VStack,
Expand Down Expand Up @@ -108,10 +108,13 @@ const Dashboard: React.FC<DashboardProps> = ({
const [addingLoading, setAddingLoading] = useState(false);
const [bitcoinAddress, setBitcoinAddress] = useState<string>('');
const [loadingBtcAddress, setLoadingBtcAddress] = useState(false);
// Cache of Bitcoin addresses for all accounts: cosmosAddress -> address
const [bitcoinAddressCache, setBitcoinAddressCache] = useState<Map<string, string>>(new Map());
// Cache of EVM addresses for all accounts: cosmosAddress -> address
const [evmAddressCache, setEvmAddressCache] = useState<Map<string, string>>(new Map());
// Cache of Bitcoin addresses for all accounts: cosmosAddress -> networkId -> address
// Using refs to avoid including in dependencies while maintaining cache across renders
const bitcoinAddressCacheRef = useRef<Map<string, Map<string, string>>>(new Map());
const [, setBitcoinAddressCacheTrigger] = useState(0); // Trigger re-render when cache updates
// Cache of EVM addresses for all accounts: cosmosAddress -> networkId -> address
const evmAddressCacheRef = useRef<Map<string, Map<string, string>>>(new Map());
const [, setEvmAddressCacheTrigger] = useState(0); // Trigger re-render when cache updates
// Network tab: 0 = All, 1 = Cosmos, 2 = UTXO, 3 = EVM
const [networkTab, setNetworkTab] = useState(0);

Expand Down Expand Up @@ -175,16 +178,14 @@ const Dashboard: React.FC<DashboardProps> = ({
const [evmAddress, setEvmAddress] = useState<string>('');
const [loadingEvmAddress, setLoadingEvmAddress] = useState(false);

// Clear Bitcoin address immediately when chain changes to prevent stale address usage
// Clear Bitcoin address display immediately when chain changes to prevent stale address display
useEffect(() => {
setBitcoinAddress('');
setBitcoinAddressCache(new Map());
}, [selectedChainId]);

// Clear EVM address immediately when chain changes
// Clear EVM address display immediately when chain changes
useEffect(() => {
setEvmAddress('');
setEvmAddressCache(new Map());
}, [selectedChainId]);

// Derive Bitcoin address when Bitcoin network is selected
Expand Down Expand Up @@ -227,55 +228,101 @@ const Dashboard: React.FC<DashboardProps> = ({
useEffect(() => {
if (isBitcoinSelected && accounts.length > 0) {
const deriveAllBitcoinAddresses = async () => {
const newCache = new Map<string, string>();
// Check current cache and collect addresses to derive
const addressesToDerive: Array<{ account: typeof accounts[0]; cosmosAddress: string }> = [];

for (const account of accounts) {
try {
// Pass cosmosAddress to identify imported accounts
const addr = await getBitcoinAddress(
selectedChainId,
account.accountIndex,
account.address
);
if (addr) {
newCache.set(account.address, addr);
const accountCache = bitcoinAddressCacheRef.current.get(account.address);
if (!accountCache?.has(selectedChainId)) {
// Mark this address for derivation
addressesToDerive.push({ account, cosmosAddress: account.address });
}
}

// Derive missing addresses
if (addressesToDerive.length > 0) {
const derivedAddresses = new Map<string, string>();
for (const { account, cosmosAddress } of addressesToDerive) {
try {
// Pass cosmosAddress to identify imported accounts
const addr = await getBitcoinAddress(
selectedChainId,
account.accountIndex,
cosmosAddress
);
if (addr) {
derivedAddresses.set(cosmosAddress, addr);
}
} catch (err) {
console.error(`Failed to derive Bitcoin address for account ${cosmosAddress}:`, err);
}
} catch (err) {
console.error(`Failed to derive Bitcoin address for account ${account.address}:`, err);
}

// Update cache with newly derived addresses
if (derivedAddresses.size > 0) {
for (const [cosmosAddress, address] of derivedAddresses) {
const accountCache = bitcoinAddressCacheRef.current.get(cosmosAddress);
const updatedAccountCache = accountCache ? new Map(accountCache) : new Map<string, string>();
updatedAccountCache.set(selectedChainId, address);
bitcoinAddressCacheRef.current.set(cosmosAddress, updatedAccountCache);
}
// Trigger re-render to update UI
setBitcoinAddressCacheTrigger((prev) => prev + 1);
}
}
setBitcoinAddressCache(newCache);
};
deriveAllBitcoinAddresses();
} else {
setBitcoinAddressCache(new Map());
}
}, [isBitcoinSelected, selectedChainId, accounts, getBitcoinAddress]);

// Derive EVM addresses for all accounts when EVM network is selected
useEffect(() => {
if (isEvmSelected && accounts.length > 0) {
const deriveAllEvmAddresses = async () => {
const newCache = new Map<string, string>();
// Check current cache and collect addresses to derive
const addressesToDerive: Array<{ account: typeof accounts[0]; cosmosAddress: string }> = [];

for (const account of accounts) {
try {
// Pass cosmosAddress to identify imported accounts
const addr = await getEvmAddress(
selectedChainId,
account.accountIndex,
account.address
);
if (addr) {
newCache.set(account.address, addr);
const accountCache = evmAddressCacheRef.current.get(account.address);
if (!accountCache?.has(selectedChainId)) {
// Mark this address for derivation
addressesToDerive.push({ account, cosmosAddress: account.address });
}
}

// Derive missing addresses
if (addressesToDerive.length > 0) {
const derivedAddresses = new Map<string, string>();
for (const { account, cosmosAddress } of addressesToDerive) {
try {
// Pass cosmosAddress to identify imported accounts
const addr = await getEvmAddress(
selectedChainId,
account.accountIndex,
cosmosAddress
);
if (addr) {
derivedAddresses.set(cosmosAddress, addr);
}
} catch (err) {
console.error(`Failed to derive EVM address for account ${cosmosAddress}:`, err);
}
} catch (err) {
console.error(`Failed to derive EVM address for account ${account.address}:`, err);
}

// Update cache with newly derived addresses
if (derivedAddresses.size > 0) {
for (const [cosmosAddress, address] of derivedAddresses) {
const accountCache = evmAddressCacheRef.current.get(cosmosAddress);
const updatedAccountCache = accountCache ? new Map(accountCache) : new Map<string, string>();
updatedAccountCache.set(selectedChainId, address);
evmAddressCacheRef.current.set(cosmosAddress, updatedAccountCache);
}
// Trigger re-render to update UI
setEvmAddressCacheTrigger((prev) => prev + 1);
}
}
setEvmAddressCache(newCache);
};
deriveAllEvmAddresses();
} else {
setEvmAddressCache(new Map());
}
}, [isEvmSelected, selectedChainId, accounts, getEvmAddress]);

Expand Down Expand Up @@ -361,13 +408,15 @@ const Dashboard: React.FC<DashboardProps> = ({
const getAccountChainAddress = (account: { address: string; accountIndex?: number }) => {
// For Bitcoin, use cached derived address (keyed by cosmos address)
if (isBitcoinSelected) {
const cachedAddr = bitcoinAddressCache.get(account.address);
const accountCache = bitcoinAddressCacheRef.current.get(account.address);
const cachedAddr = accountCache?.get(selectedChainId);
return cachedAddr || 'Deriving...';
}

// For EVM, use cached derived address (keyed by cosmos address)
if (isEvmSelected) {
const cachedAddr = evmAddressCache.get(account.address);
const accountCache = evmAddressCacheRef.current.get(account.address);
const cachedAddr = accountCache?.get(selectedChainId);
return cachedAddr || 'Deriving...';
}

Expand Down