diff --git a/components/Account/NFTokenData.js b/components/Account/NFTokenData.js index 41a45703c..49befceb5 100644 --- a/components/Account/NFTokenData.js +++ b/components/Account/NFTokenData.js @@ -3,7 +3,7 @@ import { useState, useEffect } from 'react' import axios from 'axios' import { useTranslation } from 'next-i18next' import { xahauNetwork, useWidth } from '../../utils' -import { nftName, nftNameLink, nftThumbnail, nftUrl } from '../../utils/nft' +import { NftImage, nftName, nftNameLink, nftThumbnail } from '../../utils/nft' import LinkIcon from '../../public/images/link.svg' import { LinkTx } from '../../utils/links' import { @@ -16,17 +16,6 @@ import { dateFormat } from '../../utils/format' -const size = 60 -const placeholder = `data:image/svg+xml;utf8,${encodeURIComponent( - ` - - - No image - - ` -)}` - export default function NFTokenData({ data, address, objects, ledgerTimestamp, selectedCurrency }) { const windowWidth = useWidth() const { t } = useTranslation() @@ -249,19 +238,13 @@ export default function NFTokenData({ data, address, objects, ledgerTimestamp, s {nfts?.map((nft, i) => ( - {'NFT 800 ? { width: '61px', height: '61px', borderRadius: '4px', margin: '2px' } : { width: '51px', height: '51px', borderRadius: '4px', margin: '2px' } } - onError={(e) => { - e.target.onerror = null - console.log('Error loading NFT image:', e.target.src) - e.target.src = placeholder - }} /> ))} diff --git a/pages/_app.js b/pages/_app.js index ee9e519cb..eaeb0b025 100644 --- a/pages/_app.js +++ b/pages/_app.js @@ -101,6 +101,7 @@ const MyApp = ({ Component, pageProps }) => { '/admin/watchlist', '/nft/[[...id]]', '/tokens', + '/nft-collection/[id]', '/token/[[...id]]' ] const skipOnFirstRender = [ diff --git a/pages/nft-collection/[id].js b/pages/nft-collection/[id].js new file mode 100644 index 000000000..b97b1ecb5 --- /dev/null +++ b/pages/nft-collection/[id].js @@ -0,0 +1,2581 @@ +import { i18n, useTranslation } from 'next-i18next' +import React, { useState, useEffect } from 'react' +import axios from 'axios' +import { serverSideTranslations } from 'next-i18next/serverSideTranslations' +import Link from 'next/link' + +import { + usernameOrAddress, + AddressWithIconFilled, + addressUsernameOrServiceLink, + amountFormat, + convertedAmount, + nativeCurrencyToFiat, + fullDateAndTime, + timeFromNow, + AddressWithIconInline +} from '../../utils/format' +import { getIsSsrMobile } from '../../utils/mobile' +import { nftName, ipfsUrl, NftImage } from '../../utils/nft' + +import SEO from '../../components/SEO' +import { nftClass } from '../../styles/pages/nft.module.scss' +import { useWidth } from '../../utils' +import { axiosServer, passHeaders } from '../../utils/axios' +import { LinkTx } from '../../utils/links' + +export async function getServerSideProps(context) { + const { locale, query, req } = context + const { id } = query + const collectionId = id ? (Array.isArray(id) ? id[0] : id) : '' + let dataRes = [] + let nftRes = [] + + let errorMessage = '' + try { + ;[dataRes, nftRes] = await Promise.all([ + axiosServer({ + method: 'get', + url: `/v2/nft-collection/${encodeURIComponent(collectionId)}?floorPrice=true&statistics=true`, + headers: passHeaders(req) + }), + axiosServer({ + method: 'get', + url: `/v2/nfts?collection=${encodeURIComponent(collectionId)}&limit=16&order=mintedNew&hasMedia=true`, + headers: passHeaders(req) + }) + ]) + } catch (error) { + errorMessage = 'error.' + error.message + } + + if (!dataRes?.data) errorMessage = 'No data found' + + return { + props: { + id: collectionId || null, + data: dataRes?.data || null, + nftList: nftRes?.data?.nfts || [], + isSsrMobile: getIsSsrMobile(context), + errorMessage: errorMessage || null, + ...(await serverSideTranslations(locale, ['common'])) + } + } +} + +export default function NftCollection({ id, nftList, selectedCurrency, isSsrMobile, fiatRate, errorMessage, data }) { + data = { + type: 'xls20', + floorPrice: true, + statistics: true, + collection: { + collection: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR:0', + name: 'sraebyzzuF', + family: null, + description: null, + image: 'bafybeid7c2wzlm6z6fhcruulavmqonlqqdkzdvhaw54lygwxyr24zbtfki/raebyzzuf-#383.png', + createdAt: 1759327260, + updatedAt: 1761155150, + issuer: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR', + issuerDetails: { + address: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR', + username: null, + service: 'Fuzzybear' + }, + taxon: 0, + floorPrices: [ + { + open: { + amount: '8288000000' + }, + private: { + amount: '215000000', + destination: 'rpx9JThQ2y37FaGeeJP7PXDUVEXY3PHZSC', + destinationDetails: { + username: 'xrpcafe', + service: 'xrp.cafe' + } + } + } + ], + statistics: { + owners: 383, + nfts: 1220, + all: { + buyers: 158, + tradedNfts: 380 + }, + day: { + buyers: 9, + tradedNfts: 9 + }, + week: { + buyers: 69, + tradedNfts: 161 + }, + month: { + buyers: 158, + tradedNfts: 380 + }, + year: { + buyers: 157, + tradedNfts: 377 + } + } + } + } + nftList = [ + { + type: 'xls20', + flags: { + burnable: false, + onlyXRP: false, + trustLine: false, + transferable: true, + mutable: false + }, + issuer: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR', + nftokenID: '00080BB84F44098667FBB6C8E7F589183B68708A94C05FC94961979D05E9EC02', + nftokenTaxon: 0, + transferFee: 3000, + sequence: 99216386, + owner: 'rwyNi4qUd7PXMM61zhcxAWvTKQj9kXADWe', + uri: '697066733A2F2F62616679626569677567637466686E696C706A74327032766678626F666370686E717479366A7963726F376A7562366B6D33787278676E366A67342F72616562797A7A754620233736392E6A736F6E', + nftSerial: 99216386, + issuedAt: 1761155150, + ownerChangedAt: 1761155211, + deletedAt: null, + mintedByMarketplace: 'xrp.cafe', + collection: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR:0', + url: 'https://ipfs.io/ipfs/bafybeigugctfhnilpjt2p2vfxbofcphnqty6jycro7jub6km3xrxgn6jg4/raebyzzuF%20%23769.json', + metadata: { + name: 'raebyzzuF #769', + description: '.regdeL PRX eht no sraebyzzuF lanigirO', + external_url: '', + image: 'ipfs://bafybeid7c2wzlm6z6fhcruulavmqonlqqdkzdvhaw54lygwxyr24zbtfki/raebyzzuf-#769.png', + attributes: [ + { + trait_type: 'dnuorgkcaB', + value: 'yerG LPRX' + }, + { + trait_type: 'ruF', + value: 'nworB' + }, + { + trait_type: 'seyE', + value: 'eulB' + }, + { + trait_type: 'sehtolC', + value: 'ieL' + }, + { + trait_type: 'htuoM', + value: 'nioC' + }, + { + trait_type: 'raewdaeH', + value: 'rethgiferiF' + } + ], + properties: { + files: [ + { + uri: 'raebyzzuf-#769.png', + type: 'image/png' + } + ], + category: 'image', + creators: [] + }, + compiler: 'NFTexport.io' + }, + jsonMeta: true, + issuerDetails: { + username: null, + service: 'Fuzzybear' + }, + ownerDetails: { + username: null, + service: null + } + }, + { + type: 'xls20', + flags: { + burnable: false, + onlyXRP: false, + trustLine: false, + transferable: true, + mutable: false + }, + issuer: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR', + nftokenID: '00080BB84F44098667FBB6C8E7F589183B68708A94C05FC9327BC69C05E9EC01', + nftokenTaxon: 0, + transferFee: 3000, + sequence: 99216385, + owner: 'rwyNi4qUd7PXMM61zhcxAWvTKQj9kXADWe', + uri: '697066733A2F2F62616679626569677567637466686E696C706A74327032766678626F666370686E717479366A7963726F376A7562366B6D33787278676E366A67342F72616562797A7A754620233139332E6A736F6E', + nftSerial: 99216385, + issuedAt: 1761155111, + ownerChangedAt: 1761155200, + deletedAt: null, + mintedByMarketplace: 'xrp.cafe', + collection: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR:0', + url: 'https://ipfs.io/ipfs/bafybeigugctfhnilpjt2p2vfxbofcphnqty6jycro7jub6km3xrxgn6jg4/raebyzzuF%20%23193.json', + metadata: { + name: 'raebyzzuF #193', + description: '.regdeL PRX eht no sraebyzzuF lanigirO', + external_url: '', + image: 'ipfs://bafybeid7c2wzlm6z6fhcruulavmqonlqqdkzdvhaw54lygwxyr24zbtfki/raebyzzuf-#193.png', + attributes: [ + { + trait_type: 'dnuorgkcaB', + value: 'wolleY LPRX' + }, + { + trait_type: 'ruF', + value: 'nworB' + }, + { + trait_type: 'ksaM', + value: 'ksaM dloG' + }, + { + trait_type: 'seyE', + value: 'eulB' + }, + { + trait_type: 'sehtolC', + value: 'eceiP-eerhT' + }, + { + trait_type: 'htuoM', + value: 'prahS' + }, + { + trait_type: 'raewdaeH', + value: 'ekureP' + } + ], + properties: { + files: [ + { + uri: 'raebyzzuf-#193.png', + type: 'image/png' + } + ], + category: 'image', + creators: [] + }, + compiler: 'NFTexport.io' + }, + jsonMeta: true, + issuerDetails: { + username: null, + service: 'Fuzzybear' + }, + ownerDetails: { + username: null, + service: null + } + }, + { + type: 'xls20', + flags: { + burnable: false, + onlyXRP: false, + trustLine: false, + transferable: true, + mutable: false + }, + issuer: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR', + nftokenID: '00080BB84F44098667FBB6C8E7F589183B68708A94C05FC91B95F59B05E9EC00', + nftokenTaxon: 0, + transferFee: 3000, + sequence: 99216384, + owner: 'rBMv1oKS4KiJF7BoiAMX1AU9Jo7Jj4MphQ', + uri: '697066733A2F2F62616679626569677567637466686E696C706A74327032766678626F666370686E717479366A7963726F376A7562366B6D33787278676E366A67342F72616562797A7A754620233938312E6A736F6E', + nftSerial: 99216384, + issuedAt: 1759746280, + ownerChangedAt: 1760926961, + deletedAt: null, + mintedByMarketplace: 'xrp.cafe', + collection: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR:0', + url: 'https://ipfs.io/ipfs/bafybeigugctfhnilpjt2p2vfxbofcphnqty6jycro7jub6km3xrxgn6jg4/raebyzzuF%20%23981.json', + metadata: { + name: 'raebyzzuF #981', + description: '.regdeL PRX eht no sraebyzzuF lanigirO', + external_url: '', + image: 'ipfs://bafybeid7c2wzlm6z6fhcruulavmqonlqqdkzdvhaw54lygwxyr24zbtfki/raebyzzuf-#981.png', + attributes: [ + { + trait_type: 'dnuorgkcaB', + value: 'yerG LPRX' + }, + { + trait_type: 'ruF', + value: 'nworB' + }, + { + trait_type: 'seyE', + value: 'elconoM' + }, + { + trait_type: 'sehtolC', + value: 'tiuS ecaR' + }, + { + trait_type: 'htuoM', + value: 'nioC' + }, + { + trait_type: 'raewdaeH', + value: 'nayiaS' + } + ], + properties: { + files: [ + { + uri: 'raebyzzuf-#981.png', + type: 'image/png' + } + ], + category: 'image', + creators: [] + }, + compiler: 'NFTexport.io' + }, + jsonMeta: true, + issuerDetails: { + username: null, + service: 'Fuzzybear' + }, + ownerDetails: { + username: null, + service: null + } + }, + { + type: 'xls20', + flags: { + burnable: false, + onlyXRP: false, + trustLine: false, + transferable: true, + mutable: false + }, + issuer: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR', + nftokenID: '00080BB84F44098667FBB6C8E7F589183B68708A94C05FC904B0249A05E9EBFF', + nftokenTaxon: 0, + transferFee: 3000, + sequence: 99216383, + owner: 'rGrnqJovoTZ3mgNP7jAJhPJjUm2YWhDqqo', + uri: '697066733A2F2F62616679626569677567637466686E696C706A74327032766678626F666370686E717479366A7963726F376A7562366B6D33787278676E366A67342F72616562797A7A754620233932372E6A736F6E', + nftSerial: 99216383, + issuedAt: 1759690561, + ownerChangedAt: 1759690620, + deletedAt: null, + mintedByMarketplace: 'xrp.cafe', + collection: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR:0', + url: 'https://ipfs.io/ipfs/bafybeigugctfhnilpjt2p2vfxbofcphnqty6jycro7jub6km3xrxgn6jg4/raebyzzuF%20%23927.json', + metadata: { + name: 'raebyzzuF #927', + description: '.regdeL PRX eht no sraebyzzuF lanigirO', + external_url: '', + image: 'ipfs://bafybeid7c2wzlm6z6fhcruulavmqonlqqdkzdvhaw54lygwxyr24zbtfki/raebyzzuf-#927.png', + attributes: [ + { + trait_type: 'dnuorgkcaB', + value: 'egnarO LPRX' + }, + { + trait_type: 'ruF', + value: 'yenoH' + }, + { + trait_type: 'ksaM', + value: 'ksaM dloG' + }, + { + trait_type: 'seyE', + value: 'seyE eriF' + }, + { + trait_type: 'sehtolC', + value: 'ommA' + }, + { + trait_type: 'htuoM', + value: 'ragiC' + }, + { + trait_type: 'raewdaeH', + value: 'reitalocohC' + } + ], + properties: { + files: [ + { + uri: 'raebyzzuf-#927.png', + type: 'image/png' + } + ], + category: 'image', + creators: [] + }, + compiler: 'NFTexport.io' + }, + jsonMeta: true, + issuerDetails: { + username: null, + service: 'Fuzzybear' + }, + ownerDetails: { + username: null, + service: null + } + }, + { + type: 'xls20', + flags: { + burnable: false, + onlyXRP: false, + trustLine: false, + transferable: true, + mutable: false + }, + issuer: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR', + nftokenID: '00080BB84F44098667FBB6C8E7F589183B68708A94C05FC9EDCA539905E9EBFE', + nftokenTaxon: 0, + transferFee: 3000, + sequence: 99216382, + owner: 'rfTASBA5vSNaKn5myMz7qiN3ixQ46DsAzq', + uri: '697066733A2F2F62616679626569677567637466686E696C706A74327032766678626F666370686E717479366A7963726F376A7562366B6D33787278676E366A67342F72616562797A7A754620233735342E6A736F6E', + nftSerial: 99216382, + issuedAt: 1759655081, + ownerChangedAt: 1759655171, + deletedAt: null, + mintedByMarketplace: 'xrp.cafe', + collection: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR:0', + url: 'https://ipfs.io/ipfs/bafybeigugctfhnilpjt2p2vfxbofcphnqty6jycro7jub6km3xrxgn6jg4/raebyzzuF%20%23754.json', + metadata: { + name: 'raebyzzuF #754', + description: '.regdeL PRX eht no sraebyzzuF lanigirO', + external_url: '', + image: 'ipfs://bafybeid7c2wzlm6z6fhcruulavmqonlqqdkzdvhaw54lygwxyr24zbtfki/raebyzzuf-#754.png', + attributes: [ + { + trait_type: 'dnuorgkcaB', + value: 'neerG LPRX' + }, + { + trait_type: 'ruF', + value: 'yenoH' + }, + { + trait_type: 'seyE', + value: 'eulB' + }, + { + trait_type: 'sehtolC', + value: 'lennalF' + }, + { + trait_type: 'htuoM', + value: 'nioC' + }, + { + trait_type: 'raewdaeH', + value: 'nogarD' + } + ], + properties: { + files: [ + { + uri: 'raebyzzuf-#754.png', + type: 'image/png' + } + ], + category: 'image', + creators: [] + }, + compiler: 'NFTexport.io' + }, + jsonMeta: true, + issuerDetails: { + username: null, + service: 'Fuzzybear' + }, + ownerDetails: { + username: null, + service: null + } + }, + { + type: 'xls20', + flags: { + burnable: false, + onlyXRP: false, + trustLine: false, + transferable: true, + mutable: false + }, + issuer: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR', + nftokenID: '00080BB84F44098667FBB6C8E7F589183B68708A94C05FC9D6E4829805E9EBFD', + nftokenTaxon: 0, + transferFee: 3000, + sequence: 99216381, + owner: 'rfTASBA5vSNaKn5myMz7qiN3ixQ46DsAzq', + uri: '697066733A2F2F62616679626569677567637466686E696C706A74327032766678626F666370686E717479366A7963726F376A7562366B6D33787278676E366A67342F72616562797A7A754620233636322E6A736F6E', + nftSerial: 99216381, + issuedAt: 1759655081, + ownerChangedAt: 1759655232, + deletedAt: null, + mintedByMarketplace: 'xrp.cafe', + collection: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR:0', + url: 'https://ipfs.io/ipfs/bafybeigugctfhnilpjt2p2vfxbofcphnqty6jycro7jub6km3xrxgn6jg4/raebyzzuF%20%23662.json', + metadata: { + name: 'raebyzzuF #662', + description: '.regdeL PRX eht no sraebyzzuF lanigirO', + external_url: '', + image: 'ipfs://bafybeid7c2wzlm6z6fhcruulavmqonlqqdkzdvhaw54lygwxyr24zbtfki/raebyzzuf-#662.png', + attributes: [ + { + trait_type: 'dnuorgkcaB', + value: 'wolleY LPRX' + }, + { + trait_type: 'ruF', + value: 'nworB' + }, + { + trait_type: 'seyE', + value: 'srotaivA' + }, + { + trait_type: 'sehtolC', + value: 'laitnediserP' + }, + { + trait_type: 'htuoM', + value: 'prahS' + }, + { + trait_type: 'raewdaeH', + value: 'feihC' + } + ], + properties: { + files: [ + { + uri: 'raebyzzuf-#662.png', + type: 'image/png' + } + ], + category: 'image', + creators: [] + }, + compiler: 'NFTexport.io' + }, + jsonMeta: true, + issuerDetails: { + username: null, + service: 'Fuzzybear' + }, + ownerDetails: { + username: null, + service: null + } + }, + { + type: 'xls20', + flags: { + burnable: false, + onlyXRP: false, + trustLine: false, + transferable: true, + mutable: false + }, + issuer: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR', + nftokenID: '00080BB84F44098667FBB6C8E7F589183B68708A94C05FC9BFFEB19705E9EBFC', + nftokenTaxon: 0, + transferFee: 3000, + sequence: 99216380, + owner: 'rfTASBA5vSNaKn5myMz7qiN3ixQ46DsAzq', + uri: '697066733A2F2F62616679626569677567637466686E696C706A74327032766678626F666370686E717479366A7963726F376A7562366B6D33787278676E366A67342F72616562797A7A754620233930392E6A736F6E', + nftSerial: 99216380, + issuedAt: 1759655081, + ownerChangedAt: 1759655191, + deletedAt: null, + mintedByMarketplace: 'xrp.cafe', + collection: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR:0', + url: 'https://ipfs.io/ipfs/bafybeigugctfhnilpjt2p2vfxbofcphnqty6jycro7jub6km3xrxgn6jg4/raebyzzuF%20%23909.json', + metadata: { + name: 'raebyzzuF #909', + description: '.regdeL PRX eht no sraebyzzuF lanigirO', + external_url: '', + image: 'ipfs://bafybeid7c2wzlm6z6fhcruulavmqonlqqdkzdvhaw54lygwxyr24zbtfki/raebyzzuf-#909.png', + attributes: [ + { + trait_type: 'dnuorgkcaB', + value: 'atnegaM LPRX' + }, + { + trait_type: 'ruF', + value: 'TMD' + }, + { + trait_type: 'seyE', + value: 'gninthgiL' + }, + { + trait_type: 'sehtolC', + value: 'ommA' + }, + { + trait_type: 'htuoM', + value: 'lamroN' + }, + { + trait_type: 'raewdaeH', + value: 'taH repaP' + } + ], + properties: { + files: [ + { + uri: 'raebyzzuf-#909.png', + type: 'image/png' + } + ], + category: 'image', + creators: [] + }, + compiler: 'NFTexport.io' + }, + jsonMeta: true, + issuerDetails: { + username: null, + service: 'Fuzzybear' + }, + ownerDetails: { + username: null, + service: null + } + }, + { + type: 'xls20', + flags: { + burnable: false, + onlyXRP: false, + trustLine: false, + transferable: true, + mutable: false + }, + issuer: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR', + nftokenID: '00080BB84F44098667FBB6C8E7F589183B68708A94C05FC9A918E09605E9EBFB', + nftokenTaxon: 0, + transferFee: 3000, + sequence: 99216379, + owner: 'rwnUartEhN32NegquKcDAMf8bauA3UsHrY', + uri: '697066733A2F2F62616679626569677567637466686E696C706A74327032766678626F666370686E717479366A7963726F376A7562366B6D33787278676E366A67342F72616562797A7A75462023313136372E6A736F6E', + nftSerial: 99216379, + issuedAt: 1759595091, + ownerChangedAt: 1759595130, + deletedAt: null, + mintedByMarketplace: 'xrp.cafe', + collection: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR:0', + url: 'https://ipfs.io/ipfs/bafybeigugctfhnilpjt2p2vfxbofcphnqty6jycro7jub6km3xrxgn6jg4/raebyzzuF%20%231167.json', + metadata: { + name: 'raebyzzuF #1167', + description: '.regdeL PRX eht no sraebyzzuF lanigirO', + external_url: '', + image: 'ipfs://bafybeid7c2wzlm6z6fhcruulavmqonlqqdkzdvhaw54lygwxyr24zbtfki/raebyzzuf-#1167.png', + attributes: [ + { + trait_type: 'dnuorgkcaB', + value: 'atnegaM LPRX' + }, + { + trait_type: 'ruF', + value: 'kcalB' + }, + { + trait_type: 'ksaM', + value: 'ksaM dloG' + }, + { + trait_type: 'seyE', + value: 'elconoM' + }, + { + trait_type: 'sehtolC', + value: 'lennalF' + }, + { + trait_type: 'htuoM', + value: 'yfooG' + }, + { + trait_type: 'raewdaeH', + value: 'reitalocohC' + } + ], + properties: { + files: [ + { + uri: 'raebyzzuf-#1167.png', + type: 'image/png' + } + ], + category: 'image', + creators: [] + }, + compiler: 'NFTexport.io' + }, + jsonMeta: true, + issuerDetails: { + username: null, + service: 'Fuzzybear' + }, + ownerDetails: { + username: null, + service: null + } + }, + { + type: 'xls20', + flags: { + burnable: false, + onlyXRP: false, + trustLine: false, + transferable: true, + mutable: false + }, + issuer: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR', + nftokenID: '00080BB84F44098667FBB6C8E7F589183B68708A94C05FC992330F9505E9EBFA', + nftokenTaxon: 0, + transferFee: 3000, + sequence: 99216378, + owner: 'raiJs637z3ojvsehKRUyXuBxJgFVKoEogE', + uri: '697066733A2F2F62616679626569677567637466686E696C706A74327032766678626F666370686E717479366A7963726F376A7562366B6D33787278676E366A67342F72616562797A7A754620233335322E6A736F6E', + nftSerial: 99216378, + issuedAt: 1759590921, + ownerChangedAt: 1759590951, + deletedAt: null, + mintedByMarketplace: 'xrp.cafe', + collection: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR:0', + url: 'https://ipfs.io/ipfs/bafybeigugctfhnilpjt2p2vfxbofcphnqty6jycro7jub6km3xrxgn6jg4/raebyzzuF%20%23352.json', + metadata: { + name: 'raebyzzuF #352', + description: '.regdeL PRX eht no sraebyzzuF lanigirO', + external_url: '', + image: 'ipfs://bafybeid7c2wzlm6z6fhcruulavmqonlqqdkzdvhaw54lygwxyr24zbtfki/raebyzzuf-#352.png', + attributes: [ + { + trait_type: 'dnuorgkcaB', + value: 'wolleY LPRX' + }, + { + trait_type: 'ruF', + value: 'nworB' + }, + { + trait_type: 'seyE', + value: 'seyE yppaH' + }, + { + trait_type: 'sehtolC', + value: 'ommA' + }, + { + trait_type: 'htuoM', + value: 'ragiC' + }, + { + trait_type: 'raewdaeH', + value: 'paC talF' + } + ], + properties: { + files: [ + { + uri: 'raebyzzuf-#352.png', + type: 'image/png' + } + ], + category: 'image', + creators: [] + }, + compiler: 'NFTexport.io' + }, + jsonMeta: true, + issuerDetails: { + username: null, + service: 'Fuzzybear' + }, + ownerDetails: { + username: null, + service: null + } + }, + { + type: 'xls20', + flags: { + burnable: false, + onlyXRP: false, + trustLine: false, + transferable: true, + mutable: false + }, + issuer: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR', + nftokenID: '00080BB84F44098667FBB6C8E7F589183B68708A94C05FC97B4D3E9405E9EBF9', + nftokenTaxon: 0, + transferFee: 3000, + sequence: 99216377, + owner: 'rGrnqJovoTZ3mgNP7jAJhPJjUm2YWhDqqo', + uri: '697066733A2F2F62616679626569677567637466686E696C706A74327032766678626F666370686E717479366A7963726F376A7562366B6D33787278676E366A67342F72616562797A7A754620233538352E6A736F6E', + nftSerial: 99216377, + issuedAt: 1759578411, + ownerChangedAt: 1759578440, + deletedAt: null, + mintedByMarketplace: 'xrp.cafe', + collection: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR:0', + url: 'https://ipfs.io/ipfs/bafybeigugctfhnilpjt2p2vfxbofcphnqty6jycro7jub6km3xrxgn6jg4/raebyzzuF%20%23585.json', + metadata: { + name: 'raebyzzuF #585', + description: '.regdeL PRX eht no sraebyzzuF lanigirO', + external_url: '', + image: 'ipfs://bafybeid7c2wzlm6z6fhcruulavmqonlqqdkzdvhaw54lygwxyr24zbtfki/raebyzzuf-#585.png', + attributes: [ + { + trait_type: 'dnuorgkcaB', + value: 'yerG LPRX' + }, + { + trait_type: 'ruF', + value: 'raloP' + }, + { + trait_type: 'ksaM', + value: 'ksaM dloG' + }, + { + trait_type: 'seyE', + value: 'eulB' + }, + { + trait_type: 'sehtolC', + value: 'yrediorbmE' + }, + { + trait_type: 'htuoM', + value: 'prahS' + }, + { + trait_type: 'raewdaeH', + value: 'AGAM kraD' + } + ], + properties: { + files: [ + { + uri: 'raebyzzuf-#585.png', + type: 'image/png' + } + ], + category: 'image', + creators: [] + }, + compiler: 'NFTexport.io' + }, + jsonMeta: true, + issuerDetails: { + username: null, + service: 'Fuzzybear' + }, + ownerDetails: { + username: null, + service: null + } + }, + { + type: 'xls20', + flags: { + burnable: false, + onlyXRP: false, + trustLine: false, + transferable: true, + mutable: false + }, + issuer: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR', + nftokenID: '00080BB84F44098667FBB6C8E7F589183B68708A94C05FC964676D9305E9EBF8', + nftokenTaxon: 0, + transferFee: 3000, + sequence: 99216376, + owner: 'rKqqb5QZXVAL3VqXJL6obfRGeHou1DtyBV', + uri: '697066733A2F2F62616679626569677567637466686E696C706A74327032766678626F666370686E717479366A7963726F376A7562366B6D33787278676E366A67342F72616562797A7A754620233930312E6A736F6E', + nftSerial: 99216376, + issuedAt: 1759514490, + ownerChangedAt: 1759514490, + deletedAt: null, + mintedByMarketplace: 'xrp.cafe', + collection: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR:0', + url: 'https://ipfs.io/ipfs/bafybeigugctfhnilpjt2p2vfxbofcphnqty6jycro7jub6km3xrxgn6jg4/raebyzzuF%20%23901.json', + metadata: { + name: 'raebyzzuF #901', + description: '.regdeL PRX eht no sraebyzzuF lanigirO', + external_url: '', + image: 'ipfs://bafybeid7c2wzlm6z6fhcruulavmqonlqqdkzdvhaw54lygwxyr24zbtfki/raebyzzuf-#901.png', + attributes: [ + { + trait_type: 'dnuorgkcaB', + value: 'atnegaM LPRX' + }, + { + trait_type: 'ruF', + value: 'kcalB' + }, + { + trait_type: 'seyE', + value: 'eulB' + }, + { + trait_type: 'sehtolC', + value: 'ngiS' + }, + { + trait_type: 'htuoM', + value: 'eugnoT' + }, + { + trait_type: 'raewdaeH', + value: 'temleH nI kcoL' + } + ], + properties: { + files: [ + { + uri: 'raebyzzuf-#901.png', + type: 'image/png' + } + ], + category: 'image', + creators: [] + }, + compiler: 'NFTexport.io' + }, + jsonMeta: true, + issuerDetails: { + username: null, + service: 'Fuzzybear' + }, + ownerDetails: { + username: null, + service: null + } + }, + { + type: 'xls20', + flags: { + burnable: false, + onlyXRP: false, + trustLine: false, + transferable: true, + mutable: false + }, + issuer: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR', + nftokenID: '00080BB84F44098667FBB6C8E7F589183B68708A94C05FC94D819C9205E9EBF7', + nftokenTaxon: 0, + transferFee: 3000, + sequence: 99216375, + owner: 'rGrnqJovoTZ3mgNP7jAJhPJjUm2YWhDqqo', + uri: '697066733A2F2F62616679626569677567637466686E696C706A74327032766678626F666370686E717479366A7963726F376A7562366B6D33787278676E366A67342F72616562797A7A754620233238392E6A736F6E', + nftSerial: 99216375, + issuedAt: 1759508510, + ownerChangedAt: 1759508561, + deletedAt: null, + mintedByMarketplace: 'xrp.cafe', + collection: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR:0', + url: 'https://ipfs.io/ipfs/bafybeigugctfhnilpjt2p2vfxbofcphnqty6jycro7jub6km3xrxgn6jg4/raebyzzuF%20%23289.json', + metadata: { + name: 'raebyzzuF #289', + description: '.regdeL PRX eht no sraebyzzuF lanigirO', + external_url: '', + image: 'ipfs://bafybeid7c2wzlm6z6fhcruulavmqonlqqdkzdvhaw54lygwxyr24zbtfki/raebyzzuf-#289.png', + attributes: [ + { + trait_type: 'dnuorgkcaB', + value: 'wolleY LPRX' + }, + { + trait_type: 'ruF', + value: 'nworB' + }, + { + trait_type: 'seyE', + value: 'eulB' + }, + { + trait_type: 'sehtolC', + value: 'nI kcoL' + }, + { + trait_type: 'htuoM', + value: 'nioC' + }, + { + trait_type: 'raewdaeH', + value: 'nwolbdniM' + } + ], + properties: { + files: [ + { + uri: 'raebyzzuf-#289.png', + type: 'image/png' + } + ], + category: 'image', + creators: [] + }, + compiler: 'NFTexport.io' + }, + jsonMeta: true, + issuerDetails: { + username: null, + service: 'Fuzzybear' + }, + ownerDetails: { + username: null, + service: null + } + }, + { + type: 'xls20', + flags: { + burnable: false, + onlyXRP: false, + trustLine: false, + transferable: true, + mutable: false + }, + issuer: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR', + nftokenID: '00080BB84F44098667FBB6C8E7F589183B68708A94C05FC9369BCB9105E9EBF6', + nftokenTaxon: 0, + transferFee: 3000, + sequence: 99216374, + owner: 'rKRDnGGz9GttgSNRe6iMsQHFe3KQyqwFZP', + uri: '697066733A2F2F62616679626569677567637466686E696C706A74327032766678626F666370686E717479366A7963726F376A7562366B6D33787278676E366A67342F72616562797A7A754620233435392E6A736F6E', + nftSerial: 99216374, + issuedAt: 1759466841, + ownerChangedAt: 1759466862, + deletedAt: null, + mintedByMarketplace: 'xrp.cafe', + collection: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR:0', + url: 'https://ipfs.io/ipfs/bafybeigugctfhnilpjt2p2vfxbofcphnqty6jycro7jub6km3xrxgn6jg4/raebyzzuF%20%23459.json', + metadata: { + name: 'raebyzzuF #459', + description: '.regdeL PRX eht no sraebyzzuF lanigirO', + external_url: '', + image: 'ipfs://bafybeid7c2wzlm6z6fhcruulavmqonlqqdkzdvhaw54lygwxyr24zbtfki/raebyzzuf-#459.png', + attributes: [ + { + trait_type: 'dnuorgkcaB', + value: 'neerG LPRX' + }, + { + trait_type: 'ruF', + value: 'raloP' + }, + { + trait_type: 'seyE', + value: 'eulB' + }, + { + trait_type: 'sehtolC', + value: 'eceiP-eerhT' + }, + { + trait_type: 'htuoM', + value: 'yfooG' + }, + { + trait_type: 'raewdaeH', + value: 'lacitcaT' + } + ], + properties: { + files: [ + { + uri: 'raebyzzuf-#459.png', + type: 'image/png' + } + ], + category: 'image', + creators: [] + }, + compiler: 'NFTexport.io' + }, + jsonMeta: true, + issuerDetails: { + username: null, + service: 'Fuzzybear' + }, + ownerDetails: { + username: null, + service: null + } + }, + { + type: 'xls20', + flags: { + burnable: false, + onlyXRP: false, + trustLine: false, + transferable: true, + mutable: false + }, + issuer: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR', + nftokenID: '00080BB84F44098667FBB6C8E7F589183B68708A94C05FC91FB5FA9005E9EBF5', + nftokenTaxon: 0, + transferFee: 3000, + sequence: 99216373, + owner: 'rsEvQmfNYxQZE6csWtYo1YesgKBRWPwZHn', + uri: '697066733A2F2F62616679626569677567637466686E696C706A74327032766678626F666370686E717479366A7963726F376A7562366B6D33787278676E366A67342F72616562797A7A754620233532372E6A736F6E', + nftSerial: 99216373, + issuedAt: 1759466741, + ownerChangedAt: 1760301320, + deletedAt: null, + mintedByMarketplace: 'xrp.cafe', + collection: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR:0', + url: 'https://ipfs.io/ipfs/bafybeigugctfhnilpjt2p2vfxbofcphnqty6jycro7jub6km3xrxgn6jg4/raebyzzuF%20%23527.json', + metadata: { + name: 'raebyzzuF #527', + description: '.regdeL PRX eht no sraebyzzuF lanigirO', + external_url: '', + image: 'ipfs://bafybeid7c2wzlm6z6fhcruulavmqonlqqdkzdvhaw54lygwxyr24zbtfki/raebyzzuf-#527.png', + attributes: [ + { + trait_type: 'dnuorgkcaB', + value: 'dedoC' + }, + { + trait_type: 'ruF', + value: 'nworB' + }, + { + trait_type: 'seyE', + value: 'oeN' + }, + { + trait_type: 'sehtolC', + value: 'nI kcoL' + }, + { + trait_type: 'htuoM', + value: 'eugnoT' + }, + { + trait_type: 'raewdaeH', + value: 'paC lortaP' + } + ], + properties: { + files: [ + { + uri: 'raebyzzuf-#527.png', + type: 'image/png' + } + ], + category: 'image', + creators: [] + }, + compiler: 'NFTexport.io' + }, + jsonMeta: true, + issuerDetails: { + username: null, + service: 'Fuzzybear' + }, + ownerDetails: { + username: null, + service: null + } + }, + { + type: 'xls20', + flags: { + burnable: false, + onlyXRP: false, + trustLine: false, + transferable: true, + mutable: false + }, + issuer: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR', + nftokenID: '00080BB84F44098667FBB6C8E7F589183B68708A94C05FC908D0298F05E9EBF4', + nftokenTaxon: 0, + transferFee: 3000, + sequence: 99216372, + owner: 'rUmB9q64vyf4jKBDNEzk11M4MbunWo9xDV', + uri: '697066733A2F2F62616679626569677567637466686E696C706A74327032766678626F666370686E717479366A7963726F376A7562366B6D33787278676E366A67342F72616562797A7A754620233835342E6A736F6E', + nftSerial: 99216372, + issuedAt: 1759460480, + ownerChangedAt: 1759460592, + deletedAt: null, + mintedByMarketplace: 'xrp.cafe', + collection: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR:0', + url: 'https://ipfs.io/ipfs/bafybeigugctfhnilpjt2p2vfxbofcphnqty6jycro7jub6km3xrxgn6jg4/raebyzzuF%20%23854.json', + metadata: { + name: 'raebyzzuF #854', + description: '.regdeL PRX eht no sraebyzzuF lanigirO', + external_url: '', + image: 'ipfs://bafybeid7c2wzlm6z6fhcruulavmqonlqqdkzdvhaw54lygwxyr24zbtfki/raebyzzuf-#854.png', + attributes: [ + { + trait_type: 'dnuorgkcaB', + value: 'elpruP-deR LPRX' + }, + { + trait_type: 'ruF', + value: 'toirtaP' + }, + { + trait_type: 'seyE', + value: 'sessalgeyE' + }, + { + trait_type: 'sehtolC', + value: 'rediaR' + }, + { + trait_type: 'htuoM', + value: 'draeB' + }, + { + trait_type: 'raewdaeH', + value: 'galF' + } + ], + properties: { + files: [ + { + uri: 'raebyzzuf-#854.png', + type: 'image/png' + } + ], + category: 'image', + creators: [] + }, + compiler: 'NFTexport.io' + }, + jsonMeta: true, + issuerDetails: { + username: null, + service: 'Fuzzybear' + }, + ownerDetails: { + username: null, + service: null + } + }, + { + type: 'xls20', + flags: { + burnable: false, + onlyXRP: false, + trustLine: false, + transferable: true, + mutable: false + }, + issuer: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR', + nftokenID: '00080BB84F44098667FBB6C8E7F589183B68708A94C05FC9F1EA588E05E9EBF3', + nftokenTaxon: 0, + transferFee: 3000, + sequence: 99216371, + owner: 'r9vcymgCTNX91gxx33ULFrmYBTBrVKuRsk', + uri: '697066733A2F2F62616679626569677567637466686E696C706A74327032766678626F666370686E717479366A7963726F376A7562366B6D33787278676E366A67342F72616562797A7A75462023313133342E6A736F6E', + nftSerial: 99216371, + issuedAt: 1759439601, + ownerChangedAt: 1759439640, + deletedAt: null, + mintedByMarketplace: 'xrp.cafe', + collection: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR:0', + url: 'https://ipfs.io/ipfs/bafybeigugctfhnilpjt2p2vfxbofcphnqty6jycro7jub6km3xrxgn6jg4/raebyzzuF%20%231134.json', + metadata: { + name: 'raebyzzuF #1134', + description: '.regdeL PRX eht no sraebyzzuF lanigirO', + external_url: '', + image: 'ipfs://bafybeid7c2wzlm6z6fhcruulavmqonlqqdkzdvhaw54lygwxyr24zbtfki/raebyzzuf-#1134.png', + attributes: [ + { + trait_type: 'dnuorgkcaB', + value: 'wolleY LPRX' + }, + { + trait_type: 'ruF', + value: 'adnaP' + }, + { + trait_type: 'ksaM', + value: 'ksaM dloG' + }, + { + trait_type: 'seyE', + value: 'seyE-ediS' + }, + { + trait_type: 'sehtolC', + value: 'dlanoDcM' + }, + { + trait_type: 'htuoM', + value: 'eugnoT' + }, + { + trait_type: 'raewdaeH', + value: 'nogarD' + } + ], + properties: { + files: [ + { + uri: 'raebyzzuf-#1134.png', + type: 'image/png' + } + ], + category: 'image', + creators: [] + }, + compiler: 'NFTexport.io' + }, + jsonMeta: true, + issuerDetails: { + username: null, + service: 'Fuzzybear' + }, + ownerDetails: { + username: null, + service: null + } + } + ] + errorMessage = null + + const { t } = useTranslation() + const width = useWidth() + const collection = data?.collection + const statistics = collection?.statistics + const [activityData, setActivityData] = useState({ + sales: [], + listings: [], + mints: [] + }) + const [activityLoading, setActivityLoading] = useState(false) + const [isMobile, setIsMobile] = useState(isSsrMobile) + + useEffect(() => { + // Client-side viewport fallback for mobile detection + const updateIsMobile = () => { + try { + setIsMobile(isSsrMobile || width <= 768) + } catch (_) {} + } + updateIsMobile() + // eslint-disable-next-line react-hooks/exhaustive-deps + }, [width]) + + useEffect(() => { + fetchActivityData() + }, [selectedCurrency]) + + const fetchActivityData = async () => { + setActivityLoading(true) + + try { + let [salesRes, listingsRes] = await Promise.all([ + axios( + `/v2/nft-sales?collection=${encodeURIComponent( + id + )}&list=lastSold&limit=3&convertCurrencies=${selectedCurrency}` + ).catch(() => null), + + axios( + `/v2/nfts?collection=${encodeURIComponent( + id + )}&list=onSale&order=offerCreatedNew&limit=3¤cy=${selectedCurrency}` + ).catch(() => null) + ]) + + salesRes = { + data: { + list: 'lastSold', + order: 'soldNew', + type: 'xls20', + saleType: 'all', + period: 'all', + convertCurrencies: ['usd'], + collection: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR:0', + total: { + primary: 0, + secondary: 493 + }, + marker: '16F6C71A00000001', + sales: [ + { + type: 'xls20', + nftokenID: '00080BB84F44098667FBB6C8E7F589183B68708A94C05FC90E8BAE9705E9E8FC', + acceptedAt: '1761200230', + acceptedLedgerIndex: '99710021', + acceptedTxHash: '848E1CC9386DD0B73AF17C2D3497AA63D8AE15A9F0F97561B2D753C1B9795650', + acceptedAccount: 'rpx9JThQ2y37FaGeeJP7PXDUVEXY3PHZSC', + seller: 'rPQBftvkb3oD7TqG9sDAAd6DU5bgPNKD6Q', + buyer: 'rEp5TJg3qCdnC8oKRM29gTYhGh9CtgegJ7', + amount: '160000000', + broker: true, + marketplace: 'xrp.cafe', + saleType: 'secondary', + amountInConvertCurrencies: { + usd: '385.7424' + }, + nftoken: { + type: 'xls20', + flags: { + burnable: false, + onlyXRP: false, + trustLine: false, + transferable: true, + mutable: false + }, + issuer: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR', + nftokenID: '00080BB84F44098667FBB6C8E7F589183B68708A94C05FC90E8BAE9705E9E8FC', + nftokenTaxon: 0, + transferFee: 3000, + sequence: 99215612, + owner: 'rEp5TJg3qCdnC8oKRM29gTYhGh9CtgegJ7', + uri: '697066733A2F2F62616679626569677567637466686E696C706A74327032766678626F666370686E717479366A7963726F376A7562366B6D33787278676E366A67342F72616562797A7A754620233334382E6A736F6E', + nftSerial: 99215612, + issuedAt: 1759327490, + ownerChangedAt: 1761200230, + deletedAt: null, + mintedByMarketplace: 'xrp.cafe', + collection: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR:0', + url: 'https://ipfs.io/ipfs/bafybeigugctfhnilpjt2p2vfxbofcphnqty6jycro7jub6km3xrxgn6jg4/raebyzzuF%20%23348.json', + metadata: { + name: 'raebyzzuF #348', + description: '.regdeL PRX eht no sraebyzzuF lanigirO', + external_url: '', + image: 'ipfs://bafybeid7c2wzlm6z6fhcruulavmqonlqqdkzdvhaw54lygwxyr24zbtfki/raebyzzuf-#348.png', + attributes: [ + { + trait_type: 'dnuorgkcaB', + value: 'atnegaM LPRX' + }, + { + trait_type: 'ruF', + value: 'nworB' + }, + { + trait_type: 'seyE', + value: 'seyE-X resaL' + }, + { + trait_type: 'sehtolC', + value: 'ieL' + }, + { + trait_type: 'htuoM', + value: 'yfooG' + }, + { + trait_type: 'raewdaeH', + value: 'paC lortaP' + } + ], + properties: { + files: [ + { + uri: 'raebyzzuf-#348.png', + type: 'image/png' + } + ], + category: 'image', + creators: [] + }, + compiler: 'NFTexport.io' + }, + jsonMeta: true, + issuerDetails: { + username: null, + service: 'Fuzzybear' + }, + ownerDetails: { + username: null, + service: null + } + }, + sellerDetails: { + username: null, + service: null + }, + buyerDetails: { + username: null, + service: null + }, + acceptedAccountDetails: { + username: 'xrpcafe', + service: 'xrp.cafe' + } + }, + { + type: 'xls20', + nftokenID: '00080BB84F44098667FBB6C8E7F589183B68708A94C05FC96CD4164E05E9E9B3', + acceptedAt: '1761192741', + acceptedLedgerIndex: '99708090', + acceptedTxHash: 'DD0EAA5C0607A704AB15061015798941055A80C6E37E5865094D27C07C86CC96', + acceptedAccount: 'rpx9JThQ2y37FaGeeJP7PXDUVEXY3PHZSC', + seller: 'rrhDuWYTsHzRGemQJJCjnSwr4EE9RyghDE', + buyer: 'rafg7VDdbjEtpJPp1XAqYcgvFerRgK5pwf', + amount: '200000000', + broker: true, + marketplace: 'xrp.cafe', + saleType: 'secondary', + amountInConvertCurrencies: { + usd: '475.704' + }, + nftoken: { + type: 'xls20', + flags: { + burnable: false, + onlyXRP: false, + trustLine: false, + transferable: true, + mutable: false + }, + issuer: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR', + nftokenID: '00080BB84F44098667FBB6C8E7F589183B68708A94C05FC96CD4164E05E9E9B3', + nftokenTaxon: 0, + transferFee: 3000, + sequence: 99215795, + owner: 'rDeJ4nvQ5oC5dEstxTCeYqhr9GvnDRtmjK', + uri: '697066733A2F2F62616679626569677567637466686E696C706A74327032766678626F666370686E717479366A7963726F376A7562366B6D33787278676E366A67342F72616562797A7A754620233439372E6A736F6E', + nftSerial: 99215795, + issuedAt: 1759327672, + ownerChangedAt: 1761204381, + deletedAt: null, + mintedByMarketplace: 'xrp.cafe', + collection: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR:0', + url: 'https://ipfs.io/ipfs/bafybeigugctfhnilpjt2p2vfxbofcphnqty6jycro7jub6km3xrxgn6jg4/raebyzzuF%20%23497.json', + metadata: { + name: 'raebyzzuF #497', + description: '.regdeL PRX eht no sraebyzzuF lanigirO', + external_url: '', + image: 'ipfs://bafybeid7c2wzlm6z6fhcruulavmqonlqqdkzdvhaw54lygwxyr24zbtfki/raebyzzuf-#497.png', + attributes: [ + { + trait_type: 'dnuorgkcaB', + value: 'atnegaM LPRX' + }, + { + trait_type: 'ruF', + value: 'nworB' + }, + { + trait_type: 'seyE', + value: 'seyE ratS' + }, + { + trait_type: 'sehtolC', + value: 'yrediorbmE' + }, + { + trait_type: 'htuoM', + value: 'yfooG' + }, + { + trait_type: 'raewdaeH', + value: 'relpdiR' + } + ], + properties: { + files: [ + { + uri: 'raebyzzuf-#497.png', + type: 'image/png' + } + ], + category: 'image', + creators: [] + }, + compiler: 'NFTexport.io' + }, + jsonMeta: true, + issuerDetails: { + username: null, + service: 'Fuzzybear' + }, + ownerDetails: { + username: null, + service: null + } + }, + sellerDetails: { + username: null, + service: null + }, + buyerDetails: { + username: null, + service: null + }, + acceptedAccountDetails: { + username: 'xrpcafe', + service: 'xrp.cafe' + } + }, + { + type: 'xls20', + nftokenID: '00080BB84F44098667FBB6C8E7F589183B68708A94C05FC972365DB405E9EB19', + acceptedAt: '1761188720', + acceptedLedgerIndex: '99707051', + acceptedTxHash: 'F7AFAF4C3EE4972A6417ED23A8437653E0A01A8C56C35C5B135BDD056718242A', + acceptedAccount: 'rpx9JThQ2y37FaGeeJP7PXDUVEXY3PHZSC', + seller: 'rEgKovBZ4Q9Uo8RC2e6vriF6wXmbWea44e', + buyer: 'rJuVwXaTL3KUpJN4rjtgZecrtn5kxfM31n', + amount: '225753108', + broker: true, + marketplace: 'xrp.cafe', + saleType: 'secondary', + amountInConvertCurrencies: { + usd: '537.1366' + }, + nftoken: { + type: 'xls20', + flags: { + burnable: false, + onlyXRP: false, + trustLine: false, + transferable: true, + mutable: false + }, + issuer: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR', + nftokenID: '00080BB84F44098667FBB6C8E7F589183B68708A94C05FC972365DB405E9EB19', + nftokenTaxon: 0, + transferFee: 3000, + sequence: 99216153, + owner: 'rJuVwXaTL3KUpJN4rjtgZecrtn5kxfM31n', + uri: '697066733A2F2F62616679626569677567637466686E696C706A74327032766678626F666370686E717479366A7963726F376A7562366B6D33787278676E366A67342F72616562797A7A754620233533362E6A736F6E', + nftSerial: 99216153, + issuedAt: 1759329421, + ownerChangedAt: 1761188720, + deletedAt: null, + mintedByMarketplace: 'xrp.cafe', + collection: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR:0', + url: 'https://ipfs.io/ipfs/bafybeigugctfhnilpjt2p2vfxbofcphnqty6jycro7jub6km3xrxgn6jg4/raebyzzuF%20%23536.json', + metadata: { + name: 'raebyzzuF #536', + description: '.regdeL PRX eht no sraebyzzuF lanigirO', + external_url: '', + image: 'ipfs://bafybeid7c2wzlm6z6fhcruulavmqonlqqdkzdvhaw54lygwxyr24zbtfki/raebyzzuf-#536.png', + attributes: [ + { + trait_type: 'dnuorgkcaB', + value: 'eulB LPRX' + }, + { + trait_type: 'ruF', + value: 'kcalB' + }, + { + trait_type: 'seyE', + value: 'seyE yppaH' + }, + { + trait_type: 'sehtolC', + value: 'laitnediserP' + }, + { + trait_type: 'htuoM', + value: 'eugnoT' + }, + { + trait_type: 'raewdaeH', + value: 'reitalocohC' + } + ], + properties: { + files: [ + { + uri: 'raebyzzuf-#536.png', + type: 'image/png' + } + ], + category: 'image', + creators: [] + }, + compiler: 'NFTexport.io' + }, + jsonMeta: true, + issuerDetails: { + username: null, + service: 'Fuzzybear' + }, + ownerDetails: { + username: null, + service: null + } + }, + sellerDetails: { + username: null, + service: null + }, + buyerDetails: { + username: null, + service: null + }, + acceptedAccountDetails: { + username: 'xrpcafe', + service: 'xrp.cafe' + } + } + ] + } + } + listingsRes = { + data: { + type: 'xls20', + list: 'onSale', + order: 'offerCreatedNew', + currency: 'usd', + collection: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR:0', + collectionDetails: { + collection: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR:0', + name: 'sraebyzzuF', + family: null, + description: null, + image: 'bafybeid7c2wzlm6z6fhcruulavmqonlqqdkzdvhaw54lygwxyr24zbtfki/raebyzzuf-#383.png', + createdAt: 1759327260, + updatedAt: 1761155150, + issuer: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR', + issuerDetails: { + address: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR', + username: null, + service: 'Fuzzybear' + }, + taxon: 0 + }, + sellOffers: true, + summary: { + total: 360 + }, + nfts: [ + { + type: 'xls20', + flags: { + burnable: false, + onlyXRP: false, + trustLine: false, + transferable: true, + mutable: false + }, + issuer: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR', + nftokenID: '00080BB84F44098667FBB6C8E7F589183B68708A94C05FC93A7D03DC05E9E941', + nftokenTaxon: 0, + transferFee: 3000, + sequence: 99215681, + owner: 'rsRBA6pgV3dTT7TA4GBzqnewQ5wxn9h17J', + uri: '697066733A2F2F62616679626569677567637466686E696C706A74327032766678626F666370686E717479366A7963726F376A7562366B6D33787278676E366A67342F72616562797A7A754620233638312E6A736F6E', + nftSerial: 99215681, + issuedAt: 1759327532, + ownerChangedAt: 1761067411, + deletedAt: null, + mintedByMarketplace: 'xrp.cafe', + collection: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR:0', + url: 'https://ipfs.io/ipfs/bafybeigugctfhnilpjt2p2vfxbofcphnqty6jycro7jub6km3xrxgn6jg4/raebyzzuF%20%23681.json', + metadata: { + name: 'raebyzzuF #681', + description: '.regdeL PRX eht no sraebyzzuF lanigirO', + external_url: '', + image: 'ipfs://bafybeid7c2wzlm6z6fhcruulavmqonlqqdkzdvhaw54lygwxyr24zbtfki/raebyzzuf-#681.png', + attributes: [ + { + trait_type: 'dnuorgkcaB', + value: 'elpruP-deR LPRX' + }, + { + trait_type: 'ruF', + value: 'yenoH' + }, + { + trait_type: 'seyE', + value: 'seyE-X resaL' + }, + { + trait_type: 'sehtolC', + value: 'gaT emaN' + }, + { + trait_type: 'htuoM', + value: 'prahS' + }, + { + trait_type: 'raewdaeH', + value: 'temleH nI kcoL' + } + ], + properties: { + files: [ + { + uri: 'raebyzzuf-#681.png', + type: 'image/png' + } + ], + category: 'image', + creators: [] + }, + compiler: 'NFTexport.io' + }, + jsonMeta: true, + issuerDetails: { + username: null, + service: 'Fuzzybear' + }, + ownerDetails: { + username: null, + service: null + }, + sellOffers: [ + { + type: 'xls20', + nftokenID: '00080BB84F44098667FBB6C8E7F589183B68708A94C05FC93A7D03DC05E9E941', + offerIndex: '434D96FDB3D557B0F8BEE0A0C5B1676BFDFB991B41A796660A3C4BA9DDD60C13', + createdAt: 1761211512, + createdLedgerIndex: 99712933, + createdTxHash: '9AC8AEB6DC8DA9AEB48A28BBCF8066A27B3DA735BC369C07E59BBBDA8D3FDADF', + account: 'rsRBA6pgV3dTT7TA4GBzqnewQ5wxn9h17J', + owner: 'rsRBA6pgV3dTT7TA4GBzqnewQ5wxn9h17J', + destination: 'rpx9JThQ2y37FaGeeJP7PXDUVEXY3PHZSC', + expiration: null, + amount: '232000000', + flags: { + sellToken: true + }, + accountDetails: { + username: null, + service: null + }, + ownerDetails: { + username: null, + service: null + }, + destinationDetails: { + username: 'xrpcafe', + service: 'xrp.cafe' + } + } + ] + }, + { + type: 'xls20', + flags: { + burnable: false, + onlyXRP: false, + trustLine: false, + transferable: true, + mutable: false + }, + issuer: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR', + nftokenID: '00080BB84F44098667FBB6C8E7F589183B68708A94C05FC90E8BAE9705E9E8FC', + nftokenTaxon: 0, + transferFee: 3000, + sequence: 99215612, + owner: 'rEp5TJg3qCdnC8oKRM29gTYhGh9CtgegJ7', + uri: '697066733A2F2F62616679626569677567637466686E696C706A74327032766678626F666370686E717479366A7963726F376A7562366B6D33787278676E366A67342F72616562797A7A754620233334382E6A736F6E', + nftSerial: 99215612, + issuedAt: 1759327490, + ownerChangedAt: 1761200230, + deletedAt: null, + mintedByMarketplace: 'xrp.cafe', + collection: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR:0', + url: 'https://ipfs.io/ipfs/bafybeigugctfhnilpjt2p2vfxbofcphnqty6jycro7jub6km3xrxgn6jg4/raebyzzuF%20%23348.json', + metadata: { + name: 'raebyzzuF #348', + description: '.regdeL PRX eht no sraebyzzuF lanigirO', + external_url: '', + image: 'ipfs://bafybeid7c2wzlm6z6fhcruulavmqonlqqdkzdvhaw54lygwxyr24zbtfki/raebyzzuf-#348.png', + attributes: [ + { + trait_type: 'dnuorgkcaB', + value: 'atnegaM LPRX' + }, + { + trait_type: 'ruF', + value: 'nworB' + }, + { + trait_type: 'seyE', + value: 'seyE-X resaL' + }, + { + trait_type: 'sehtolC', + value: 'ieL' + }, + { + trait_type: 'htuoM', + value: 'yfooG' + }, + { + trait_type: 'raewdaeH', + value: 'paC lortaP' + } + ], + properties: { + files: [ + { + uri: 'raebyzzuf-#348.png', + type: 'image/png' + } + ], + category: 'image', + creators: [] + }, + compiler: 'NFTexport.io' + }, + jsonMeta: true, + issuerDetails: { + username: null, + service: 'Fuzzybear' + }, + ownerDetails: { + username: null, + service: null + }, + sellOffers: [ + { + type: 'xls20', + nftokenID: '00080BB84F44098667FBB6C8E7F589183B68708A94C05FC90E8BAE9705E9E8FC', + offerIndex: 'CEB7FB87A90BE8A8AB512AF3453FFB0845F3FAE251111C67AE4CF046A4922F34', + createdAt: 1761210452, + createdLedgerIndex: 99712660, + createdTxHash: 'D1C4ED6D6AD90F8B8DFF6BA66178762FB26BF9F5D1E53EBB775F3747390B0169', + account: 'rEp5TJg3qCdnC8oKRM29gTYhGh9CtgegJ7', + owner: 'rEp5TJg3qCdnC8oKRM29gTYhGh9CtgegJ7', + destination: 'rpx9JThQ2y37FaGeeJP7PXDUVEXY3PHZSC', + expiration: null, + amount: '232500000', + flags: { + sellToken: true + }, + accountDetails: { + username: null, + service: null + }, + ownerDetails: { + username: null, + service: null + }, + destinationDetails: { + username: 'xrpcafe', + service: 'xrp.cafe' + } + } + ] + }, + { + type: 'xls20', + flags: { + burnable: false, + onlyXRP: false, + trustLine: false, + transferable: true, + mutable: false + }, + issuer: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR', + nftokenID: '00080BB84F44098667FBB6C8E7F589183B68708A94C05FC96CD4164E05E9E9B3', + nftokenTaxon: 0, + transferFee: 3000, + sequence: 99215795, + owner: 'rDeJ4nvQ5oC5dEstxTCeYqhr9GvnDRtmjK', + uri: '697066733A2F2F62616679626569677567637466686E696C706A74327032766678626F666370686E717479366A7963726F376A7562366B6D33787278676E366A67342F72616562797A7A754620233439372E6A736F6E', + nftSerial: 99215795, + issuedAt: 1759327672, + ownerChangedAt: 1761204381, + deletedAt: null, + mintedByMarketplace: 'xrp.cafe', + collection: 'r3NftTqH2hv3skuWAEDWKvqnxjtuqcFWYR:0', + url: 'https://ipfs.io/ipfs/bafybeigugctfhnilpjt2p2vfxbofcphnqty6jycro7jub6km3xrxgn6jg4/raebyzzuF%20%23497.json', + metadata: { + name: 'raebyzzuF #497', + description: '.regdeL PRX eht no sraebyzzuF lanigirO', + external_url: '', + image: 'ipfs://bafybeid7c2wzlm6z6fhcruulavmqonlqqdkzdvhaw54lygwxyr24zbtfki/raebyzzuf-#497.png', + attributes: [ + { + trait_type: 'dnuorgkcaB', + value: 'atnegaM LPRX' + }, + { + trait_type: 'ruF', + value: 'nworB' + }, + { + trait_type: 'seyE', + value: 'seyE ratS' + }, + { + trait_type: 'sehtolC', + value: 'yrediorbmE' + }, + { + trait_type: 'htuoM', + value: 'yfooG' + }, + { + trait_type: 'raewdaeH', + value: 'relpdiR' + } + ], + properties: { + files: [ + { + uri: 'raebyzzuf-#497.png', + type: 'image/png' + } + ], + category: 'image', + creators: [] + }, + compiler: 'NFTexport.io' + }, + jsonMeta: true, + issuerDetails: { + username: null, + service: 'Fuzzybear' + }, + ownerDetails: { + username: null, + service: null + }, + sellOffers: [ + { + type: 'xls20', + nftokenID: '00080BB84F44098667FBB6C8E7F589183B68708A94C05FC96CD4164E05E9E9B3', + offerIndex: 'E91B1FC2BEC5243C4513F9371E363CA3DB6EB01C09CD95EEEC628F23CAB0E431', + createdAt: 1761204482, + createdLedgerIndex: 99711118, + createdTxHash: '0C85F4E308978F3BB08BEA3B9E8D3F258C1F9A41D1AEA5D1520F1681BA39EC36', + account: 'rDeJ4nvQ5oC5dEstxTCeYqhr9GvnDRtmjK', + owner: 'rDeJ4nvQ5oC5dEstxTCeYqhr9GvnDRtmjK', + destination: 'rpx9JThQ2y37FaGeeJP7PXDUVEXY3PHZSC', + expiration: null, + amount: '825000000', + flags: { + sellToken: true + }, + accountDetails: { + username: null, + service: null + }, + ownerDetails: { + username: null, + service: null + }, + destinationDetails: { + username: 'xrpcafe', + service: 'xrp.cafe' + } + } + ] + } + ], + limit: 3, + marker: '16E5DA2A00000001' + } + } + + setActivityData({ + sales: salesRes?.data?.sales || [], + listings: listingsRes?.data?.nfts || [], + mints: nftList.slice(0, 3) + }) + } catch (error) { + console.error('Error fetching activity data:', error) + setActivityData({ sales: [], listings: [], mints: [] }) + } finally { + setActivityLoading(false) + } + } + + const collectionName = (data) => { + return ( + data?.collection?.name || ( + <> + {addressUsernameOrServiceLink(data?.collection, 'issuer', { short: isMobile })} ({data?.collection?.taxon}) + + ) + ) + } + + const imageUrl = ipfsUrl(collection?.image) + + const renderActivityTable = (kind) => { + let title = '' + let headers = [] + let items = [] + if (kind === 'sales') { + title = 'Recent Sales' + headers = ['NFT', 'Seller / Buyer', 'Price', 'Sold'] + items = activityData.sales || [] + } else if (kind === 'listings') { + title = 'Recent Listings' + headers = ['NFT', 'Owner', 'Price', 'Listed'] + items = activityData.listings || [] + } else if (kind === 'mints') { + title = 'Recent Mints' + headers = ['NFT', 'Owner', 'Minted'] + items = activityData.mints || [] + } + + // Mobile: render blocks instead of table + if (isMobile) { + return ( + + + + + + + + {items.length > 0 ? ( + items.map((item, i) => { + return ( + + + + + + {kind === 'sales' && ( + <> + + + + + + + + + + + + + + + + + + )} + {kind === 'listings' && ( + <> + + + + + + + + + + + + + + )} + {kind === 'mints' && ( + <> + + + + + + + + + + )} + {i !== items.length - 1 && ( + + + + )} + + ) + }) + ) : ( + + + + )} + +
{title}
NFT + + {nftName(item?.nftoken || item)} +
Seller + +
Buyer + +
Price + {amountFormat(item.amount)}≈ {convertedAmount(item, selectedCurrency, { short: true })} +
Sold + {timeFromNow(item.acceptedAt, i18n)} +
Owner + +
Price + {amountFormat(item?.sellOffers?.[0]?.amount)} + {nativeCurrencyToFiat({ + amount: item?.sellOffers?.[0]?.amount, + selectedCurrency, + fiatRate + })} +
Listed + {timeFromNow(item.sellOffers?.[0]?.createdAt, i18n)}{' '} + +
Owner + +
Minted + {timeFromNow(item.issuedAt, i18n)} + {/* not ready on the backend */} +
+
+
No information found
+ ) + } + + const nftImageSize = ['sales', 'listings'].includes(kind) ? 40 : 20 + + // Desktop + return ( + + + + + + + + + {items.length > 0 && + headers.map((h, i) => ( + + ))} + + {items.length > 0 ? ( + items.map((item, i) => ( + + + {kind === 'sales' && ( + <> + + + + + )} + {kind === 'listings' && ( + <> + + + + + )} + {kind === 'mints' && ( + <> + + + + )} + + )) + ) : ( + + + + )} + +
{title}
+ {h} +
+ + + {nftName(item?.nftoken || item)} + + + +
+ + 		+ {amountFormat(item.amount)} +
+ ≈{convertedAmount(item, selectedCurrency, { short: true })} + 		+ {timeFromNow(item.acceptedAt, i18n)} + {item.owner && } + {amountFormat(item?.sellOffers?.[0]?.amount)} +
+ {nativeCurrencyToFiat({ amount: item?.sellOffers?.[0]?.amount, selectedCurrency, fiatRate })} + 		+ {timeFromNow(item.ownerChangedAt, i18n)}{' '} + + + {item.owner && } + + {timeFromNow(item.issuedAt, i18n)} + {/* not ready on the backend */} +
No information found
+ ) + } + + const statsTdClass = isMobile ? 'right' : '' + + return ( +
+ +
+ {id && !data?.error ? ( + <> + {!data && !errorMessage ? ( +
+ +
+ {t('general.loading')} +
+ ) : ( + <> + {errorMessage ? ( +
{errorMessage}
+ ) : ( + <> + {data && ( + <> +
+
+ {imageUrl ? ( + {collectionName(data)} + ) : ( + 'No image available' + )} +
+
+ +
+ {collection?.issuer && ( + + + + + + + + + + + + {collection?.description && ( + + + + + )} + + + + + {collection?.taxon !== undefined && ( + + + + + )} + {collection?.createdAt && ( + + + + + )} + {collection?.updatedAt && ( + + + + + )} + +
Collection information
Collection{collectionName(data)}
Description{collection?.description}
Issuer + +
Taxon{collection?.taxon}
Created + {timeFromNow(collection.createdAt, i18n)} ({fullDateAndTime(collection.createdAt)} + ) +
Updated + {timeFromNow(collection.updatedAt, i18n)} ({fullDateAndTime(collection.updatedAt)} + ) +
+ )} + + {statistics && ( + + + + + + + + {statistics?.nfts && ( + + + + + )} + {statistics?.owners && ( + + + + + )} + {statistics?.all?.buyers && ( + + + + + )} + {statistics?.all?.tradedNfts && ( + + + + + )} + {statistics?.month?.tradedNfts && ( + + + + + )} + {statistics?.week?.tradedNfts && ( + + + + + )} + +
Statistics
Total NFTs{statistics.nfts}
Unique owners{statistics.owners}
Total buyers{statistics.all.buyers}
Total traded NFTs{statistics.all.tradedNfts}
Monthly traded NFTs{statistics.month.tradedNfts}
Weekly traded NFTs{statistics.week.tradedNfts}
+ )} + + + + + + + + + + + + +
+ NFTs in this Collection + {collection?.issuer && (collection?.taxon || collection?.taxon === 0) ? ( + <> + {' '} + [ + + View all + + ] + + ) : ( + collection?.collection && ( + <> + {' '} + [ + + View all + + ] + + ) + )} +
+
+ {nftList.length === 0 && No NFTs found} + {nftList?.map((nft, i) => ( + + 800 + ? { + width: 67.3, + height: 67.3, + borderRadius: 4, + margin: 2 + } + : { width: 80.5, height: 80.5, borderRadius: 4, margin: 2 } + } + /> + + ))} +
+
+ +
+ {activityLoading && ( +
+ +
+ )} + + {!activityLoading && ( +
+ {renderActivityTable('sales')} + {renderActivityTable('listings')} + {renderActivityTable('mints')} +
+ )} +
+
+ + )} + + )} + + )} + + ) : ( + <> +

NFT Collection

+

{data?.error || t('desc', { ns: 'nft' })}

+ + )} +
+
+ ) +} diff --git a/pages/nft-volumes/index.js b/pages/nft-volumes/index.js index 7b381f109..312a82ee4 100644 --- a/pages/nft-volumes/index.js +++ b/pages/nft-volumes/index.js @@ -648,6 +648,23 @@ export default function NftVolumes({ return {text || } } + const nftCollectionLink = (data, options = {}) => { + if (!data) return '' + const { text } = options + + if (data.collectionDetails?.issuer || data.collectionDetails?.name) { + let collectionId + if(data.collectionDetails.issuer) { + collectionId = data.collectionDetails.issuer + ':' + data.collectionDetails.taxon + } else { + collectionId = data.collection + } + return {text || } + } + + return '' + } + const nftDistributionLink = (data) => { if (!data) return '' let params = '?issuer=' @@ -917,7 +934,7 @@ export default function NftVolumes({ ) } - let nameLink = nftExplorerLink(data, { + let nameLink = nftCollectionLink(data, { text: name || collectionNameText(data) }) diff --git a/utils/format.js b/utils/format.js index 4d08c0fe9..d99328d49 100644 --- a/utils/format.js +++ b/utils/format.js @@ -54,19 +54,33 @@ export const CurrencyWithIcon = ({ token }) => { export const AddressWithIconInline = ({ data, name = 'address', options }) => { const address = data[name] + const size = 20 + const placeholder = `data:image/svg+xml;utf8,${encodeURIComponent( + ` + + + ;( + + ` + )}` + return ( - <> + - {data?.[name?.toLowerCase() { + e.target.onerror = null + e.target.src = placeholder + }} /> {addressUsernameOrServiceLink(data, name, options)} - + ) } @@ -633,7 +647,7 @@ export const addressUsernameOrServiceLink = (data, type, options = {}) => { if (options.url === '/explorer/') { return oldExplorerLink(data?.[type], { short: options.short }) } else { - return {shortAddress(data?.[type])} + return {shortAddress(data?.[type], options.short)} } } if (options.url === '/explorer/') { diff --git a/utils/nft.js b/utils/nft.js index 2e2d43243..31d1c4fec 100644 --- a/utils/nft.js +++ b/utils/nft.js @@ -517,3 +517,30 @@ export const nftPriceData = (t, sellOffers, loggedInAddress) => { } return t('table.text.private-offer') //shouldn't be the case } + +export const NftImage = ({ nft, style }) => { + const size = style?.width && typeof style.width !== 'string' && style.width > 0 ? style.width : 70 + let text = size < 50 ? ';(' : 'No image' + const placeholder = `data:image/svg+xml;utf8,${encodeURIComponent( + ` + + + ${text} + + ` + )}` + if (style?.width === 20) { + style.marginBottom = '-5px' + } + return ( + {nftName(nft?.nftoken { + e.target.onerror = null + e.target.src = placeholder + }} + /> + ) +}