Skip to content

Commit 26b8c32

Browse files
committed
[TOOL-4899] Dashboard: fetch token icon from bridge api as fallback in coin asset page (#7460)
<!-- ## title your PR with this format: "[SDK/Dashboard/Portal] Feature/Fix: Concise title for the changes" If you did not copy the branch name from Linear, paste the issue tag here (format is TEAM-0000): ## Notes for the reviewer Anything important to call out? Be sure to also clarify these in your comments. ## How to test Unit tests, playground, etc. --> <!-- start pr-codex --> --- ## PR-Codex overview This PR introduces a new utility function to fetch token information from a bridge and integrates it into the `ERC20PublicPage` component to enhance contract metadata with token icons. ### Detailed summary - Added `fetchTokenInfoFromBridge` function in `fetch-coin-info.ts` to fetch token details from a bridge API. - Integrated `fetchTokenInfoFromBridge` in the `ERC20PublicPage` component. - Updated contract metadata to include the token icon if not already present. > ✨ Ask PR-Codex anything about this PR by commenting with `/codex {your question}` <!-- end pr-codex --> <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Enhanced ERC20 public pages to automatically display token icons when available, enriching token metadata with external information. <!-- end of auto-generated comment: release notes by coderabbit.ai -->
1 parent c7f7f48 commit 26b8c32

File tree

2 files changed

+43
-0
lines changed

2 files changed

+43
-0
lines changed
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
import { isProd } from "@/constants/env-utils";
2+
3+
export async function fetchTokenInfoFromBridge(params: {
4+
chainId: number;
5+
tokenAddress: string;
6+
clientId: string;
7+
}) {
8+
try {
9+
const res = await fetch(
10+
`https://bridge.${isProd ? "thirdweb.com" : "thirdweb-dev.com"}/v1/tokens?chainId=${params.chainId}&tokenAddress=${params.tokenAddress}&clientId=${params.clientId}`,
11+
);
12+
13+
if (!res.ok) {
14+
return null;
15+
}
16+
17+
const data = (await res.json()) as {
18+
data: Array<{
19+
iconUri: string;
20+
address: string;
21+
decimals: number;
22+
name: string;
23+
symbol: string;
24+
priceUsd: number;
25+
}>;
26+
};
27+
28+
return data.data[0];
29+
} catch {
30+
return null;
31+
}
32+
}

apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/public-pages/erc20/erc20.tsx

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@ import { ContractAnalyticsOverview } from "./_components/contract-analytics/cont
1111
import { BuyTokenEmbed } from "./_components/PayEmbedSection";
1212
import { TokenStats } from "./_components/PriceChart";
1313
import { RecentTransfers } from "./_components/RecentTransfers";
14+
import { fetchTokenInfoFromBridge } from "./_utils/fetch-coin-info";
1415
import { getCurrencyMeta } from "./_utils/getCurrencyMeta";
1516

1617
export async function ERC20PublicPage(props: {
@@ -22,6 +23,7 @@ export async function ERC20PublicPage(props: {
2223
contractMetadata,
2324
activeClaimCondition,
2425
tokenDecimals,
26+
tokenInfo,
2527
functionSelectors,
2628
] = await Promise.all([
2729
getContractMetadata({
@@ -31,9 +33,18 @@ export async function ERC20PublicPage(props: {
3133
decimals({
3234
contract: props.serverContract,
3335
}),
36+
fetchTokenInfoFromBridge({
37+
chainId: props.serverContract.chain.id,
38+
clientId: props.clientContract.client.clientId,
39+
tokenAddress: props.serverContract.address,
40+
}),
3441
resolveFunctionSelectors(props.serverContract),
3542
]);
3643

44+
if (!contractMetadata.image && tokenInfo) {
45+
contractMetadata.image = tokenInfo.iconUri;
46+
}
47+
3748
const [contractCreator, claimConditionCurrencyMeta] = await Promise.all([
3849
getContractCreator(props.serverContract, functionSelectors),
3950
activeClaimCondition

0 commit comments

Comments
 (0)