From bd6690f93cbbfc2cf32e27257d308b95860a9edf Mon Sep 17 00:00:00 2001
From: holybasil <holybasil.1128@gmail.com>
Date: Thu, 22 Aug 2024 17:08:20 +0800
Subject: [PATCH] fix: support issuerName
---
src/apis/ecosystem.ts | 3 +++
.../Dashboard/BadgeDetailDialog/index.tsx | 10 ++++++--
src/pages/canvas/badge/index.tsx | 19 ++++++++++-----
.../Protocols/ProtocolList/ProtocolCard.tsx | 4 ++--
src/services/canvasService.ts | 23 +++++++++++++++++--
5 files changed, 47 insertions(+), 12 deletions(-)
diff --git a/src/apis/ecosystem.ts b/src/apis/ecosystem.ts
index a61bf9f28..23be68969 100644
--- a/src/apis/ecosystem.ts
+++ b/src/apis/ecosystem.ts
@@ -8,6 +8,9 @@ export const l2beatOrigin = "https://l2beat.com"
export const ecosystemTVLUrl = l2beatOrigin + "/api/tvl/scroll.json"
export const ecosystemActivityUrl = l2beatOrigin + "/api/activity/scroll.json"
+export const fetchEcosystemProtocolLogo = (name, ext) => `${ecosystemListLogoUrl}${name}${ext}`
+export const fetchEcosystemProtocolByNameURL = name => `${ecosystemListUrl}?name=${name}`
+
// cross origin
// export const l2beatOrigin = "https://api.l2beat.com"
// export const ecosystemTVLUrl = l2beatOrigin + "/api/tvl/aggregate?projectSlugs=scroll"
diff --git a/src/pages/canvas/Dashboard/BadgeDetailDialog/index.tsx b/src/pages/canvas/Dashboard/BadgeDetailDialog/index.tsx
index 0f563b8d0..034389243 100644
--- a/src/pages/canvas/Dashboard/BadgeDetailDialog/index.tsx
+++ b/src/pages/canvas/Dashboard/BadgeDetailDialog/index.tsx
@@ -15,7 +15,7 @@ import { useRainbowContext } from "@/contexts/RainbowProvider"
import useCheckViewport from "@/hooks/useCheckViewport"
import useSnackbar from "@/hooks/useSnackbar"
import Dialog from "@/pages/canvas/components/Dialog"
-import { checkBadgeUpgradable, fetchNotionBadgeByAddr, mintBadge } from "@/services/canvasService"
+import { checkBadgeUpgradable, fetchIssuer, fetchNotionBadgeByAddr, mintBadge } from "@/services/canvasService"
import useCanvasStore, { BadgeDetailDialogType, BadgesDialogType } from "@/stores/canvasStore"
import { generateShareTwitterURL, ipfsToBrowserURL, requireEnv, sentryDebug } from "@/utils"
@@ -85,7 +85,13 @@ const BadgeDetailDialog = () => {
queryKey: ["notionBadge", selectedBadge.badgeContract],
queryFn: async () => {
const badge = await fetchNotionBadgeByAddr(selectedBadge.badgeContract)
- return badge.issuer ?? {}
+ if (badge.issuer) {
+ return badge.issuer
+ } else if (selectedBadge.issuerName) {
+ const issuer = await fetchIssuer(selectedBadge.issuerName)
+ return issuer
+ }
+ return {}
},
initialData: {},
})
diff --git a/src/pages/canvas/badge/index.tsx b/src/pages/canvas/badge/index.tsx
index c05220c01..fdde99168 100644
--- a/src/pages/canvas/badge/index.tsx
+++ b/src/pages/canvas/badge/index.tsx
@@ -13,6 +13,7 @@ import { useRainbowContext } from "@/contexts/RainbowProvider"
import useSnackbar from "@/hooks/useSnackbar"
import {
checkBadgeUpgradable,
+ fetchIssuer,
fetchNotionBadgeByAddr,
fillBadgeDetailWithPayload,
queryBadgeDetailById,
@@ -85,8 +86,14 @@ const BadgeDetailPage = () => {
const { badgeContract, description, ...badgeMetadata } = await fillBadgeDetailWithPayload(publicProvider, { id, data })
- const notionBadge = await fetchNotionBadgeByAddr(badgeContract)
- console.log(notionBadge, "notionBadge")
+ let badgeWidthIssuer = await fetchNotionBadgeByAddr(badgeContract)
+ if (!badgeWidthIssuer.issuer) {
+ const issuer = await fetchIssuer(badgeMetadata.issuerName)
+ badgeWidthIssuer = {
+ issuer,
+ thirdParty: true,
+ }
+ }
const name = await fetchProfileUsername(publicProvider, recipient)
let upgradable = false
@@ -101,12 +108,12 @@ const BadgeDetailPage = () => {
ownerLogo: getSmallAvatarURL(recipient),
mintedOn: formatDate(time * 1000),
badgeContract,
- issuer: notionBadge.issuer,
- description: isOriginsNFTBadge(notionBadge.badgeContract) ? notionBadge.description : description,
+ issuer: badgeWidthIssuer.issuer,
+ description: isOriginsNFTBadge(badgeContract) ? badgeWidthIssuer.description : description,
upgradable,
- thirdParty: notionBadge.thirdParty,
+ thirdParty: badgeWidthIssuer.thirdParty,
}
- if (isOriginsNFTBadge(notionBadge.badgeContract)) {
+ if (isOriginsNFTBadge(badgeContract)) {
const rarityNum = badgeMetadata.attributes.find(item => item.trait_type === "Rarity").value
badgeDetail.rarity = NFT_RARITY_MAP[rarityNum]
}
diff --git a/src/pages/ecosystem/Protocols/ProtocolList/ProtocolCard.tsx b/src/pages/ecosystem/Protocols/ProtocolList/ProtocolCard.tsx
index 0bb904674..6c0c57f27 100644
--- a/src/pages/ecosystem/Protocols/ProtocolList/ProtocolCard.tsx
+++ b/src/pages/ecosystem/Protocols/ProtocolList/ProtocolCard.tsx
@@ -4,7 +4,7 @@ import { makeStyles } from "tss-react/mui"
import { Box, Button, Stack, SvgIcon, Typography } from "@mui/material"
-import { ecosystemListLogoUrl } from "@/apis/ecosystem"
+import { fetchEcosystemProtocolLogo } from "@/apis/ecosystem"
import { ReactComponent as ArrowSvg } from "@/assets/svgs/ecosystem/arrow.svg"
import { ReactComponent as TwitterSvg } from "@/assets/svgs/ecosystem/twitter.svg"
import LinesEllipsis from "@/components/LinesEllipsis"
@@ -155,7 +155,7 @@ const ProtocolCard = props => {
gridArea: "logo",
}}
>
- <Img alt={name} src={`${ecosystemListLogoUrl}${name}${ext}`} placeholder={hash} width={isMobile ? 48 : 88} height={isMobile ? 48 : 88}></Img>
+ <Img alt={name} src={fetchEcosystemProtocolLogo(name, ext)} placeholder={hash} width={isMobile ? 48 : 88} height={isMobile ? 48 : 88}></Img>
</Stack>
<Stack direction="row" alignItems="center" gap="0.8rem" className={classes.name}>
<Typography sx={{ fontSize: ["2rem", "2.4rem"], lineHeight: ["2.8rem", "3.2rem"], fontWeight: 600 }}>{name}</Typography>
diff --git a/src/services/canvasService.ts b/src/services/canvasService.ts
index 571f571df..48a1eedbd 100644
--- a/src/services/canvasService.ts
+++ b/src/services/canvasService.ts
@@ -3,6 +3,7 @@ import { AbiCoder, ethers } from "ethers"
import { checkBadgeEligibilityURL, claimBadgeURL } from "@/apis/canvas"
import { fetchBadgeByAddrURL } from "@/apis/canvas-badge"
+import { fetchEcosystemProtocolByNameURL, fetchEcosystemProtocolLogo } from "@/apis/ecosystem"
import AttestProxyABI from "@/assets/abis/CanvasAttestProxy.json"
import BadgeABI from "@/assets/abis/CanvasBadge.json"
import ProfileABI from "@/assets/abis/CanvasProfile.json"
@@ -124,8 +125,7 @@ const getBadgeMetadata = async (provider, badgeContractAddress, badgeUID = ether
const metadata = await scrollRequest(badgeTokenBrowserURL, { timeout: 5e3 })
return metadata
} catch (error) {
- // console.log("Failed to get badge image URI:", error)
- return ""
+ return {}
}
}
@@ -503,6 +503,25 @@ const fetchNotionBadgeByAddr = async addr => {
}
}
+export const fetchIssuer = async issuerName => {
+ try {
+ const { data } = await scrollRequest(fetchEcosystemProtocolByNameURL(issuerName))
+ if (!data.length) {
+ return {}
+ }
+ const [{ name: issuerFullName, ext, website }] = data
+ const issuerLogo = fetchEcosystemProtocolLogo(issuerFullName, ext)
+ const issuer = {
+ name: issuerFullName,
+ logo: issuerLogo,
+ origin: website,
+ }
+ return issuer
+ } catch (error) {
+ return {}
+ }
+}
+
const testAsyncFunc = value => {
return new Promise(resolve => {
setTimeout(() => {