Fix loading state hang when user has no permissions

Fixed UI hanging indefinitely on "Loading..." when users have no
account permissions or when API calls fail.

Problem: When API calls failed (due to no permissions, timeout, or
other errors), the error handlers would show error notifications but
wouldn't clear the loading state. This left data properties as null
or undefined, causing v-if/v-else templates to show spinners forever.

Solution: Set default/empty values in error handlers to clear loading
states and allow UI to render properly:

- loadBalance(): Set balance to {balance: 0, fiat_balances: {}, accounts: []}
- loadTransactions(): Set transactions to [] and pagination.total to 0
- loadAccounts(): Set accounts to []

Now when API calls fail, users see:
- Error notification (existing behavior)
- Empty state UI instead of infinite spinner (new behavior)
- "No transactions yet" / "0 sats" instead of "Loading..."

Affected files:
- static/js/index.js (lines 326-331, 391-393, 434-435)

Co-Authored-By: Claude <noreply@anthropic.com>

Fix Chart of Accounts loading spinner stuck issue

Fixed the Chart of Accounts section showing "Loading accounts..."
indefinitely when user has no account permissions.

Problem: The previous commit set accounts = [] in error handler to
clear loading state. However, the template logic was:
- v-if="accounts.length > 0" → show accounts list
- v-else → show loading spinner

When accounts = [] (empty array), it triggered v-else and showed
the spinner forever.

Solution: Changed the v-else block from loading spinner to empty
state message "No accounts available" with grey text styling.

Now when loadAccounts() fails or returns empty:
- Shows "No accounts available" instead of infinite spinner
- Consistent with other empty states (transactions, balances)
- User sees informative message instead of fake loading state

Affected: templates/castle/index.html (line 792-794)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
padreug 2025-11-11 23:00:20 +01:00
parent 61a3831b15
commit 5d38dc188b
2 changed files with 13 additions and 3 deletions

View file

@ -323,6 +323,12 @@ window.app = Vue.createApp({
} }
} catch (error) { } catch (error) {
LNbits.utils.notifyApiError(error) LNbits.utils.notifyApiError(error)
// Set default balance to clear loading state
this.balance = {
balance: 0,
fiat_balances: {},
accounts: []
}
} }
}, },
async loadAllUserBalances() { async loadAllUserBalances() {
@ -382,6 +388,9 @@ window.app = Vue.createApp({
this.transactionPagination.has_prev = response.data.has_prev this.transactionPagination.has_prev = response.data.has_prev
} catch (error) { } catch (error) {
LNbits.utils.notifyApiError(error) LNbits.utils.notifyApiError(error)
// Set empty array to clear loading state
this.transactions = []
this.transactionPagination.total = 0
} }
}, },
applyTransactionFilter() { applyTransactionFilter() {
@ -423,6 +432,8 @@ window.app = Vue.createApp({
this.accounts = response.data this.accounts = response.data
} catch (error) { } catch (error) {
LNbits.utils.notifyApiError(error) LNbits.utils.notifyApiError(error)
// Set empty array to clear loading state
this.accounts = []
} }
}, },
async loadCurrencies() { async loadCurrencies() {

View file

@ -789,9 +789,8 @@
</q-item-section> </q-item-section>
</q-item> </q-item>
</q-list> </q-list>
<div v-else> <div v-else class="text-center text-grey q-pa-md">
<q-spinner color="primary" size="sm"></q-spinner> No accounts available
Loading accounts...
</div> </div>
</q-card-section> </q-card-section>
</q-card> </q-card>