Improve message shown to user when Oauth popup flow blocked by browser

[amcclain]

During a POPUP based OAuth flow, the user's browser can block the popup, causing the underlying library to throw an identifiable error message. We detect this and throw an error with a dedicated message instructing the user on what to do.

The concern here is that:

• The dialog has the default "⚠ Error" title.
• The message is a few lines long, without any line breaks or explanatory images.
• The dialog presents a "Reload App" action button - intended for the user to press after following the instructions to enable popups.

But...

• Users' eyes might unfortunately glaze over upon seeing the above, failing to read/absorb our little message...
• Then click the Reload App button without doing anything and get the same message...
• Then give up and report app as broken...

Avoiding this situation (which we have seen) would help make the POPUP method more reliable and reduce support load / user confusion. I think it's sufficiently worth it to warrant a dedicated dialog with:

• More customized / formatted dialog and message, with a better title - "Action required: allow popups" or similar
• Improved message with a clearer call to action and internal line breaks for readability
• Sample / generic inline image of allow-popup affordance in Chrome / Edge
  • Realize we can't cover all browser and this might get slightly out of date, but still think it's better than nothing
• Clearer text on reload button - "I have enabled popups - reload the app"