diff --git a/netlify.toml b/netlify.toml
index c9970be0e..c3f9854e4 100644
--- a/netlify.toml
+++ b/netlify.toml
@@ -178,7 +178,7 @@ REACT_APP_ETHEREUM_YEAR_BADGE_API_URI = "https://genesis-nft-backend-git-sepolia
 REACT_APP_BADGE_REGISTRY_URL="https://badge-registry.canvas.scroll.cat/badge-registry"
 REACT_APP_BADGE_INDEXER_URL="https://canvas-indexer.scroll.cat"
 REACT_APP_ETHEREUM_YEAR_BADGE_ADDRESS = "0xB59B6466B21a089c93B14030AF88b164905a58fd"
-REACT_APP_SCR_HOLDING_BADGE_ADDRESS="0xef071708e09becfeac1e3d8afa1602bb6eb57922"
+REACT_APP_SCR_HOLDING_BADGE_ADDRESS="0xeF071708e09BECFEac1e3d8AfA1602BB6eB57922"
 
 
 [context.sepolia.environment]
@@ -237,7 +237,7 @@ REACT_APP_ETHEREUM_YEAR_BADGE_API_URI = "https://genesis-nft-backend-git-sepolia
 REACT_APP_BADGE_REGISTRY_URL="https://badge-registry.canvas.scroll.cat/badge-registry"
 REACT_APP_BADGE_INDEXER_URL="https://canvas-indexer.scroll.cat"
 REACT_APP_ETHEREUM_YEAR_BADGE_ADDRESS = "0xB59B6466B21a089c93B14030AF88b164905a58fd"
-REACT_APP_SCR_HOLDING_BADGE_ADDRESS="0xef071708e09becfeac1e3d8afa1602bb6eb57922"
+REACT_APP_SCR_HOLDING_BADGE_ADDRESS="0xeF071708e09BECFEac1e3d8AfA1602BB6eB57922"
 
 
 [context.mainnet.environment]
