[Dashboard] Remove react-icons (2)

apps/dashboard/src/components/dashboard/RelevantDataSection.tsx

@@ -1,6 +1,6 @@
 import { Flex } from "@chakra-ui/react";
+import { MoveRightIcon } from "lucide-react";
 import { useState } from "react";
-import { BsArrowRight } from "react-icons/bs";
 import { Heading, Text, TrackedLink } from "tw-components";
 
 interface RelevantDataSectionProps {
@@ -56,7 +56,7 @@ export const RelevantDataSection: React.FC<RelevantDataSectionProps> = ({
             alignItems="center"
             gap="0.5em"
           >
-            View more <BsArrowRight />
+            View more <MoveRightIcon className="size-4" />
           </Text>
         ) : null}
       </Flex>

apps/dashboard/src/components/engine/configuration/engine-wallet-config.tsx

@@ -13,7 +13,6 @@ import {
 import { CircleAlertIcon } from "lucide-react";
 import Link from "next/link";
 import { useState } from "react";
-import {} from "react-icons/md";
 import { Heading } from "tw-components";
 import { KmsAwsConfig } from "./kms-aws-config";
 import { KmsGcpConfig } from "./kms-gcp-config";

apps/dashboard/src/components/engine/configuration/webhooks-table.tsx

@@ -20,8 +20,8 @@ import { TWTable } from "components/shared/TWTable";
 import { format, formatDistanceToNowStrict } from "date-fns";
 import { useTrack } from "hooks/analytics/useTrack";
 import { useTxNotifications } from "hooks/useTxNotifications";
+import { Trash2Icon } from "lucide-react";
 import { useState } from "react";
-import { FiTrash } from "react-icons/fi";
 import { Button, Card, FormLabel, Text } from "tw-components";
 import { AddressCopyButton } from "tw-components/AddressCopyButton";
 
@@ -212,7 +212,7 @@ export const WebhooksTable: React.FC<WebhooksTableProps> = ({
         isFetched={isFetched}
         onMenuClick={[
           {
-            icon: FiTrash,
+            icon: <Trash2Icon className="size-4" />,
             text: "Delete",
             onClick: onDelete,
             isDestructive: true,

apps/dashboard/src/components/engine/contract-subscription/contract-subscriptions-table.tsx

@@ -29,8 +29,9 @@ import { useTrack } from "hooks/analytics/useTrack";
 import { useAllChainsData } from "hooks/chains/allChains";
 import { useTxNotifications } from "hooks/useTxNotifications";
 import { useV5DashboardChain } from "lib/v5-adapter";
+import { Trash2Icon } from "lucide-react";
 import { useState } from "react";
-import { FiInfo, FiTrash } from "react-icons/fi";
+import { FiInfo } from "react-icons/fi";
 import { eth_getBlockByNumber, getRpcClient } from "thirdweb";
 import { shortenAddress as shortenAddresThrows } from "thirdweb/utils";
 import { Button, Card, FormLabel, LinkButton, Text } from "tw-components";
@@ -221,7 +222,7 @@ export const ContractSubscriptionTable: React.FC<
         isFetched={isFetched}
         onMenuClick={[
           {
-            icon: FiTrash,
+            icon: <Trash2Icon className="size-4" />,
             text: "Remove",
             onClick: (contractSub) => {
               setSelectedContractSub(contractSub);

apps/dashboard/src/components/engine/engine-instances-table.tsx

@@ -28,15 +28,14 @@ import { TWTable } from "components/shared/TWTable";
 import { useTrack } from "hooks/analytics/useTrack";
 import {
   CircleAlertIcon,
+  PencilIcon,
   SendIcon,
   Trash2Icon,
   TriangleAlertIcon,
 } from "lucide-react";
 import Link from "next/link";
 import { type ReactNode, useState } from "react";
 import { useForm } from "react-hook-form";
-import { BiPencil } from "react-icons/bi";
-import { FiTrash } from "react-icons/fi";
 import { toast } from "sonner";
 import { FormLabel } from "tw-components";
 
@@ -140,7 +139,7 @@ export const EngineInstancesTable: React.FC<EngineInstancesTableProps> = ({
         isPending={isPending}
         onMenuClick={[
           {
-            icon: BiPencil,
+            icon: <PencilIcon className="size-4" />,
             text: "Edit",
             onClick: (instance) => {
               trackEvent({
@@ -153,7 +152,7 @@ export const EngineInstancesTable: React.FC<EngineInstancesTableProps> = ({
             },
           },
           {
-            icon: FiTrash,
+            icon: <Trash2Icon className="size-4" />,
             text: "Remove",
             onClick: (instance) => {
               trackEvent({

apps/dashboard/src/components/engine/overview/backend-wallets-table.tsx

@@ -31,10 +31,10 @@ import { TWTable } from "components/shared/TWTable";
 import { useTrack } from "hooks/analytics/useTrack";
 import { useTxNotifications } from "hooks/useTxNotifications";
 import { useActiveChainAsDashboardChain } from "lib/v5-adapter";
+import { DownloadIcon, Trash2Icon, UploadIcon } from "lucide-react";
 import QRCode from "qrcode";
 import { useState } from "react";
 import { useForm } from "react-hook-form";
-import { BiExport, BiImport, BiPencil } from "react-icons/bi";
 import { getAddress } from "thirdweb";
 import { shortenAddress } from "thirdweb/utils";
 import {
@@ -164,23 +164,23 @@ export const BackendWalletsTable: React.FC<BackendWalletsTableProps> = ({
         isFetched={isFetched}
         onMenuClick={[
           {
-            icon: BiPencil,
+            icon: <Trash2Icon className="size-4" />,
             text: "Edit",
             onClick: (wallet) => {
               setSelectedBackendWallet(wallet);
               editDisclosure.onOpen();
             },
           },
           {
-            icon: BiImport,
+            icon: <DownloadIcon className="size-4" />,
             text: "Receive funds",
             onClick: (wallet) => {
               setSelectedBackendWallet(wallet);
               receiveDisclosure.onOpen();
             },
           },
           {
-            icon: BiExport,
+            icon: <UploadIcon className="size-4" />,
             text: "Send funds",
             onClick: (wallet) => {
               setSelectedBackendWallet(wallet);

apps/dashboard/src/components/engine/permissions/access-tokens-table.tsx

@@ -22,9 +22,8 @@ import { createColumnHelper } from "@tanstack/react-table";
 import { TWTable } from "components/shared/TWTable";
 import { useTrack } from "hooks/analytics/useTrack";
 import { useTxNotifications } from "hooks/useTxNotifications";
+import { PencilIcon, Trash2Icon } from "lucide-react";
 import { useState } from "react";
-import { BiPencil } from "react-icons/bi";
-import { FiTrash } from "react-icons/fi";
 import { Button, FormLabel, Text } from "tw-components";
 import { toDateTimeLocal } from "utils/date-utils";
 
@@ -96,15 +95,15 @@ export const AccessTokensTable: React.FC<AccessTokensTableProps> = ({
         isFetched={isFetched}
         onMenuClick={[
           {
-            icon: BiPencil,
+            icon: <PencilIcon className="size-4" />,
             text: "Edit",
             onClick: (accessToken) => {
               setSelectedAccessToken(accessToken);
               editDisclosure.onOpen();
             },
           },
           {
-            icon: FiTrash,
+            icon: <Trash2Icon className="size-4" />,
             text: "Delete",
             onClick: (accessToken) => {
               setSelectedAccessToken(accessToken);

apps/dashboard/src/components/engine/permissions/admins-table.tsx

@@ -23,9 +23,8 @@ import { createColumnHelper } from "@tanstack/react-table";
 import { TWTable } from "components/shared/TWTable";
 import { useTrack } from "hooks/analytics/useTrack";
 import { useTxNotifications } from "hooks/useTxNotifications";
+import { PencilIcon, Trash2Icon } from "lucide-react";
 import { useState } from "react";
-import { BiPencil } from "react-icons/bi";
-import { FiTrash } from "react-icons/fi";
 import { Button, FormLabel, Text } from "tw-components";
 
 interface AdminsTableProps {
@@ -83,15 +82,15 @@ export const AdminsTable: React.FC<AdminsTableProps> = ({
         isFetched={isFetched}
         onMenuClick={[
           {
-            icon: BiPencil,
+            icon: <PencilIcon className="size-4" />,
             text: "Edit",
             onClick: (admin) => {
               setSelectedAdmin(admin);
               editDisclosure.onOpen();
             },
           },
           {
-            icon: FiTrash,
+            icon: <Trash2Icon className="size-4" />,
             text: "Remove",
             onClick: (admin) => {
               setSelectedAdmin(admin);

apps/dashboard/src/components/engine/permissions/keypairs-table.tsx

@@ -20,8 +20,8 @@ import { createColumnHelper } from "@tanstack/react-table";
 import { TWTable } from "components/shared/TWTable";
 import { useTrack } from "hooks/analytics/useTrack";
 import { useTxNotifications } from "hooks/useTxNotifications";
+import { Trash2Icon } from "lucide-react";
 import { useState } from "react";
-import { FiTrash } from "react-icons/fi";
 import { Button, CodeBlock, FormLabel, Text } from "tw-components";
 import { toDateTimeLocal } from "utils/date-utils";
 
@@ -88,7 +88,7 @@ export const KeypairsTable: React.FC<KeypairsTableProps> = ({
         isFetched={isFetched}
         onMenuClick={[
           {
-            icon: FiTrash,
+            icon: <Trash2Icon className="size-4" />,
             text: "Remove",
             onClick: (keypair) => {
               setSelectedKeypair(keypair);

apps/dashboard/src/components/engine/relayer/relayers-table.tsx

@@ -28,10 +28,9 @@ import { TWTable } from "components/shared/TWTable";
 import { useTrack } from "hooks/analytics/useTrack";
 import { useAllChainsData } from "hooks/chains/allChains";
 import { useTxNotifications } from "hooks/useTxNotifications";
+import { PencilIcon, Trash2Icon } from "lucide-react";
 import { useState } from "react";
 import { useForm } from "react-hook-form";
-import { BiPencil } from "react-icons/bi";
-import { FiTrash } from "react-icons/fi";
 import { shortenAddress } from "thirdweb/utils";
 import {
   Button,
@@ -159,15 +158,15 @@ export const RelayersTable: React.FC<RelayersTableProps> = ({
         isFetched={isFetched}
         onMenuClick={[
           {
-            icon: BiPencil,
+            icon: <PencilIcon className="size-4" />,
             text: "Edit",
             onClick: (relayer) => {
               setSelectedRelayer(relayer);
               editDisclosure.onOpen();
             },
           },
           {
-            icon: FiTrash,
+            icon: <Trash2Icon className="size-4" />,
             text: "Remove",
             onClick: (relayer) => {
               setSelectedRelayer(relayer);

apps/dashboard/src/components/shared/TWTable.tsx

@@ -29,11 +29,10 @@ import {
 } from "@tanstack/react-table";
 import { EllipsisVerticalIcon, MoveRightIcon } from "lucide-react";
 import pluralize from "pluralize";
-import { type SetStateAction, useMemo, useState } from "react";
-import type { IconType } from "react-icons/lib";
+import { type ReactNode, type SetStateAction, useMemo, useState } from "react";
 
 type CtaMenuItem<TRowData> = {
-  icon?: IconType;
+  icon?: ReactNode;
   text: string;
   onClick: (row: TRowData) => void;
   isDestructive?: boolean;
@@ -216,7 +215,7 @@ export function TWTable<TRowData>(tableProps: TWTableProps<TRowData>) {
                                   isDestructive && "!text-destructive-text",
                                 )}
                               >
-                                {icon?.({ className: "size-4" })}
+                                {icon}
                                 {text}
                               </DropdownMenuItem>
                             );