From fffa9033c07ce8afdac15ddd8e96352f3fac4e6d Mon Sep 17 00:00:00 2001 From: Ayumi Yu Date: Wed, 7 Sep 2016 15:03:22 -0700 Subject: [PATCH] Improve UX of unavailable ledger balance Fix #3778 Fix #3785 or at least a gentle fallback --- .../locales/en-US/preferences.properties | 2 ++ app/ledger.js | 21 +++++++++-- docs/state.md | 10 ++++-- js/about/preferences.js | 36 ++++++++++++++----- 4 files changed, 56 insertions(+), 13 deletions(-) diff --git a/app/extensions/brave/locales/en-US/preferences.properties b/app/extensions/brave/locales/en-US/preferences.properties index d75120870c4..528fb327f9a 100644 --- a/app/extensions/brave/locales/en-US/preferences.properties +++ b/app/extensions/brave/locales/en-US/preferences.properties @@ -24,6 +24,8 @@ paymentsSidebarText2=All transaction IP addresses are anonymized with technology paymentsSidebarText3=Brave Bitcoin Wallets are provided through a partnership with: paymentsSidebarText4=Your contributions in the form of credit cards and bank cards are handled by: accountBalance=account balance +accountBalanceConnectionError=error, can't retreive data +accountBalanceLoading=loading... monthlyBudget=monthly budget status=status createWallet=create wallet diff --git a/app/ledger.js b/app/ledger.js index 358d78a5712..d03899bb6f6 100644 --- a/app/ledger.js +++ b/app/ledger.js @@ -744,7 +744,8 @@ var ledgerInfo = { hasBitcoinHandler: false, - _internal: {} + _internal: {}, + error: null } var updateLedgerInfo = () => { @@ -1013,6 +1014,20 @@ var getBalance = () => { }) } +var logError = (err, caller) => { + if (err) { + ledgerInfo.error = { + caller: caller, + error: err + } + console.log('Error in %j: %j', caller, err) + return true + } else { + ledgerInfo.error = null + return false + } +} + var getPaymentInfo = () => { var amount, currency @@ -1028,7 +1043,9 @@ var getPaymentInfo = () => { client.getWalletProperties(amount, currency, function (err, body) { var info = ledgerInfo._internal.paymentInfo || {} - if (err) return console.log('getWalletProperties error: ' + err.toString()) + if (logError(err, 'getWalletProperties')) { + return + } info = underscore.extend(info, underscore.pick(body, [ 'buyURL', 'buyURLExpires', 'balance', 'unconfirmed', 'satoshis' ])) info.address = client.getWalletAddress() diff --git a/docs/state.md b/docs/state.md index 7572a0d3533..6fce9cb1d01 100644 --- a/docs/state.md +++ b/docs/state.md @@ -402,7 +402,7 @@ WindowStore reconcileStamp: number, // timestamp for the next reconcilation transactions: [ { // contributions reconciling/reconciled viewingId: string, // UUIDv4 for this contribution - contribution: { // + contribution: { // fiat: { // roughly-equivalent fiat amount amount: number, // e.g., 5 currency: string // e.g., "USD" @@ -411,7 +411,7 @@ WindowStore [currency]: number // e.g., { "USD": 575.45 } }, satoshis: number, // actual number of satoshis transferred - fee: number // bitcoin transaction fee + fee: number // bitcoin transaction fee }, submissionStamp: number, // timestamp for this contribution count: number, // total number of ballots allowed to be cast @@ -435,7 +435,11 @@ WindowStore } }, hasBitcoinHandler: boolean, // brave browser has a `bitcoin:` URI handler - paymentIMG: string // the QR code equivalent of `paymentURL` expressed as "data:image/...;base64,..." + paymentIMG: string, // the QR code equivalent of `paymentURL` expressed as "data:image/...;base64,..." + error: { // non-null if the last updateLedgerInfo happened concurrently with an error + caller: string // function in which error was handled + error: object // error object returned + } }, publisherInfo: [ // one entry for each publisher having a non-zero `score` { diff --git a/js/about/preferences.js b/js/about/preferences.js index e834b9faa35..7f2401be1a3 100644 --- a/js/about/preferences.js +++ b/js/about/preferences.js @@ -583,6 +583,25 @@ class PaymentsTab extends ImmutableComponent { return getSetting(settings.PAYMENTS_ENABLED, this.props.settings) } + get fundsAmount () { + if (!this.props.ledgerData.get('created')) { + return null + } + + return + { + !(this.props.ledgerData.get('balance') === undefined || this.props.ledgerData.get('balance') === null) + ? + {this.btcToCurrencyString(this.props.ledgerData.get('balance'))} + + + + + : + } + + } + get walletButton () { const buttonText = this.props.ledgerData.get('created') ? 'addFundsTitle' @@ -708,14 +727,15 @@ class PaymentsTab extends ImmutableComponent { - - {this.btcToCurrencyString(this.props.ledgerData.get('balance'))} - - - - - {this.walletButton} - {this.paymentHistoryButton} + { + this.props.ledgerData.get('error') && this.props.ledgerData.get('error').get('caller') === 'getWalletProperties' + ? + : + {this.fundsAmount} + {this.walletButton} + {this.paymentHistoryButton} + + }