From 579714b7f611056f63da8cfee5e1e2bb0cf7b70d Mon Sep 17 00:00:00 2001
From: David Walsh <davidwalsh83@gmail.com>
Date: Mon, 21 Mar 2022 08:31:32 -0500
Subject: [PATCH] Remove unused CircleIcon and AlertCircleIcon components
 (#14057)

---
 ui/components/ui/alert-circle-icon/README.mdx | 25 --------
 .../alert-circle-icon.component.js            | 27 ---------
 .../alert-circle-icon.stories.js              | 27 ---------
 ui/components/ui/alert-circle-icon/index.js   |  1 -
 ui/components/ui/alert-circle-icon/index.scss | 13 ----
 ui/components/ui/circle-icon/README.mdx       | 16 -----
 .../ui/circle-icon/circle-icon.component.js   | 60 -------------------
 .../ui/circle-icon/circle-icon.stories.js     | 37 ------------
 ui/components/ui/circle-icon/index.js         |  1 -
 ui/components/ui/circle-icon/index.scss       | 23 -------
 ui/components/ui/ui-components.scss           |  2 -
 11 files changed, 232 deletions(-)
 delete mode 100644 ui/components/ui/alert-circle-icon/README.mdx
 delete mode 100644 ui/components/ui/alert-circle-icon/alert-circle-icon.component.js
 delete mode 100644 ui/components/ui/alert-circle-icon/alert-circle-icon.stories.js
 delete mode 100644 ui/components/ui/alert-circle-icon/index.js
 delete mode 100644 ui/components/ui/alert-circle-icon/index.scss
 delete mode 100644 ui/components/ui/circle-icon/README.mdx
 delete mode 100644 ui/components/ui/circle-icon/circle-icon.component.js
 delete mode 100644 ui/components/ui/circle-icon/circle-icon.stories.js
 delete mode 100644 ui/components/ui/circle-icon/index.js
 delete mode 100644 ui/components/ui/circle-icon/index.scss

diff --git a/ui/components/ui/alert-circle-icon/README.mdx b/ui/components/ui/alert-circle-icon/README.mdx
deleted file mode 100644
index c7d05782f..000000000
--- a/ui/components/ui/alert-circle-icon/README.mdx
+++ /dev/null
@@ -1,25 +0,0 @@
-import { Story, Canvas, ArgsTable } from '@storybook/addon-docs';
-
-import AlertCircleIcon from '.';
-
-# Alert Circle Icon
-
-<Canvas>
-  <Story id="ui-components-ui-alert-circle-icon-alert-circle-icon-stories-js--default-story" />
-</Canvas>
-
-## Component API
-
-<ArgsTable of={AlertCircleIcon} />
-
-## Usage
-
-The following describes the props and example usage for this component.
-
-### Warning
-
-Render warning alert icon
-
-<Canvas>
-  <Story id="ui-components-ui-alert-circle-icon-alert-circle-icon-stories-js--warning" />
-</Canvas>
diff --git a/ui/components/ui/alert-circle-icon/alert-circle-icon.component.js b/ui/components/ui/alert-circle-icon/alert-circle-icon.component.js
deleted file mode 100644
index 689447810..000000000
--- a/ui/components/ui/alert-circle-icon/alert-circle-icon.component.js
+++ /dev/null
@@ -1,27 +0,0 @@
-import React, { Component } from 'react';
-import PropTypes from 'prop-types';
-import CircleIcon from '../circle-icon';
-
-const typeConfig = {
-  danger: {
-    circleClass: 'alert-circle-icon--danger',
-    iconSource: 'images/icons/red-triangle-exclaim.svg',
-  },
-  warning: {
-    circleClass: 'alert-circle-icon--warning',
-    iconSource: 'images/icons/yellow-bell.svg',
-  },
-};
-
-export default class AlertCircleIcon extends Component {
-  static propTypes = {
-    /**
-     * giving different alert icon for the component
-     */
-    type: PropTypes.oneOf(Object.keys(typeConfig)).isRequired,
-  };
-
-  render() {
-    return <CircleIcon {...typeConfig[this.props.type]} />;
-  }
-}
diff --git a/ui/components/ui/alert-circle-icon/alert-circle-icon.stories.js b/ui/components/ui/alert-circle-icon/alert-circle-icon.stories.js
deleted file mode 100644
index c02480a64..000000000
--- a/ui/components/ui/alert-circle-icon/alert-circle-icon.stories.js
+++ /dev/null
@@ -1,27 +0,0 @@
-import React from 'react';
-import README from './README.mdx';
-import AlertCircleIcon from './alert-circle-icon.component';
-
-export default {
-  title: 'Components/UI/AlertCircleIcon',
-  id: __filename,
-  component: AlertCircleIcon,
-  parameters: {
-    docs: {
-      page: README,
-    },
-  },
-  argTypes: {
-    type: { options: ['warning', 'danger'], control: { type: 'select' } },
-  },
-};
-
-export const DefaultStory = (args) => <AlertCircleIcon type={args.type} />;
-
-DefaultStory.storyName = 'Default';
-
-export const Warning = (args) => <AlertCircleIcon type={args.type} />;
-
-Warning.args = {
-  type: 'warning',
-};
diff --git a/ui/components/ui/alert-circle-icon/index.js b/ui/components/ui/alert-circle-icon/index.js
deleted file mode 100644
index 80ab7a4c9..000000000
--- a/ui/components/ui/alert-circle-icon/index.js
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from './alert-circle-icon.component';
diff --git a/ui/components/ui/alert-circle-icon/index.scss b/ui/components/ui/alert-circle-icon/index.scss
deleted file mode 100644
index 82e746e77..000000000
--- a/ui/components/ui/alert-circle-icon/index.scss
+++ /dev/null
@@ -1,13 +0,0 @@
-.alert-circle-icon {
-  &--danger {
-    border-color: var(--accent-red);
-    color: var(--accent-red);
-    background: var(--Red-000);
-  }
-
-  &--warning {
-    border-color: var(--accent-yellow);
-    color: var(--accent-yellow);
-    background: var(--Yellow-000);
-  }
-}
diff --git a/ui/components/ui/circle-icon/README.mdx b/ui/components/ui/circle-icon/README.mdx
deleted file mode 100644
index ee4a95b7d..000000000
--- a/ui/components/ui/circle-icon/README.mdx
+++ /dev/null
@@ -1,16 +0,0 @@
-import { Story, Canvas, ArgsTable } from '@storybook/addon-docs';
-
-import CircleIcon from '.';
-
-# Circle Icon
-
-Add circle border to the image component
-
-<Canvas>
-  <Story id="ui-components-ui-circle-icon-circle-icon-stories-js--default-story" />
-</Canvas>
-
-## Component API
-
-<ArgsTable of={CircleIcon} />
-
diff --git a/ui/components/ui/circle-icon/circle-icon.component.js b/ui/components/ui/circle-icon/circle-icon.component.js
deleted file mode 100644
index c772941c4..000000000
--- a/ui/components/ui/circle-icon/circle-icon.component.js
+++ /dev/null
@@ -1,60 +0,0 @@
-import React, { PureComponent } from 'react';
-import PropTypes from 'prop-types';
-
-export default class CircleIcon extends PureComponent {
-  static propTypes = {
-    /**
-     * add size (px) for the image container
-     */
-    size: PropTypes.string,
-    /**
-     * add css classname for the component based on the parent css
-     */
-    circleClass: PropTypes.string,
-    /**
-     * image source path
-     */
-    iconSource: PropTypes.string.isRequired,
-    /**
-     * add size (px) for the image
-     */
-    iconSize: PropTypes.string,
-  };
-
-  static defaultProps = {
-    size: '56px',
-    iconSize: '18px',
-    circleClass: '',
-  };
-
-  render() {
-    const { size, circleClass, iconSize, iconSource } = this.props;
-
-    return (
-      <div
-        className="circle-icon__container"
-        style={{
-          height: size,
-          width: size,
-        }}
-      >
-        <div
-          className={`circle-icon__border circle-icon__circle ${circleClass}`}
-          style={{
-            height: size,
-            width: size,
-          }}
-        />
-        <img
-          src={iconSource}
-          className="circle-icon__icon"
-          style={{
-            height: iconSize,
-            width: iconSize,
-          }}
-          alt=""
-        />
-      </div>
-    );
-  }
-}
diff --git a/ui/components/ui/circle-icon/circle-icon.stories.js b/ui/components/ui/circle-icon/circle-icon.stories.js
deleted file mode 100644
index 90c63d817..000000000
--- a/ui/components/ui/circle-icon/circle-icon.stories.js
+++ /dev/null
@@ -1,37 +0,0 @@
-import React from 'react';
-import README from './README.mdx';
-import CircleIcon from './circle-icon.component';
-
-export default {
-  title: 'Components/UI/CircleIcon',
-  id: __filename,
-  component: CircleIcon,
-  parameters: {
-    docs: {
-      page: README,
-    },
-  },
-  argTypes: {
-    size: { control: 'text' },
-    circleClass: { control: 'text' },
-    iconSource: { control: 'text' },
-    iconSize: { control: 'text' },
-  },
-};
-
-export const DefaultStory = (args) => (
-  <CircleIcon
-    border="1px solid"
-    borderColor="black"
-    background="white"
-    iconSize={args.iconSize}
-    iconSource={args.iconSource}
-  />
-);
-
-DefaultStory.storyName = 'Default';
-
-DefaultStory.args = {
-  iconSize: '42px',
-  iconSource: 'images/eth_logo.svg',
-};
diff --git a/ui/components/ui/circle-icon/index.js b/ui/components/ui/circle-icon/index.js
deleted file mode 100644
index 7a4964c71..000000000
--- a/ui/components/ui/circle-icon/index.js
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from './circle-icon.component';
diff --git a/ui/components/ui/circle-icon/index.scss b/ui/components/ui/circle-icon/index.scss
deleted file mode 100644
index 1ffa5323d..000000000
--- a/ui/components/ui/circle-icon/index.scss
+++ /dev/null
@@ -1,23 +0,0 @@
-.circle-icon {
-  &__container {
-    position: relative;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-  }
-
-  &__border {
-    border-radius: 50%;
-    position: absolute;
-  }
-
-  &__circle {
-    border: 1px solid;
-    border-color: var(--black);
-    background: var(--white);
-  }
-
-  &__icon {
-    position: relative;
-  }
-}
diff --git a/ui/components/ui/ui-components.scss b/ui/components/ui/ui-components.scss
index 0a3b51552..ff57d3769 100644
--- a/ui/components/ui/ui-components.scss
+++ b/ui/components/ui/ui-components.scss
@@ -2,7 +2,6 @@
 @import 'account-mismatch-warning/index';
 @import 'account-list/index';
 @import 'actionable-message/index';
-@import 'alert-circle-icon/index';
 @import 'alert/index';
 @import 'box/box';
 @import 'breadcrumbs/index';
@@ -11,7 +10,6 @@
 @import 'callout/callout';
 @import 'check-box/index';
 @import 'chip/chip';
-@import 'circle-icon/index';
 @import 'color-indicator/color-indicator';
 @import 'confusable/index';
 @import 'currency-display/index';