From 14325b815dc1b02c6f239976e5e421e3981ae72d Mon Sep 17 00:00:00 2001 From: holybasil Date: Tue, 20 Aug 2024 09:35:59 +0800 Subject: [PATCH] fix: use subdomain gateway --- .../canvas/Dashboard/BadgeDetailDialog/index.tsx | 4 ++-- src/pages/canvas/Dashboard/BadgeWall/Badge.tsx | 4 ++-- .../GridDragDrop/components/Item/Item.tsx | 4 ++-- .../CustomizeDisplayDialog/Transfer/Item.jsx | 4 ++-- src/pages/canvas/badge/BadgeDetail.tsx | 4 ++-- src/services/canvasService.ts | 11 ++++++----- src/utils/canvas.ts | 6 +++--- 7 files changed, 19 insertions(+), 18 deletions(-) diff --git a/src/pages/canvas/Dashboard/BadgeDetailDialog/index.tsx b/src/pages/canvas/Dashboard/BadgeDetailDialog/index.tsx index c7fd8f342..0f563b8d0 100644 --- a/src/pages/canvas/Dashboard/BadgeDetailDialog/index.tsx +++ b/src/pages/canvas/Dashboard/BadgeDetailDialog/index.tsx @@ -17,7 +17,7 @@ import useSnackbar from "@/hooks/useSnackbar" import Dialog from "@/pages/canvas/components/Dialog" import { checkBadgeUpgradable, fetchNotionBadgeByAddr, mintBadge } from "@/services/canvasService" import useCanvasStore, { BadgeDetailDialogType, BadgesDialogType } from "@/stores/canvasStore" -import { generateShareTwitterURL, getBadgeImgURL, requireEnv, sentryDebug } from "@/utils" +import { generateShareTwitterURL, ipfsToBrowserURL, requireEnv, sentryDebug } from "@/utils" import BadgeDesc from "../../components/BadgeDesc" import UpgradeAction from "./UpgradeAction" @@ -223,7 +223,7 @@ const BadgeDetailDialog = () => { > img { {badge.metadata?.name} diff --git a/src/pages/canvas/Dashboard/CustomizeDisplayDialog/GridDragDrop/components/Item/Item.tsx b/src/pages/canvas/Dashboard/CustomizeDisplayDialog/GridDragDrop/components/Item/Item.tsx index 787711dd6..a63aaf9f9 100644 --- a/src/pages/canvas/Dashboard/CustomizeDisplayDialog/GridDragDrop/components/Item/Item.tsx +++ b/src/pages/canvas/Dashboard/CustomizeDisplayDialog/GridDragDrop/components/Item/Item.tsx @@ -8,7 +8,7 @@ import { tooltipClasses } from "@mui/material/Tooltip" import { keyframes, styled } from "@mui/system" import NameTip from "@/pages/canvas/components/NameTip" -import { getBadgeImgURL } from "@/utils/canvas" +import { ipfsToBrowserURL } from "@/utils/canvas" // import styles from "./Item.module.css" const CustomTooltip = styled(Tooltip)(({ theme }) => ({})) @@ -249,7 +249,7 @@ export const Item = React.memo( {(value diff --git a/src/pages/canvas/Dashboard/CustomizeDisplayDialog/Transfer/Item.jsx b/src/pages/canvas/Dashboard/CustomizeDisplayDialog/Transfer/Item.jsx index a66a1a0c1..579446990 100644 --- a/src/pages/canvas/Dashboard/CustomizeDisplayDialog/Transfer/Item.jsx +++ b/src/pages/canvas/Dashboard/CustomizeDisplayDialog/Transfer/Item.jsx @@ -4,7 +4,7 @@ import { makeStyles } from "tss-react/mui" import { Box } from "@mui/material" -import { getBadgeImgURL } from "@/utils" +import { ipfsToBrowserURL } from "@/utils" const getTranslateX = transform => { return transform ? `${Math.round(transform.x)}px` : undefined @@ -106,7 +106,7 @@ const Item = forwardRef((props: any, ref) => { }} > - {name} + {name} ) diff --git a/src/pages/canvas/badge/BadgeDetail.tsx b/src/pages/canvas/badge/BadgeDetail.tsx index 303a1ba66..ea29102a9 100644 --- a/src/pages/canvas/badge/BadgeDetail.tsx +++ b/src/pages/canvas/badge/BadgeDetail.tsx @@ -10,7 +10,7 @@ import Skeleton from "@/components/Skeleton" import useCheckViewport from "@/hooks/useCheckViewport" import UpgradeAction from "@/pages/canvas/Dashboard/BadgeDetailDialog/UpgradeAction" import useCanvasStore from "@/stores/canvasStore" -import { getBadgeImgURL } from "@/utils" +import { ipfsToBrowserURL } from "@/utils" import BadgeDesc from "../components/BadgeDesc" import Statistic from "../components/Statistic" @@ -148,7 +148,7 @@ const BadgeDetail = props => { ) : ( badge image { const getBadgeMetadata = async (provider, badgeContractAddress, badgeUID = ethers.encodeBytes32String("0x0")) => { try { const contract = new ethers.Contract(badgeContractAddress, BadgeABI, provider) - const badgeMetadataURI = await contract.badgeTokenURI(badgeUID) - let badgeImageURI = badgeMetadataURI.replace(/^ipfs:\/\/(.*)/, "https://ipfs.io/ipfs/$1") - const metadata = await scrollRequest(badgeImageURI, { timeout: 5e3 }) + const badgeTokenURI = await contract.badgeTokenURI(badgeUID) + const badgeTokenBrowserURL = ipfsToBrowserURL(badgeTokenURI) + const metadata = await scrollRequest(badgeTokenBrowserURL, { timeout: 5e3 }) return metadata } catch (error) { // console.log("Failed to get badge image URI:", error) @@ -401,8 +402,8 @@ const upgradeBadge = async (provider, badge) => { const txReceipt = await tx.wait() if (txReceipt.status === 1) { const badgeMetadataURI = await badgeInstance.badgeTokenURI(id) - const accessableURI = badgeMetadataURI.replace(/^ipfs:\/\/(.*)/, "https://ipfs.io/ipfs/$1") - const metadata = await scrollRequest(accessableURI) + const badgeTokenBrowserURL = ipfsToBrowserURL(badgeMetadataURI) + const metadata = await scrollRequest(badgeTokenBrowserURL) return metadata } else { throw new Error("due to any operation that can cause the transaction or top-level call to revert") diff --git a/src/utils/canvas.ts b/src/utils/canvas.ts index 455d1fb18..011449bf8 100644 --- a/src/utils/canvas.ts +++ b/src/utils/canvas.ts @@ -9,9 +9,9 @@ const SCROLL_SEPOLIA_BADGE_SCHEMA = requireEnv("REACT_APP_BADGE_SCHEMA") const SCROLL_ORIGINS_BADGE_ADDRESS = "0x2dBce60ebeAafb77e5472308f432F78aC3AE07d9" -export const getBadgeImgURL = image => { - if (!image) return "" - return image.replace(/^ipfs:\/\/(.*)/, "https://cloudflare-ipfs.com/ipfs/$1") +export const ipfsToBrowserURL = ipfsAddress => { + if (!ipfsAddress) return "" + return ipfsAddress.replace(/^ipfs:\/\/(.*)/, "https://dweb.link/ipfs/$1") } export const decodeBadgePayload = encodedData => {