Dark mode: Removing connected svg from account menu in favour of fontawesome (#14140)

app/images/icons/connected-sites.svg

@@ -1,3 +0,0 @@
-<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M14 8C14 11.3137 11.3137 14 8 14C4.68629 14 2 11.3137 2 8C2 4.68629 4.68629 2 8 2C11.3137 2 14 4.68629 14 8ZM16 8C16 12.4183 12.4183 16 8 16C3.58172 16 0 12.4183 0 8C0 3.58172 3.58172 0 8 0C12.4183 0 16 3.58172 16 8ZM8 11C9.65685 11 11 9.65685 11 8C11 6.34315 9.65685 5 8 5C6.34315 5 5 6.34315 5 8C5 9.65685 6.34315 11 8 11Z" fill="#6A737D"/>
-</svg>

ui/components/app/menu-bar/account-options-menu.js

@@ -125,7 +125,7 @@ export default function AccountOptionsMenu({ anchorElement, onClose }) {
           history.push(CONNECTED_ROUTE);
           onClose();
         }}
-        iconClassName="account-options-menu__connected-sites"
+        iconClassName="fa fa-bullseye"
       >
         {t('connectedSites')}
       </MenuItem>

ui/components/app/menu-bar/accoutn-options-menu.stories.js

@@ -0,0 +1,19 @@
+import React from 'react';
+import AccountOptionsMenu from '.';
+
+export default {
+  title: 'Components/App/AccountOptionsMenu',
+  id: __filename,
+  argTypes: {
+    anchorElement: {
+      control: 'func',
+    },
+    onClose: {
+      action: 'onClose',
+    },
+  },
+};
+
+export const DefaultStory = (args) => <AccountOptionsMenu {...args} />;
+
+DefaultStory.storyName = 'Default';

ui/components/app/menu-bar/index.scss

@@ -21,15 +21,6 @@
 }
 
 .account-options-menu {
-  &__connected-sites::before {
-    content: "";
-    background-image: url(/images/icons/connected-sites.svg);
-    background-size: contain;
-    background-repeat: no-repeat;
-    background-position: center;
-    padding: 8px;
-  }
-
   &__explorer-origin {
     @include H7;