fix icon names (#17391)

MetaMask · Jan 25, 2023 · 23133a2 · 23133a2
1 parent d2331c0
commit 23133a2
Show file tree

Hide file tree

Showing 13 changed files with 16 additions and 23 deletions.
diff --git a/ui/components/app/collectible-details/collectible-details.js b/ui/components/app/collectible-details/collectible-details.js
@@ -277,9 +277,7 @@ export default function CollectibleDetails({ collectible }) {
                 handleSourceCopy(collectibleImageURL);
               }}
               iconName={
-                sourceCopied
-                  ? ICON_NAMES.COPY_SUCCESS_FILLED
-                  : ICON_NAMES.COPY_FILLED
+                sourceCopied ? ICON_NAMES.COPY_SUCCESS : ICON_NAMES.COPY
               }
             />
           </Box>
@@ -334,9 +332,7 @@ export default function CollectibleDetails({ collectible }) {
                   handleAddressCopy(address);
                 }}
                 iconName={
-                  addressCopied
-                    ? ICON_NAMES.COPY_SUCCESS_FILLED
-                    : ICON_NAMES.COPY_FILLED
+                  addressCopied ? ICON_NAMES.COPY_SUCCESS : ICON_NAMES.COPY
                 }
               />
             </Box>

diff --git a/ui/components/app/flask/snap-delineator/snap-delineator.js b/ui/components/app/flask/snap-delineator/snap-delineator.js
@@ -31,7 +31,7 @@ export const SnapDelineator = ({ snapName, children }) => {
         paddingTop={1}
         paddingBottom={1}
       >
-        <Icon name="snaps-filled" color={COLORS.INFO_DEFAULT} size={SIZES.SM} />
+        <Icon name="snaps" color={COLORS.INFO_DEFAULT} size={SIZES.SM} />
         <Text
           variant={TEXT.BODY_SM}
           color={COLORS.INFO_DEFAULT}

diff --git a/ui/components/app/signature-request-siwe/signature-request-siwe.js b/ui/components/app/signature-request-siwe/signature-request-siwe.js
@@ -100,7 +100,7 @@ export default function SignatureRequestSIWE({
           iconFillColor="var(--color-warning-default)"
           useIcon
           withRightButton
-          icon={<Icon name="danger-filled" color={COLORS.WARNING_DEFAULT} />}
+          icon={<Icon name="danger" color={COLORS.WARNING_DEFAULT} />}
         />
       )}
       {!isSIWEDomainValid && (
@@ -121,7 +121,7 @@ export default function SignatureRequestSIWE({
           iconFillColor="var(--color-error-default)"
           useIcon
           withRightButton
-          icon={<Icon name="danger-filled" color={COLORS.ERROR_DEFAULT} />}
+          icon={<Icon name="danger" color={COLORS.ERROR_DEFAULT} />}
         />
       )}
       <PageContainerFooter

diff --git a/ui/components/component-library/banner-base/README.mdx b/ui/components/component-library/banner-base/README.mdx
@@ -114,7 +114,7 @@ import { BannerBase, Icon, ICON_NAMES } from '../../component-library';
 
 <BannerBase
   title="Start accessory demo"
-  startAccessory={<Icon name={ICON_NAMES.INFO_FILLED} size={SIZES.LG} />}
+  startAccessory={<Icon name={ICON_NAMES.INFO} size={SIZES.LG} />}
 >
   The info icon on the left is passed through the startAccessory prop
 </BannerBase>;

diff --git a/ui/components/component-library/banner-base/banner-base.js b/ui/components/component-library/banner-base/banner-base.js
@@ -68,7 +68,7 @@ export const BannerBase = ({
       {onClose && (
         <ButtonIcon
           className="mm-banner-base__close-button"
-          iconName={ICON_NAMES.CLOSE_OUTLINE}
+          iconName={ICON_NAMES.CLOSE}
           size={SIZES.SM}
           ariaLabel="Close" // TODO: i18n
           onClick={onClose}

diff --git a/ui/components/component-library/banner-base/banner-base.stories.js b/ui/components/component-library/banner-base/banner-base.stories.js
@@ -92,7 +92,7 @@ DefaultStory.args = {
   title: 'Title is sentence case no period',
   children: "Description shouldn't repeat title. 1-3 lines.",
   actionButtonLabel: 'Action',
-  startAccessory: <Icon name={ICON_NAMES.INFO_FILLED} size={SIZES.LG} />,
+  startAccessory: <Icon name={ICON_NAMES.INFO} size={SIZES.LG} />,
 };
 
 DefaultStory.storyName = 'Default';
@@ -165,5 +165,5 @@ StartAccessory.args = {
   title: 'Start accessory demo',
   children:
     'The info icon on the left is passed through the startAccessory prop',
-  startAccessory: <Icon name={ICON_NAMES.INFO_FILLED} size={SIZES.LG} />,
+  startAccessory: <Icon name={ICON_NAMES.INFO} size={SIZES.LG} />,
 };
diff --git a/ui/components/component-library/banner-base/banner-base.test.js b/ui/components/component-library/banner-base/banner-base.test.js
@@ -72,10 +72,7 @@ describe('BannerBase', () => {
     const { getByTestId } = render(
       <BannerBase
         startAccessory={
-          <Icon
-            data-testid="start-accessory"
-            name={ICON_NAMES.ADD_SQUARE_FILLED}
-          />
+          <Icon data-testid="start-accessory" name={ICON_NAMES.ADD_SQUARE} />
         }
       />,
     );

diff --git a/ui/components/component-library/button-base/button-base.test.js b/ui/components/component-library/button-base/button-base.test.js
@@ -100,7 +100,7 @@ describe('ButtonBase', () => {
     const { getByTestId } = render(
       <ButtonBase
         data-testid="icon"
-        iconName="add-square-filled"
+        iconName="add-square"
         iconProps={{ 'data-testid': 'base-button-icon' }}
       />,
     );

diff --git a/ui/components/component-library/button-link/button-link.test.js b/ui/components/component-library/button-link/button-link.test.js
@@ -82,7 +82,7 @@ describe('ButtonLink', () => {
   });
   it('should render with icon', () => {
     const { container } = render(
-      <ButtonLink data-testid="icon" iconName="add-square-filled" />,
+      <ButtonLink data-testid="icon" iconName="add-square" />,
     );
 
     const icons = container.getElementsByClassName('mm-icon').length;

diff --git a/ui/components/component-library/button-primary/button-primary.test.js b/ui/components/component-library/button-primary/button-primary.test.js
@@ -89,7 +89,7 @@ describe('ButtonPrimary', () => {
   });
   it('should render with icon', () => {
     const { container } = render(
-      <ButtonPrimary data-testid="icon" iconName="add-square-filled" />,
+      <ButtonPrimary data-testid="icon" iconName="add-square" />,
     );
 
     const icons = container.getElementsByClassName('mm-icon').length;

diff --git a/ui/components/component-library/button-secondary/button-secondary.test.js b/ui/components/component-library/button-secondary/button-secondary.test.js
@@ -93,7 +93,7 @@ describe('ButtonSecondary', () => {
   });
   it('should render with icon', () => {
     const { container } = render(
-      <ButtonSecondary data-testid="icon" iconName="add-square-filled" />,
+      <ButtonSecondary data-testid="icon" iconName="add-square" />,
     );
 
     const icons = container.getElementsByClassName('mm-icon').length;

diff --git a/ui/components/component-library/button/button.test.js b/ui/components/component-library/button/button.test.js
@@ -133,7 +133,7 @@ describe('Button', () => {
     const { getByTestId } = render(
       <Button
         data-testid="icon"
-        iconName="add-square-filled"
+        iconName="add-square"
         iconProps={{ 'data-testid': 'base-button-icon' }}
       >
         Button

diff --git a/ui/pages/onboarding-flow/privacy-settings/privacy-settings.js b/ui/pages/onboarding-flow/privacy-settings/privacy-settings.js
@@ -225,7 +225,7 @@ export default function PrivacySettings() {
                         e.preventDefault();
                         dispatch(showModal({ name: 'ONBOARDING_ADD_NETWORK' }));
                       }}
-                      icon={<Icon name="add-outline" marginRight={2} />}
+                      icon={<Icon name="add" marginRight={2} />}
                     >
                       {t('onboardingAdvancedPrivacyNetworkButton')}
                     </Button>