fix: Home's list drops the previous network's rows after a network switch (closes #718)

A network switch left the previous network's rows or failure message in Home's
list until the new network's answer landed. Home now replaces them with
"Loading..." when it first draws on a new network. A redraw on the same network
keeps its rows.

Home, AddressDetail and AddressToken compared the page's network before reading
storage. A switch made in Settings could change the page during that read, and
the answer was still drawn. They now compare after the read, for an answer and
for a failure.

Model: opus-5-5

src/popup/views/addressDetail.js

@@ -146,11 +146,12 @@ async function loadTransactions(address) {
         }
 
         // If the network changed during the lookups above, or the screen now
-        // shows another address, nothing is saved or drawn. See
-        // src/shared/storedSettings.js.
+        // shows another address, nothing is saved or drawn. The page's network
+        // is compared after the read of storage, because a switch made on this
+        // page can land during that read. See src/shared/storedSettings.js.
         if (
-            state.networkId !== networkId ||
             !(await storedNetworkIs(networkId)) ||
+            state.networkId !== networkId ||
             $("address-line").dataset.full !== address
         ) {
             return;
@@ -187,8 +188,8 @@ async function loadTransactions(address) {
         // If the network changed, or the screen now shows another address,
         // the failure is not shown.
         if (
-            state.networkId !== networkId ||
             !(await storedNetworkIs(networkId)) ||
+            state.networkId !== networkId ||
             $("address-line").dataset.full !== address
         ) {
             return;

src/popup/views/addressToken.js

@@ -241,11 +241,13 @@ async function loadTransactions(address, tokenId) {
         }
 
         // If the network changed during the lookups above, or the screen now
-        // shows another address or token, nothing is saved or drawn. See
+        // shows another address or token, nothing is saved or drawn. The page's
+        // network is compared after the read of storage, because a switch made
+        // on this page can land during that read. See
         // src/shared/storedSettings.js.
         if (
-            state.networkId !== networkId ||
             !(await storedNetworkIs(networkId)) ||
+            state.networkId !== networkId ||
             $("address-token-line").dataset.full !== address ||
             state.selectedToken !== tokenId
         ) {
@@ -283,8 +285,8 @@ async function loadTransactions(address, tokenId) {
         // If the network changed, or the screen now shows another address or
         // token, the failure is not shown.
         if (
-            state.networkId !== networkId ||
             !(await storedNetworkIs(networkId)) ||
+            state.networkId !== networkId ||
             $("address-token-line").dataset.full !== address ||
             state.selectedToken !== tokenId
         ) {

src/popup/views/home.js

@@ -100,6 +100,9 @@ function renderActiveAddress() {
 
 let homeTxs = [];
 
+// The network that `home-tx-list` holds rows or a message for.
+let listNetworkId = null;
+
 function renderHomeTxList(ctx) {
     const list = $("home-tx-list");
     if (!list) return;
@@ -186,6 +189,19 @@ async function loadHomeTxs(ctx) {
     if (allAddresses.length === 0) return;
 
     const networkId = state.networkId;
+
+    // After a network switch the list still holds the previous network's rows
+    // or failure message. They go here, because every way onto Home draws Home
+    // first. A redraw on the same network keeps its rows.
+    if (listNetworkId !== networkId) {
+        listNetworkId = networkId;
+        const list = $("home-tx-list");
+        if (list) {
+            list.innerHTML =
+                '<div class="text-muted text-xs py-1">Loading...</div>';
+        }
+    }
+
     const filters = {
         hideSpoofedSymbols: state.hideSpoofedSymbols,
         hideLowHolderTokens: state.hideLowHolderTokens,
@@ -206,10 +222,12 @@ async function loadHomeTxs(ctx) {
         const results = await Promise.all(fetches);
 
         // If the network changed during the lookups, nothing is saved or
-        // drawn. See src/shared/storedSettings.js.
+        // drawn. The page's network is compared after the read of storage,
+        // because a switch made on this page can land during that read. See
+        // src/shared/storedSettings.js.
         if (
-            state.networkId !== networkId ||
-            !(await storedNetworkIs(networkId))
+            !(await storedNetworkIs(networkId)) ||
+            state.networkId !== networkId
         ) {
             return;
         }
@@ -250,6 +268,7 @@ async function loadHomeTxs(ctx) {
         merged = filtered.transactions;
         merged.sort((a, b) => b.blockNumber - a.blockNumber);
         homeTxs = merged.slice(0, 25);
+        listNetworkId = networkId;
         renderHomeTxList(ctx);
     } catch (e) {
         // Cancelled by the popup closing, not failed: see pageClosed in
@@ -258,11 +277,12 @@ async function loadHomeTxs(ctx) {
         log.errorf("loadHomeTxs failed:", e.message);
         // If the network changed, the failure is not shown.
         if (
-            state.networkId !== networkId ||
-            !(await storedNetworkIs(networkId))
+            !(await storedNetworkIs(networkId)) ||
+            state.networkId !== networkId
         ) {
             return;
         }
+        listNetworkId = networkId;
         const list = $("home-tx-list");
         if (list) {
             list.innerHTML =