Approve screen renders before token data has been retrieved

[Gudahtt]

Describe the bug
The Approve screen will render once before the token data has been loaded, resulting in a flash of "empty" content and a bunch of console errors (which are then reported to Sentry).

Steps to reproduce (REQUIRED)

1. Go to https://metamask.github.io/test-dapp/
2. Click on 'Create token", and approve the deploy transaction (ideally on a testnet)
3. Wait for the transaction to be confirmed
4. Click "Approve tokens"
5. The notification window should pop up, showing the Approve confirmation screen. It will render, flash white, then re-render with the proper values. The console will show errors.

Expected behavior
The Approve screen should never render with empty content nor emit console errors. Instead there should be a loading screen until the page is ready to be rendered.

Browser details (please complete the following information):

• OS: Ubuntu
• Browser: tested in latest Chrome and Firefox
• MetaMask Version: v8.1.9 (though this dates back at least to v8.0.0)

[sentry-io]

Sentry issue: METAMASK-GNCR

[sentry-io]

Sentry issue: METAMASK-GNCQ

[sentry-io]

Sentry issue: METAMASK-GP4F

[sentry-io]

Sentry issue: METAMASK-GP4E