diff --git a/src/App.tsx b/src/App.tsx index a32852e..5c87b44 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -46,8 +46,8 @@ function App() { } /> } /> - } /> - } /> + } /> + } /> } /> diff --git a/src/components/AssetTab.tsx b/src/components/AssetTab.tsx index 86f79a4..f8657ef 100644 --- a/src/components/AssetTab.tsx +++ b/src/components/AssetTab.tsx @@ -18,8 +18,9 @@ import { styled } from '@mui/system' import IconCheck from '../assets/images/icon-check.svg' import IconInfo from '../assets/images/icon-info.svg' import GoldBar from '../assets/images/gold-bar.jpg' +import Gray from '../assets/images/gold-bar.jpg' -import { useDataSetAssetsContext, IFinalAsset } from '../hooks/useDatachainOutput' +import { useDataSetAssetsContext, IFinalAsset, DatachainOutputContextT } from '../hooks/useDatachainOutput' import { TableHeadCell, CustomLink, TableBodyCellUnique } from './TableStyles' const SectionWrapper = styled(Box)(({ theme }) => ({ @@ -36,12 +37,7 @@ const SectionWrapper = styled(Box)(({ theme }) => ({ })) const AssetsDetails = ({ assets }: { assets: IFinalAsset[] }) => { - let uniqueItems: any = new Set( - assets.map((asset: IFinalAsset) => - asset['asset-type'] === 'Carbon Credits Batch' ? 'Carbon Credits Batch' : asset['asset-type'], - ), - ) - uniqueItems = Array.from(uniqueItems) + const uniqueItems = Array.from(new Set(assets.map((asset) => asset.metadata.type))) return ( @@ -60,7 +56,7 @@ const AssetsDetails = ({ assets }: { assets: IFinalAsset[] }) => { {asset} - {assets?.filter((item) => item['asset-type'] === asset).length} + {assets?.filter((item) => item.metadata.type === asset).length} 0 ))} @@ -71,12 +67,14 @@ const AssetsDetails = ({ assets }: { assets: IFinalAsset[] }) => { } const IndividualAssetTable = ({ + selectedDataSet, assets, page, setPage, rowsPerPage, setRowsPerPage, }: { + selectedDataSet: DatachainOutputContextT assets: IFinalAsset[] page: number setPage: any @@ -223,11 +221,12 @@ const IndividualAssetTable = ({ - Serial No. + Token Id. Asset Status Blockchain Token Ref. + Batch Id Owner Address @@ -235,20 +234,21 @@ const IndividualAssetTable = ({ {assets.slice(page * rowsPerPage, page * rowsPerPage + rowsPerPage).map((row: IFinalAsset) => { - const location = row.locations[0] - const assetContract = location?.contract - const assetTokenId = location?.tokenId - const assetSerial = row.assetNumber + const { metadata } = row + + const assetBatchId = row.batchId + const assetTokenId = row.tokenId const onAssetClick = () => { - if (assetContract && assetTokenId) { - navigate(`/single-asset/${id}/${assetContract}/${assetTokenId}`) + if (assetTokenId) { + navigate(`/single-asset/${id}/${assetTokenId}/${assetBatchId}`) } else { - navigate(`/single-asset/${id}/${assetSerial}`) + navigate(`/single-asset/${id}/${assetTokenId}`) } } - const message = row.status === 'ok' ? hovermessage : row.failedReason + const message = + selectedDataSet.verifications[2].status === 'success' ? hovermessage : 'failed verification' return ( - {assetSerial} + {assetTokenId} - -1 ? GoldBar : row.imageUrl} - width="36" - height="36" - alt="." - /> + . - {row.assetName} + {metadata.name} - . + . - {location ? location.name : 'Zippienet'} - - - {location && location.contract - ? `${location.contract.slice(0, 6)}...${location.contract.slice(location.contract.length - 4)}` - : `${location.tokenId.slice(0, 6)}...${location.tokenId.slice(location.tokenId.length - 4)}`} + {metadata ? metadata.chain : 'Zippienet'} - - {location?.ownerAccount - ? `${location.ownerAccount.slice(0, 6)}...${location.ownerAccount.slice( - location.ownerAccount.length - 4, - )}` - : ''} - + {assetTokenId} + {assetBatchId} + + {row.owner} @@ -378,6 +368,7 @@ const AssetTab = () => { setPage={setPage} page={page} assets={assets} + selectedDataSet={selectedDataSet} /> diff --git a/src/components/Footer.tsx b/src/components/Footer.tsx index 45744de..4b41e45 100644 --- a/src/components/Footer.tsx +++ b/src/components/Footer.tsx @@ -14,7 +14,7 @@ const Footer = () => { } return ( - + diff --git a/src/components/Search.tsx b/src/components/Search.tsx index e5c0db2..6fefae4 100644 --- a/src/components/Search.tsx +++ b/src/components/Search.tsx @@ -41,7 +41,7 @@ const Search = () => { width: '100%', }} type="text" - placeholder="Token URL or name" + placeholder="Search dataset by name" onKeyDown={handleKeyDown} onChange={(ev) => { setSearchValue(ev.target.value) diff --git a/src/components/SingleAssetDetailsTab.tsx b/src/components/SingleAssetDetailsTab.tsx index fb8d6bf..2a061a0 100644 --- a/src/components/SingleAssetDetailsTab.tsx +++ b/src/components/SingleAssetDetailsTab.tsx @@ -10,7 +10,7 @@ import IconCheck from '../assets/images/icon-check.svg' import IconInfo from '../assets/images/icon-info.svg' const SingleAssetDetailsTab = () => { - const { assetContract, assetTokenId, assetSerial, id } = useParams() + const { assetContract, assetBatchId, assetTokenId, id } = useParams() const { selectedDataSet, isLoading } = useDataSetAssetsContext() const metaData = selectedDataSet?.metadata @@ -18,25 +18,11 @@ const SingleAssetDetailsTab = () => { const lastVerified = selectedDataSet?.lastVerified as number const createdDate = selectedDataSet?.creationDate as number - const asset = assetSerial - ? assets?.find((asset) => asset.assetNumber === assetSerial) - : assets?.find( - (asset) => - asset.locations[0]?.contract?.toLocaleLowerCase() === assetContract?.toLocaleLowerCase() && - asset.locations[0]?.tokenId === assetTokenId, - ) + const assetTokenIdNumber = assetTokenId !== undefined ? parseInt(assetTokenId, 10) : null + const asset = assets?.find((asset) => asset.tokenId === assetTokenIdNumber) const message = asset?.status === 'ok' ? 'Verified successfully' : asset?.failedReason || '' - const location = asset?.locations[0] - - const tokenId = location?.tokenId - - const lenthToken = tokenId?.length as number - - const tokenRef = lenthToken > 12 ? `${tokenId?.slice(0, 6)}...${tokenId?.slice(-4)}` : tokenId - - const Description = getOverviewComponent(metaData?.name || '') return ( <> @@ -44,9 +30,7 @@ const SingleAssetDetailsTab = () => { Description - - - + {metaData?.['asset-description']} @@ -66,13 +50,13 @@ const SingleAssetDetailsTab = () => { Asset name . - {asset?.assetName} + {asset?.metadata.name} @@ -90,19 +74,24 @@ const SingleAssetDetailsTab = () => { Status - . + . BlockChain - {asset?.currentLocation} + {asset?.metadata.chain} Token ID - {tokenRef} + {asset?.tokenId} @@ -112,7 +101,7 @@ const SingleAssetDetailsTab = () => { Owner Address - {location?.ownerAccount} + {asset?.owner} Creator diff --git a/src/components/TabsSingleAsset.tsx b/src/components/TabsSingleAsset.tsx index f52a780..ebf504e 100644 --- a/src/components/TabsSingleAsset.tsx +++ b/src/components/TabsSingleAsset.tsx @@ -47,7 +47,7 @@ const TabsSingleAsset = () => ( Details - Attributes + {/* Attributes */} {/* History */} @@ -56,9 +56,9 @@ const TabsSingleAsset = () => ( - + {/* - + */} {/* 4sdfsdf diff --git a/src/hooks/useDatachainOutput.tsx b/src/hooks/useDatachainOutput.tsx index 9dde863..4a8001d 100644 --- a/src/hooks/useDatachainOutput.tsx +++ b/src/hooks/useDatachainOutput.tsx @@ -36,6 +36,11 @@ interface IMetadata { ['supported-locations']: string[] datasetLinked?: string[] publisher: string + chain: string + class: string + token: string + type: string + vcu: string } export interface IDatasetDynamic { @@ -71,6 +76,10 @@ export interface IFinalAsset { timestamp: number serialNumberStart?: string serialNumberEnd?: string + batchId: number + tokenId: number + owner: string + metadata: IMetadata } interface IDataSetOutputs { [key: string]: DatachainOutputContextT diff --git a/src/views/AssetSearchResult.tsx b/src/views/AssetSearchResult.tsx index deb6c15..6eda894 100644 --- a/src/views/AssetSearchResult.tsx +++ b/src/views/AssetSearchResult.tsx @@ -69,16 +69,16 @@ const AssetSearchResult = () => { const lenthToken = TLIDataSet?.token.id.length as number const tokenRef = lenthToken > 12 ? `${TLIDataSet?.token.id.slice(0, 6)}...${TLIDataSet?.token.id.slice(-4)}` : TLIDataSet?.token.id - const datasetId = Object.keys(datasetOutputs).find((id) => { - const { assets } = datasetOutputs[id] - return assets.some( - ({ locations }) => - locations[0].contract?.toLocaleLowerCase() === assetContract?.toLocaleLowerCase() && - locations[0].tokenId === assetTokenId, - ) - }) - - if ((!assetContract || !assetTokenId || !datasetId) && !TLIDataSet && !datasets.length) { + // const datasetId = Object.keys(datasetOutputs).find((id) => { + // const { assets } = datasetOutputs[id] + // return assets.some( + // ({ locations }) => + // locations[0].contract?.toLocaleLowerCase() === assetContract?.toLocaleLowerCase() && + // locations[0].tokenId === assetTokenId, + // ) + // }) + + if (!datasets.length) { return ( @@ -88,14 +88,14 @@ const AssetSearchResult = () => { ) } - const assets = datasetId ? datasetOutputs[datasetId].assets : [] - const filtered = assets - ? assets.filter( - ({ locations }) => - locations[0].contract?.toLocaleLowerCase() === assetContract?.toLocaleLowerCase() && - locations[0].tokenId === assetTokenId, - ) - : [] + // const assets = datasetId ? datasetOutputs[datasetId].assets : [] + // const filtered = assets + // ? assets.filter( + // ({ locations }) => + // locations[0].contract?.toLocaleLowerCase() === assetContract?.toLocaleLowerCase() && + // locations[0].tokenId === assetTokenId, + // ) + // : [] const verifiedId = Object.keys(datasetOutputs).find((id) => { const { assets } = datasetOutputs[id] @@ -126,7 +126,7 @@ const AssetSearchResult = () => { const hovermessage = 'Verified successfully' - return filtered.length === 0 && !TLIDataSet && !datasets ? ( + return Datasets.length === 0 && !datasets ? ( No data @@ -150,7 +150,7 @@ const AssetSearchResult = () => { {isValidUrl(searchValue) === true ? ( {' '} - {(filtered.length > 0 || TLIDataSet) && ( + {/* {(filtered.length > 0 || TLIDataSet) && ( @@ -406,7 +406,7 @@ const AssetSearchResult = () => {
- )} + )} */}
) : ( diff --git a/src/views/SingleAsset.tsx b/src/views/SingleAsset.tsx index dec4757..a68e95e 100644 --- a/src/views/SingleAsset.tsx +++ b/src/views/SingleAsset.tsx @@ -28,28 +28,17 @@ import TabsSingleAsset from '../components/TabsSingleAsset' import { formatTimeLeft } from '../utils/timestapFormater' const SingleAsset = () => { - const { assetContract, assetTokenId, assetSerial, id } = useParams() + const { assetContract, assetBatchId, assetTokenId, id } = useParams() const { selectedDataSet, isLoading } = useDataSetAssetsContext() const lastVerified = selectedDataSet?.lastVerified as number const metaData = selectedDataSet?.metadata const assets = selectedDataSet?.assets || [] - const asset = assetSerial - ? assets.find((asset) => asset.assetNumber === assetSerial) - : assets.find( - (asset) => - asset.locations[0]?.contract?.toLocaleLowerCase() === assetContract?.toLocaleLowerCase() && - asset.locations[0]?.tokenId === assetTokenId, - ) - const location = asset?.locations[0] + const assetTokenIdNumber = assetTokenId !== undefined ? parseInt(assetTokenId, 10) : null + const asset = assets.find((asset) => asset.tokenId === assetTokenIdNumber) - const tokenId = location?.tokenId - const lenthToken = tokenId?.length as number - - const tokenRef = lenthToken > 12 ? `${tokenId?.slice(0, 6)}...${tokenId?.slice(-4)}` : tokenId - - const datasetName = metaData?.name || 'Lohko Gold' + const datasetName = metaData?.name const navigate = useNavigate() @@ -92,7 +81,7 @@ const SingleAsset = () => { - . + . { mb={1.5} sx={{ fontSize: '32px', fontWeight: 600, lineHeight: 1.19 }} > - {datasetName} + {asset.metadata.name} @@ -135,7 +124,7 @@ const SingleAsset = () => { Blockhain - {asset.currentLocation} + {asset.metadata.chain} @@ -145,16 +134,12 @@ const SingleAsset = () => { Token Id. - {tokenRef} + {asset.tokenId} Current owner - - {location?.ownerAccount - ? `${location?.ownerAccount.slice(0, 6)}...${location?.ownerAccount.slice(-4)}` - : '-'} - + {asset.owner ? `${asset.owner}` : '-'}