diff --git a/src/hooks/useValidateENSSubdomain.tsx b/src/hooks/useValidateENSSubdomain.tsx
index 725f2de75..d2cc72d28 100644
--- a/src/hooks/useValidateENSSubdomain.tsx
+++ b/src/hooks/useValidateENSSubdomain.tsx
@@ -17,7 +17,7 @@ const useValidateENSSubdomain = value => {
   const controller = useRef<any>()
 
   useEffect(() => {
-    if (preValue) {
+    if (preValue !== undefined) {
       handleValidateName(value)
     }
   }, [value])
diff --git a/src/pages/canvas/Dashboard/ENSSubdomainDialog/ClaimENS.tsx b/src/pages/canvas/Dashboard/ENSSubdomainDialog/ClaimENS.tsx
index 10717e1fb..9d3064a8a 100644
--- a/src/pages/canvas/Dashboard/ENSSubdomainDialog/ClaimENS.tsx
+++ b/src/pages/canvas/Dashboard/ENSSubdomainDialog/ClaimENS.tsx
@@ -1,5 +1,4 @@
 import { useMemo } from "react"
-import Img from "react-cool-img"
 
 import { Box, Stack, SvgIcon, Typography } from "@mui/material"
 
@@ -11,6 +10,7 @@ import useCanvasProfileStore, { ENSSubdomainDialogTypeEnum } from "@/stores/canv
 import usePerkStore from "@/stores/perksStore"
 import { truncateAddress } from "@/utils"
 
+import BadgeImage from "../../components/BadgeImage"
 import PerksButton from "../../components/PerksButton"
 
 const ClaimENS = () => {
@@ -114,7 +114,8 @@ const ClaimENS = () => {
         </Typography>
         <Stack direction="row" gap={["1.6rem", "2.4rem"]} justifyContent="center">
           {perk.imageURL.map((imageURL, index) => (
-            <Img
+            <BadgeImage
+              key={imageURL}
               src={imageURL}
               alt=""
               style={{ width: isMobile ? "5.6rem" : "10rem", height: isMobile ? "5.6rem" : "10rem" }}
diff --git a/src/pages/canvas/Dashboard/PerksDialog/PerkItem.tsx b/src/pages/canvas/Dashboard/PerksDialog/PerkItem.tsx
index ef85df733..e12cf7959 100644
--- a/src/pages/canvas/Dashboard/PerksDialog/PerkItem.tsx
+++ b/src/pages/canvas/Dashboard/PerksDialog/PerkItem.tsx
@@ -54,11 +54,11 @@ const PerkItem = props => {
       <Stack direction="row" gap="1.6rem" justifyContent="center">
         {imageURL.map((url, index) => (
           <BadgeImage
+            key={url}
             src={url}
             alt={`required-badge-${index}`}
             placeholder={BadgePlaceholderSvg}
-            width={isMobile ? "48px" : "64px"}
-            height={isMobile ? "48px" : "64px"}
+            style={{ width: isMobile ? "4.8rem" : "6.4rem", height: isMobile ? "4.8rem" : "6.4rem" }}
           />
         ))}
       </Stack>
diff --git a/src/pages/canvas/mint-scr/index.tsx b/src/pages/canvas/mint-scr/index.tsx
index 205d23fc0..4279c55f5 100644
--- a/src/pages/canvas/mint-scr/index.tsx
+++ b/src/pages/canvas/mint-scr/index.tsx
@@ -18,7 +18,7 @@ const MintScr = () => {
   const alertWarning = useSnackbar()
   const [scrAmount, setSCRAmount] = useState("")
   const [mintLoading, setMintLoading] = useState(false)
-  const [burnLoading, setBurnLoading] = useState(false)
+  // const [burnLoading, setBurnLoading] = useState(false)
 
   const handleChangeSCRAmount = e => {
     setSCRAmount(sanitizeNumericalString(e.target.value))
@@ -49,30 +49,30 @@ const MintScr = () => {
     }
   }
 
-  const handleBurnToken = async () => {
-    if (chainId !== CHAIN_ID.L2) {
-      alertWarning("please switch to L2")
-      return
-    }
-    try {
-      setBurnLoading(true)
-      const signer = await provider?.getSigner(0)
-      const tokenInterface = new ethers.Contract(SCR_TOKEN_ADDRESS, ERC20ABI, signer)
-      const amount = amountToBN(scrAmount)
-      const tx = await tokenInterface.burn(walletCurrentAddress, amount)
-      const txReceipt = await tx.wait()
-      if (txReceipt?.status === 1) {
-        alertWarning(`Burned ${scrAmount} SCR successfully`, "success")
-        setSCRAmount("")
-      }
-    } catch (e) {
-      if (!isUserRejected(e)) {
-        alertWarning(e.message)
-      }
-    } finally {
-      setBurnLoading(false)
-    }
-  }
+  // const handleBurnToken = async () => {
+  //   if (chainId !== CHAIN_ID.L2) {
+  //     alertWarning("please switch to L2")
+  //     return
+  //   }
+  //   try {
+  //     setBurnLoading(true)
+  //     const signer = await provider?.getSigner(0)
+  //     const tokenInterface = new ethers.Contract(SCR_TOKEN_ADDRESS, ERC20ABI, signer)
+  //     const amount = amountToBN(scrAmount)
+  //     const tx = await tokenInterface.burn(walletCurrentAddress, amount)
+  //     const txReceipt = await tx.wait()
+  //     if (txReceipt?.status === 1) {
+  //       alertWarning(`Burned ${scrAmount} SCR successfully`, "success")
+  //       setSCRAmount("")
+  //     }
+  //   } catch (e) {
+  //     if (!isUserRejected(e)) {
+  //       alertWarning(e.message)
+  //     }
+  //   } finally {
+  //     setBurnLoading(false)
+  //   }
+  // }
   return (
     <Stack direction="column" justifyContent="center" alignItems="center" sx={{ width: "100%", height: `calc(100vh - ${NORMAL_HEADER_HEIGHT})` }}>
       <TextField
@@ -85,12 +85,12 @@ const MintScr = () => {
         onChange={handleChangeSCRAmount}
       />
       <Stack sx={{ width: "25rem", mt: "2rem" }} gap="2rem">
-        <PerksButton loading={mintLoading} onClick={handleMintToken}>
+        <PerksButton loading={mintLoading} disabled={!scrAmount} onClick={handleMintToken}>
           Mint
         </PerksButton>
-        <PerksButton loading={burnLoading} onClick={handleBurnToken}>
+        {/* <PerksButton loading={burnLoading} onClick={handleBurnToken}>
           Burn
-        </PerksButton>
+        </PerksButton> */}
       </Stack>
     </Stack>
   )
diff --git a/src/stores/perksStore.ts b/src/stores/perksStore.ts
index 4a41f5406..eb7bbc5a7 100644
--- a/src/stores/perksStore.ts
+++ b/src/stores/perksStore.ts
@@ -27,7 +27,6 @@ const usePerkStore = create<EnsSubdomainStore>()(set => ({
   generatePerks: async props => {
     const { walletCurrentAddress, userBadges, ensClaimed } = props
 
-    // console.log(userBadges, "userBadges")
     const perkList = [
       {
         id: "claim-ens-subdomain",