Ensure RTL domain names are handled correctly

Inspired by this discussion: https://github.com/MetaMask/metamask-extension/pull/8409#discussion_r415918383

As of today, when we encounter long URLs in the Connected Sites component, we switch the CSS `direction` to `rtl` and use `text-overflow: ellipsis;`. The point is to preserve the TLD in the displayed URL, per [Google's recommendation](https://chromium.googlesource.com/chromium/src/+/master/docs/security/url_display_guidelines/url_display_guidelines.md#eliding-urls).

@Gudahtt raised the point that this may have the opposite affect for domain names with RTL characters in them.

We should review whether we are handled RTL domain names correctly for Connected Sites and apply that handling everywhere.

Image from Bugzilla indicating the possible problem (see link below):

Some resources:
- https://ux.stackexchange.com/questions/55127/do-arabic-web-browsers-have-the-back-forward-buttons-reversed
- https://bugzilla.mozilla.org/show_bug.cgi?id=525831
- https://tools.ietf.org/html/rfc5893

Start with the Connected Sites component and its CSS direction and text-overflow handling. Review the linked discussion and RTL resources, then identify every place the URL display behavior is applied; done means RTL domain names and long URLs render correctly throughout the extension.

Written by the indexing model from the issue text.