feat(ui): show rescanning alert on Wallets page

src/components/CreateWallet.tsx

@@ -108,7 +108,7 @@ export default function CreateWallet({ parentRoute, startWallet }: CreateWalletP
 
   const isCreated = useMemo(() => !!createdWallet?.walletFileName && !!createdWallet?.auth, [createdWallet])
   const canCreate = useMemo(
-    () => !createdWallet && !serviceInfo?.walletFileName && !serviceInfo?.rescanning,
+    () => !isCreated && !serviceInfo?.walletFileName && !serviceInfo?.rescanning,
     [isCreated, serviceInfo],
   )
 

src/components/Wallets.test.tsx

@@ -6,7 +6,6 @@ import user from '@testing-library/user-event'
 import * as apiMock from '../libs/JmWalletApi'
 
 import Wallets from './Wallets'
-import { walletDisplayName } from '../utils'
 import { CurrentWallet } from '../context/WalletContext'
 
 jest.mock('../libs/JmWalletApi', () => ({
@@ -44,7 +43,7 @@ describe('<Wallets />', () => {
     ;(apiMock.getGetinfo as jest.Mock).mockResolvedValue(neverResolvingPromise)
   })
 
-  it('should render without errors', () => {
+  it('should display loading indicator while fetching data', () => {
     const neverResolvingPromise = new Promise(() => {})
     ;(apiMock.getSession as jest.Mock).mockResolvedValueOnce(neverResolvingPromise)
     ;(apiMock.getWalletAll as jest.Mock).mockResolvedValueOnce(neverResolvingPromise)
@@ -75,6 +74,24 @@ describe('<Wallets />', () => {
     expect(screen.getByText('wallets.button_new_wallet')).toBeInTheDocument()
   })
 
+  it('should display alert when rescanning is active', async () => {
+    ;(apiMock.getWalletAll as jest.Mock).mockResolvedValueOnce({
+      ok: false,
+    })
+    ;(apiMock.getSession as jest.Mock).mockResolvedValueOnce({
+      ok: true,
+      json: () =>
+        Promise.resolve({
+          rescanning: true,
+        }),
+    })
+
+    await act(async () => setup({}))
+
+    expect(screen.getByText('wallets.title')).toBeVisible()
+    expect(screen.getByTestId('alert-rescanning')).toBeVisible()
+  })
+
   it('should display big call-to-action buttons if no wallet has been created yet', async () => {
     ;(apiMock.getSession as jest.Mock).mockResolvedValueOnce({
       ok: true,

src/components/Wallets.tsx

@@ -210,6 +210,11 @@ export default function Wallets({ currentWallet, startWallet, stopWallet }: Wall
           subtitle={walletList?.length === 0 ? t('wallets.subtitle_no_wallets') : undefined}
           center={true}
         />
+        {serviceInfo?.rescanning === true && (
+          <rb.Alert variant="info" data-testid="alert-rescanning">
+            {t('app.alert_rescan_in_progress')}
+          </rb.Alert>
+        )}
         {alert && <Alert {...alert} />}
         {isLoading ? (
           <div className="d-flex justify-content-center align-items-center">