Update

Author: kien-ngo

apps/dashboard/src/components/badges/opensea.tsx

@@ -1,9 +1,9 @@
-import { Tooltip } from "@chakra-ui/react";
+import { ToolTipLabel } from "@/components/ui/tooltip";
 import { Badge, type BadgeProps } from "tw-components";
 
 export const OpenSeaPropertyBadge: React.FC<BadgeProps> = (props) => {
   return (
-    <Tooltip label="This property is supported on OpenSea">
+    <ToolTipLabel label="This property is supported on OpenSea">
       <Badge
         {...props}
         borderRadius="full"
@@ -12,6 +12,6 @@ export const OpenSeaPropertyBadge: React.FC<BadgeProps> = (props) => {
       >
         OpenSea
       </Badge>
-    </Tooltip>
+    </ToolTipLabel>
   );
 };

apps/dashboard/src/components/connect/ConnectPlaygroundButton.tsx

@@ -1,4 +1,3 @@
-import { Icon } from "@chakra-ui/react";
 import { JavaScriptIcon } from "components/icons/brand-icons/JavaScriptIcon";
 import { ReactIcon } from "components/icons/brand-icons/ReactIcon";
 import { UnityIcon } from "components/icons/brand-icons/UnityIcon";
@@ -48,7 +47,7 @@ const ConnectPlaygroundButton = ({
 
   return (
     <Button
-      leftIcon={<Icon as={logo.icon} fill={logo.fill} />}
+      leftIcon={<logo.icon className="size-4" fill={logo.fill} />}
       border="1px solid transparent"
       variant="solid"
       fontWeight="normal"

apps/dashboard/src/components/ipfs-upload/button.tsx

@@ -1,8 +1,7 @@
-import { Icon } from "@chakra-ui/react";
 import type { UseMutationResult } from "@tanstack/react-query";
 import { FileInput } from "components/shared/FileInput";
 import { useErrorHandler } from "contexts/error-handler";
-import { FiUpload } from "react-icons/fi";
+import { UploadIcon } from "lucide-react";
 import { Button, type ButtonProps } from "tw-components";
 import type { ComponentWithChildren } from "types/component-with-children";
 
@@ -32,7 +31,7 @@ export const IpfsUploadButton: ComponentWithChildren<IpfsUploadButtonProps> = ({
         size="sm"
         variant="solid"
         aria-label="Upload to IPFS"
-        rightIcon={<Icon as={FiUpload} />}
+        rightIcon={<UploadIcon className="size-4" />}
         isLoading={storageUpload.isPending}
         {...buttonProps}
       >

apps/dashboard/src/components/product-pages/common/CodeOptionButton.tsx

@@ -1,4 +1,3 @@
-import { Icon } from "@chakra-ui/react";
 import { JavaScriptIcon } from "components/icons/brand-icons/JavaScriptIcon";
 import { ReactIcon } from "components/icons/brand-icons/ReactIcon";
 import { UnityIcon } from "components/icons/brand-icons/UnityIcon";
@@ -48,7 +47,7 @@ export const CodeOptionButton: React.FC<CodeOptionButtonProps> = ({
 
   return (
     <Button
-      leftIcon={<Icon as={logo.icon} fill={logo.fill} />}
+      leftIcon={<logo.icon className="size-4" fill={logo.fill} />}
       border="1px solid transparent"
       variant="solid"
       fontWeight="normal"

apps/dashboard/src/components/product-pages/common/ProductButton.tsx

@@ -1,6 +1,5 @@
-import { Icon } from "@chakra-ui/react";
 import { useTrack } from "hooks/analytics/useTrack";
-import { BsFillLightningChargeFill } from "react-icons/bs";
+import { ZapIcon } from "lucide-react";
 import {
   type ButtonProps,
   LinkButton,
@@ -11,22 +10,18 @@ interface GeneralCtaProps extends Omit<LinkButtonProps, "href"> {
   title: string;
   href: string;
   size?: ButtonProps["size"];
-  iconColor?: string;
 }
 
 export const ProductButton: React.FC<GeneralCtaProps> = ({
   title,
   href,
-  iconColor = "yellow.400",
   ...props
 }) => {
   const trackEvent = useTrack();
 
   return (
     <LinkButton
-      leftIcon={
-        <Icon as={BsFillLightningChargeFill} color={iconColor} boxSize={4} />
-      }
+      leftIcon={<ZapIcon className="size-4 fill-black" />}
       w="full"
       py="24px"
       onClick={() =>

apps/dashboard/src/contract-ui/components/solidity-inputs/string-input.tsx

@@ -40,7 +40,7 @@ export const SolidityStringInput: React.FC<SolidityInputWithTypeProps> = ({
         onChange={handleChange}
       />
       {showButton && (
-        <InputRightElement mx={1} width={{ base: "75px", md: "145px" }}>
+        <InputRightElement mx={1} width={{ base: "75px", md: "160px" }}>
           <IpfsUploadButton
             onUpload={(uri) => {
               if (functionName) {

apps/dashboard/src/pages/template/[id].tsx

@@ -574,7 +574,6 @@ const TemplatePage: ThirdwebNextPage = (props: TemplatePageProps) => {
               fontSize="14px"
               lineHeight="20px"
               fontWeight={600}
-              iconColor="blackAlpha.900"
             />
             <LinkButton
               as={TrackedLink}