fix: implement proper view navigation stack
All checks were successful
check / check (push) Successful in 13s

The popup UI had no navigation stack — all back buttons were hardcoded
to specific destinations. This meant navigating Main → Address →
Transaction → Settings → Back would go to Main instead of Transaction.

Changes:
- Add viewStack array to persisted state (survives popup close/reopen)
- Add pushCurrentView(), goBack(), clearViewStack() helpers in helpers.js
- goBack() pops the stack and shows the previous view; falls back to
  Main if the stack is empty; re-renders the wallet list when returning
  to the Main view
- All ctx.show*() wrappers in index.js now push the current view before
  navigating forward
- All back buttons across every view now use goBack() instead of
  hardcoded destinations
- Direct showView() calls for forward navigation (Send, Export Private
  Key) push before switching
- Stack is cleared on reset-to-root actions: adding a wallet, deleting
  the last wallet
- After wallet deletion with remaining wallets, stack is reset to
  [main] and settings is re-shown
- After transaction completion (Done button), stack is reset to the
  appropriate address context

Closes #134
This commit is contained in:
user
2026-03-01 13:23:15 -08:00
parent 39db06c83d
commit 0ab202e998
16 changed files with 158 additions and 52 deletions

View File

@@ -10,7 +10,14 @@ const {
} = require("../shared/state");
const { refreshPrices } = require("../shared/prices");
const { refreshBalances } = require("../shared/balances");
const { $, showView } = require("./views/helpers");
const {
$,
showView,
setRenderMain,
pushCurrentView,
goBack,
clearViewStack,
} = require("./views/helpers");
const { applyTheme } = require("./theme");
const home = require("./views/home");
@@ -58,15 +65,42 @@ async function doRefreshAndRender() {
const ctx = {
renderWalletList,
doRefreshAndRender,
showAddWalletView: () => addWallet.show(),
showAddressDetail: () => addressDetail.show(),
showAddressToken: () => addressToken.show(),
showAddTokenView: () => addToken.show(),
showConfirmTx: (txInfo) => confirmTx.show(txInfo),
showReceive: () => receive.show(),
showTransactionDetail: (tx) => transactionDetail.show(tx),
showSettingsView: () => settings.show(),
showSettingsAddTokenView: () => settingsAddToken.show(),
showAddWalletView: () => {
pushCurrentView();
addWallet.show();
},
showAddressDetail: () => {
pushCurrentView();
addressDetail.show();
},
showAddressToken: () => {
pushCurrentView();
addressToken.show();
},
showAddTokenView: () => {
pushCurrentView();
addToken.show();
},
showConfirmTx: (txInfo) => {
pushCurrentView();
confirmTx.show(txInfo);
},
showReceive: () => {
pushCurrentView();
receive.show();
},
showTransactionDetail: (tx) => {
pushCurrentView();
transactionDetail.show(tx);
},
showSettingsView: () => {
pushCurrentView();
settings.show();
},
showSettingsAddTokenView: () => {
pushCurrentView();
settingsAddToken.show();
},
};
// Views that can be fully re-rendered from persisted state.
@@ -220,13 +254,15 @@ async function init() {
.getElementById("view-settings")
.classList.contains("hidden")
) {
renderWalletList();
showView("main");
goBack();
return;
}
pushCurrentView();
settings.show();
});
setRenderMain(renderWalletList);
welcome.init(ctx);
addWallet.init(ctx);
home.init(ctx);