From 9346804bf85e58e595fbf67e7cd50d767458927a Mon Sep 17 00:00:00 2001
From: Brian Soltani <brian.i.soltani@gmail.com>
Date: Thu, 30 Jul 2026 13:43:42 -0400
Subject: [PATCH] fix(wallet): keep jars visible and clickable during
 background refetch (#1392)

* fix(wallet): keep jars visible and clickable during background refetch

Gate the jars grid on isLoading instead of isFetching, matching the balance display above it. isFetching is true on every background refetch, so the jars (and the Jar Details overlay they open) were being replaced by a spinner any time wallet data refreshed, even though the previous jars were still valid to show.

* test(wallet): assert jars stay visible during background refetch

Update the jars spinner test to match the new isLoading-based gate. The test now asserts that a jar name stays on screen and the background refetch still calls refetch on click, instead of asserting a spinner appears.

* test(wallet): assert jar overlay opens on click during background refetch
---
 src/components/MainWalletPage.test.tsx | 8 ++++++--
 src/components/MainWalletPage.tsx      | 2 +-
 2 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/src/components/MainWalletPage.test.tsx b/src/components/MainWalletPage.test.tsx
index 5d456415..a2362747 100644
--- a/src/components/MainWalletPage.test.tsx
+++ b/src/components/MainWalletPage.test.tsx
@@ -125,10 +125,14 @@ describe('MainWalletPage', () => {
     expect(refetch).toHaveBeenCalled()
   })
 
-  it('shows a jars spinner while fetching and refreshes on click', () => {
+  it('keeps jars visible and clickable while fetching in the background', () => {
     walletInfo = { ...walletInfo, isFetching: true }
     render(<MainWalletPage walletFileName={walletFileName} />)
-    expect(screen.getByTestId('spinner')).toBeInTheDocument()
+    expect(screen.getByText(jars[0].name)).toBeInTheDocument()
+
+    fireEvent.click(screen.getByText(jars[0].name))
+    expect(screen.getByTestId('WalletJarsDetailsOverlay#open')).toHaveTextContent('open')
+    expect(screen.getByTestId('WalletJarsDetailsOverlay#selectedJarIndex')).toHaveTextContent(String(jars[0].jarIndex))
     fireEvent.click(screen.getByText('global.refresh'))
     expect(refetch).toHaveBeenCalled()
   })
diff --git a/src/components/MainWalletPage.tsx b/src/components/MainWalletPage.tsx
index 3dbcdc4a..a239142f 100644
--- a/src/components/MainWalletPage.tsx
+++ b/src/components/MainWalletPage.tsx
@@ -116,7 +116,7 @@ export default function MainWalletPage({ walletFileName }: MainWalletPageProps)
             </Tooltip>
           </div>
           <div className="flex min-h-[128px] items-center justify-center gap-4">
-            {isFetching ? (
+            {isLoading ? (
               <div className="flex flex-1 items-center justify-center gap-2 py-8">
                 <Spinner className="motion-reduce:hidden" />
                 {t('global.loading')}