From bd6690f93cbbfc2cf32e27257d308b95860a9edf Mon Sep 17 00:00:00 2001 From: holybasil 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 a61bf9f2..23be6896 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 0f563b8d..03438924 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 c05220c0..fdde9916 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 0bb90467..6c0c57f2 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", }} > - {name} + {name} {name} diff --git a/src/services/canvasService.ts b/src/services/canvasService.ts index 571f571d..48a1eedb 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(() => {