get rid of react icons (#164)

Author: akshay288

frontend/package.json

@@ -17,7 +17,6 @@
     "@metlo/testing": "^0.0.3",
     "@monaco-editor/react": "^4.4.5",
     "@next/bundle-analyzer": "^12.3.0",
-    "@react-icons/all-files": "^4.1.0",
     "axios": "^0.27.2",
     "chakra-react-select": "^4.1.4",
     "chart.js": "^3.9.1",

frontend/src/components/Alert/AlertComponent.tsx

@@ -15,10 +15,10 @@ import {
   ModalBody,
   ModalFooter,
 } from "@chakra-ui/react"
-import { RiEyeOffFill } from "@react-icons/all-files/ri/RiEyeOffFill"
-import { RiEyeFill } from "@react-icons/all-files/ri/RiEyeFill"
-import { FiCheckCircle } from "@react-icons/all-files/fi/FiCheckCircle"
-import { AiOutlineFileSearch } from "@react-icons/all-files/ai/AiOutlineFileSearch"
+import { RiEyeOffFill } from "icons/ri/RiEyeOffFill"
+import { RiEyeFill } from "icons/ri/RiEyeFill"
+import { FiCheckCircle } from "icons/fi/FiCheckCircle"
+import { AiOutlineFileSearch } from "icons/ai/AiOutlineFileSearch"
 import { Alert, UpdateAlertParams } from "@common/types"
 import { SpecExtension, Status, UpdateAlertType } from "@common/enums"
 import { RISK_TO_COLOR } from "~/constants"

frontend/src/components/Alert/AlertList.tsx

@@ -23,14 +23,13 @@ import {
   Input,
 } from "@chakra-ui/react"
 import debounce from "lodash/debounce"
-import { FiFilter } from "@react-icons/all-files/fi/FiFilter"
 import { Alert, GetAlertParams, UpdateAlertParams } from "@common/types"
 import { AlertType, RiskScore, SpecExtension, Status } from "@common/enums"
 import { ALERT_PAGE_LIMIT } from "~/constants"
 import { AlertComponent } from "components/Alert/AlertComponent"
 import EmptyView from "components/utils/EmptyView"
 import { PaginationComponent } from "components/PaginationComponent"
-import { GoSearch } from "@react-icons/all-files/go/GoSearch"
+import { BsSearch } from "icons/bs/BsSearch"
 
 const RISK_SCORE_TO_LABEL: Record<RiskScore, string> = {
   [RiskScore.HIGH]: "High",
@@ -298,7 +297,7 @@ export const AlertList: React.FC<AlertListProps> = ({
         <VStack h="full" w="full" alignSelf="flex-start">
           <InputGroup mt="1" mr="1">
             <InputLeftElement pointerEvents="none">
-              <GoSearch />
+              <BsSearch />
             </InputLeftElement>
             <Input
               spellCheck={false}

frontend/src/components/Alert/AlertPanel.tsx

@@ -10,7 +10,7 @@ import {
   Wrap,
   WrapItem,
 } from "@chakra-ui/react"
-import { TiFlowSwitch } from "@react-icons/all-files/ti/TiFlowSwitch"
+import { TiFlowSwitch } from "icons/ti/TiFlowSwitch"
 import { useRouter } from "next/router"
 import darkTheme from "prism-react-renderer/themes/duotoneDark"
 import lightTheme from "prism-react-renderer/themes/github"

frontend/src/components/Alert/utils.ts

@@ -1,10 +1,10 @@
-import { FaBell } from "@react-icons/all-files/fa/FaBell"
-import { TiFlowSwitch } from "@react-icons/all-files/ti/TiFlowSwitch"
-import { AiFillApi } from "@react-icons/all-files/ai/AiFillApi"
-import { AiFillLock } from "@react-icons/all-files/ai/AiFillLock"
-import { BsShieldLockFill } from "@react-icons/all-files/bs/BsShieldLockFill"
+import { FaBell } from "icons/fa/FaBell"
+import { TiFlowSwitch } from "icons/ti/TiFlowSwitch"
+import { AiFillApi } from "icons/ai/AiFillApi"
+import { AiFillLock } from "icons/ai/AiFillLock"
+import { BsShieldLockFill } from "icons/bs/BsShieldLockFill"
 import { AlertType } from "@common/enums"
-import { IconType } from "@react-icons/all-files/lib"
+import { IconType } from "icons/lib"
 
 export const alertTypeToIcon: (
   alertType: AlertType,

frontend/src/components/ConnectionDocs/docs/aws.tsx

@@ -11,7 +11,6 @@ import {
   Link,
 } from "@chakra-ui/react"
 import { ExternalLinkIcon } from "@chakra-ui/icons"
-import { CgArrowRight } from "@react-icons/all-files/cg/CgArrowRight"
 import { ListNumber } from "components/utils/ListNumber"
 import { useEffect, useState } from "react"
 import {
@@ -116,7 +115,6 @@ const AWSDocs: React.FC<DocsParams> = React.memo(({ host, apiKey }) => {
                   as="a"
                   colorScheme="blue"
                   target="_blank"
-                  rightIcon={<CgArrowRight />}
                   pointerEvents={deployRegion === "" ? "none" : "initial"}
                   href={getAWSDeployAmiURL(deployRegion)}
                   isDisabled={deployRegion === ""}
@@ -209,7 +207,6 @@ sudo systemctl start metlo-ingestor.service`}</SyntaxHighlighter>
                   as="a"
                   colorScheme="blue"
                   target="_blank"
-                  rightIcon={<CgArrowRight />}
                   pointerEvents={selectedRegion === "" ? "none" : "initial"}
                   href={getAWSIngestorLaunchStackURL(
                     selectedRegion,

frontend/src/components/Endpoint/AlertDetail.tsx

@@ -16,7 +16,6 @@ import {
   ListIcon,
   List,
 } from "@chakra-ui/react"
-import { AiOutlineRight } from "@react-icons/all-files/ai/AiOutlineRight"
 import { getDateTimeString, makeToast } from "utils"
 import { METHOD_TO_COLOR } from "~/constants"
 import { RestMethod, Status } from "@common/enums"

frontend/src/components/Endpoint/AlertList.tsx

@@ -12,8 +12,8 @@ import {
   Heading,
   Button,
 } from "@chakra-ui/react"
-import { ImCheckmark } from "@react-icons/all-files/im/ImCheckmark"
-import { ImCross } from "@react-icons/all-files/im/ImCross"
+import { ImCheckmark } from "icons/im/ImCheckmark"
+import { ImCross } from "icons/im/ImCross"
 import DataTable, { TableColumn } from "react-data-table-component"
 import { getCustomStyles, rowStyles } from "components/utils/TableUtils"
 import { Alert } from "@common/types"

frontend/src/components/Endpoint/DataFieldList.tsx

@@ -11,7 +11,7 @@ import {
   Text,
 } from "@chakra-ui/react"
 import SplitPane from "react-split-pane"
-import { ImCross } from "@react-icons/all-files/im/ImCross"
+import { ImCross } from "icons/im/ImCross"
 import DataTable, { TableColumn } from "react-data-table-component"
 import { DataField } from "@common/types"
 import { getCustomStyles, rowStyles } from "components/utils/TableUtils"

frontend/src/components/Endpoint/DataFieldTags.tsx

@@ -2,8 +2,8 @@ import React, { useEffect, useState } from "react"
 import { Select } from "chakra-react-select"
 import { DataField } from "@common/types"
 import { HStack, Tag, Button, Box, Wrap, WrapItem } from "@chakra-ui/react"
-import { FiPlus } from "@react-icons/all-files/fi/FiPlus"
-import { HiPencil } from "@react-icons/all-files/hi/HiPencil"
+import { FiPlus } from "icons/fi/FiPlus"
+import { HiPencil } from "icons/hi/HiPencil"
 import { DataClass } from "@common/enums"
 import { DATA_CLASS_TO_RISK_SCORE } from "@common/maps"
 import { RISK_TO_COLOR } from "~/constants"