UX: Icons: Remove lock icon

MetaMask · Feb 16, 2023 · 649ecfb · 649ecfb
1 parent cf49761
commit 649ecfb
Show file tree

Hide file tree

Showing 4 changed files with 12 additions and 37 deletions.
diff --git a/development/ts-migration-dashboard/files-to-convert.json b/development/ts-migration-dashboard/files-to-convert.json
@@ -925,8 +925,6 @@
   "ui/components/ui/loading-indicator/loading-indicator.js",
   "ui/components/ui/loading-screen/index.js",
   "ui/components/ui/loading-screen/loading-screen.component.js",
-  "ui/components/ui/lock-icon/index.js",
-  "ui/components/ui/lock-icon/lock-icon.component.js",
   "ui/components/ui/logo/logo-coinbasepay.js",
   "ui/components/ui/logo/logo-deposit-eth.js",
   "ui/components/ui/logo/logo-lattice.js",

diff --git a/ui/components/ui/lock-icon/index.js b/ui/components/ui/lock-icon/index.js
diff --git a/ui/components/ui/lock-icon/lock-icon.component.js b/ui/components/ui/lock-icon/lock-icon.component.js
diff --git a/ui/pages/settings/networks-tab/networks-list-item/networks-list-item.js b/ui/pages/settings/networks-tab/networks-list-item/networks-list-item.js
@@ -7,7 +7,6 @@ import {
   CHAIN_ID_TO_NETWORK_IMAGE_URL_MAP,
   NETWORK_TYPES,
 } from '../../../../../shared/constants/network';
-import LockIcon from '../../../../components/ui/lock-icon';
 import IconCheck from '../../../../components/ui/icon/icon-check';
 import { NETWORKS_ROUTE } from '../../../../helpers/constants/routes';
 import { setSelectedSettingsRpcUrl } from '../../../../store/actions';
@@ -18,6 +17,12 @@ import Identicon from '../../../../components/ui/identicon';
 import UrlIcon from '../../../../components/ui/url-icon';
 
 import { handleSettingsRefs } from '../../../../helpers/utils/settings-search';
+import {
+  Icon,
+  ICON_NAMES,
+  ICON_SIZES,
+} from '../../../../components/component-library';
+import { Color } from '../../../../helpers/constants/design-system';
 
 const NetworksListItem = ({
   network,
@@ -122,7 +127,12 @@ const NetworksListItem = ({
       >
         {label || t(labelKey)}
         {currentProviderType !== NETWORK_TYPES.RPC && (
-          <LockIcon width="14px" height="17px" fill="var(--color-icon-muted)" />
+          <Icon
+            name={ICON_NAMES.LOCK}
+            color={Color.iconMuted}
+            size={ICON_SIZES.SM}
+            marginInlineStart={2}
+          />
         )}
       </div>
     </div>