feat: remove Old Icon usage

Synthetixio · Jul 6, 2022 · f57a5fa · f57a5fa
1 parent 2f6e1bf
commit f57a5fa
Show file tree

Hide file tree

Showing 22 changed files with 50 additions and 291 deletions.
diff --git a/src/components/Accordion/Accordion.tsx b/src/components/Accordion/Accordion.tsx
@@ -2,7 +2,6 @@ import clsx from 'clsx';
 import { Card, CardVariant } from 'components/Card/Card';
 import { Icon } from 'components/Icon/Icon';
 import { IconButton } from 'components/IconButton/IconButton';
-import { ArrowDropdownDownIcon } from 'components/Icons/ArrowDropdownDownIcon';
 import { useRef, useState } from 'react';
 import { CSSTransition } from 'react-transition-group';
 

diff --git a/src/components/Button/Button.tsx b/src/components/Button/Button.tsx
@@ -72,7 +72,7 @@ export const Button: React.FC<ButtonProps> = ({
         </div>
       </div>
       {variant === 'spotlight' && spotlightActive && (
-        <div className='ui-bg-primary w-full ui-rounded ui-h-[2px] ui-w-full ui-absolute ui-bottom-1'></div>
+        <div className='ui-bg-primary w-full ui-rounded ui-h-[2px] ui-w-full ui-absolute ui-bottom-1' />
       )}
     </button>
   );

diff --git a/src/components/Carousel/Carousel.tsx b/src/components/Carousel/Carousel.tsx
@@ -1,6 +1,5 @@
 import clsx from 'clsx';
-import ArrowLeftIcon from 'components/Icons/ArrowLeftIcon';
-import ArrowRightIcon from 'components/Icons/ArrowRightIcon';
+import { Icon } from 'components/Icon/Icon';
 import {
   cloneElement,
   HTMLAttributes,
@@ -140,7 +139,7 @@ export function Carousel({
             size='sm'
             onClick={handlePrev}
           >
-            <ArrowLeftIcon active />
+            <Icon className='ui-text-primary' name='Left' />
           </IconButton>
           <IconButton
             rounded
@@ -152,7 +151,7 @@ export function Carousel({
             size='sm'
             onClick={handleNext}
           >
-            <ArrowRightIcon active />
+            <Icon className='ui-text-primary' name='Right' />
           </IconButton>
         </>
       )}

diff --git a/src/components/Dialog/Dialog.tsx b/src/components/Dialog/Dialog.tsx
@@ -1,6 +1,6 @@
 import clsx from 'clsx';
 import { Card } from 'components/Card/Card';
-import CloseIcon from 'components/Icons/CloseIcon';
+import { Icon } from 'components/Icon/Icon';
 import { useOnClickOutside } from 'hooks/useOnClickOutside';
 import React, { useEffect, useRef } from 'react';
 import { CSSTransition } from 'react-transition-group';
@@ -58,8 +58,9 @@ export const Dialog: React.FC<DialogProps> = ({
           )}
         >
           {!hideCloseIcon && (
-            <CloseIcon
-              className='ui-absolute ui-top-4 ui-right-4 ui-text-xl ui-cursor-pointer'
+            <Icon
+              className='ui-absolute ui-top-4 ui-right-4 ui-cursor-pointer'
+              name='Small-Cross'
               onClick={onClose}
             />
           )}

diff --git a/src/components/ExternalLink/ExternalLink.tsx b/src/components/ExternalLink/ExternalLink.tsx
@@ -1,5 +1,5 @@
 import clsx from 'clsx';
-import { ArrowLinkOffIcon } from 'components/Icons/ArrowLinkOffIcon';
+import { Icon } from 'components/Icon/Icon';
 
 export interface ExternalLinkProps {
   className?: string;
@@ -30,7 +30,7 @@ export const ExternalLink: React.FC<ExternalLinkProps> = ({
       target='_blank'
     >
       {text}
-      {!withoutIcon && <ArrowLinkOffIcon />}
+      {!withoutIcon && <Icon className='ui-ml-1' name='Link-off' />}
     </a>
   );
 };
diff --git a/src/components/IconButton/IconButton.stories.tsx b/src/components/IconButton/IconButton.stories.tsx
@@ -1,6 +1,6 @@
 import { ComponentMeta, ComponentStory } from '@storybook/react';
 
-import CloseIcon from '../Icons/CloseIcon';
+import { Icon } from '../Icon/Icon';
 import { IconButton } from './IconButton';
 
 export default {
@@ -11,7 +11,7 @@ export default {
 
 const Template: ComponentStory<typeof IconButton> = (args) => (
   <IconButton {...args}>
-    <CloseIcon />
+    <Icon name='Small-Cross' />
   </IconButton>
 );
 

diff --git a/src/components/Icons/ArrowDropdownDownIcon.tsx b/src/components/Icons/ArrowDropdownDownIcon.tsx
diff --git a/src/components/Icons/ArrowDropdownLeftIcon.tsx b/src/components/Icons/ArrowDropdownLeftIcon.tsx
diff --git a/src/components/Icons/ArrowDropdownRightIcon.tsx b/src/components/Icons/ArrowDropdownRightIcon.tsx
diff --git a/src/components/Icons/ArrowLeftIcon.tsx b/src/components/Icons/ArrowLeftIcon.tsx
diff --git a/src/components/Icons/ArrowLinkOffIcon.tsx b/src/components/Icons/ArrowLinkOffIcon.tsx
diff --git a/src/components/Icons/ArrowRightIcon.tsx b/src/components/Icons/ArrowRightIcon.tsx
diff --git a/src/components/Icons/CloseIcon.tsx b/src/components/Icons/CloseIcon.tsx
diff --git a/src/components/Icons/SkipLeftIcon.tsx b/src/components/Icons/SkipLeftIcon.tsx
diff --git a/src/components/Icons/SkipRightIcon.tsx b/src/components/Icons/SkipRightIcon.tsx
diff --git a/src/components/Icons/types.ts b/src/components/Icons/types.ts