Skip to content

fix: remove token_uri image fallback in NFT pages #67

@pthmas

Description

@pthmas

Problem

Three frontend pages fall back to token.token_uri as an image URL when image_url is null:

  • NFTContractPage.tsx:85token.image_url || token.token_uri || null
  • NFTTokenPage.tsx:16token?.image_url || token?.token_uri || null
  • AddressPage.tsx:335t.image_url || t.token_uri || null

token_uri is a URL to a JSON metadata document, not an image. The browser fetches JSON, fails to render it as an image, and shows a broken image icon — worse than the # placeholder shown when both are null.

Data confirms the fallback never helps. On Eden testnet across 114,951 indexed NFT tokens, there are zero cases where token_uri is a direct image URL:

token_uri type count has image_url
https:// (JSON metadata) 114,660 114,636
data:application/json;base64,... 127 0
NULL / empty 164 0

The backend already handles the one edge case where token_uri might point directly to an image: it checks content-type on fetch and stores it as image_url if image/* (metadata.rs:431-450). So by the time the frontend sees the data, image_url is always the correct field.

Fix

In all three locations, change:

const imageUrl = token.image_url || token.token_uri || null;

to:

const imageUrl = token.image_url || null;

Related

The tokens currently showing image_url = null are caused by separate backend bugs (#65, #66), not by missing frontend fallback logic.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions