Improve UX of unavailable ledger balance

[ayumi]

• Submitted a ticket for my issue if one did not already exist.
• Used Github auto-closing keywords in the commit message.
• Added/updated tests for this change (for new code or code which already has tests).
• Ran git rebase -i to squash commits (if needed).

Fix #3778 #3785

Adds ledgerInfo.error for debugging and UI.

Auditors: @mrose17 @bbondy

Test Plan:

Offline case:

1. Disable internet
2. Re/open Brave
3. Open Preferences -> Payments
4. Observe that account balance shows "error, can't retrieve data" and not 0

Online case:

1. In Brave, open Preferences -> Payments and leave it open
2. Close and reopen Brave
3. Observe Payments balance shows "loading" or the correct amount

Offline case / Expected result:

[mrose17]

as @diracdeltas is fond of saying: don't forget to update docs/state.md

[ayumi]

thx, that is a good idea

[mrose17]

@ayumi - have you been able to reproduce either of the issues? i never have.

my theory has been that (! this.props.ledgerData) === true, but i until i can reproduce it, i can't really say.

on a mac, sometimes i see the payments panel show the 'Welcome to Brave Payments' page and then flip into the actual page a few 100ms later.

on linux, i suspect that something similar may be going on.

what's your thinking? thanks!

[ayumi]

@mrose17 I can repro #3785 and #3778 at 5b10525 on Mac OS X.

I've repro'd by disabling wifi and by specifically blocking Brave using Little Snitch.

This PR fixes it for me.

[mrose17]

@ayumi - excellent!

please merge the PR into master!