diff --git a/packages/react-components/src/NftDetails/index.tsx b/packages/react-components/src/NftDetails/index.tsx index 260226e..29734fb 100644 --- a/packages/react-components/src/NftDetails/index.tsx +++ b/packages/react-components/src/NftDetails/index.tsx @@ -39,6 +39,10 @@ function NftDetails ({ account }: NftDetailsProps): React.ReactElement { + return tokenUrl.replace('image.jpg', 'video.mp4'); + }, [tokenUrl]); + return (
{attrKey}: {(attributes[attrKey] as string[]).join(', ')}

); })} + {attributes && attributes.profile === 'Black profiles' && +

+ Video Url: + + {getVideoUrl()} + +

+ }
)} diff --git a/packages/react-components/src/NftDetails/styles.scss b/packages/react-components/src/NftDetails/styles.scss index 9c3b15d..9fb527b 100644 --- a/packages/react-components/src/NftDetails/styles.scss +++ b/packages/react-components/src/NftDetails/styles.scss @@ -37,6 +37,15 @@ background-color: var(--card-background); box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08); border-radius: 4px; + + a{ + color: var(--link-color); + display: block; + cursor: pointer; + margin: 8px 0 ; + font-size: 18px; + font-family: var(--font-roboto); + } } &--attributes { diff --git a/packages/react-components/src/util/protobufUtils.ts b/packages/react-components/src/util/protobufUtils.ts index 77ae7ce..bb0d46d 100644 --- a/packages/react-components/src/util/protobufUtils.ts +++ b/packages/react-components/src/util/protobufUtils.ts @@ -97,14 +97,7 @@ export function convertEnumToString (value: string, key: string, NFTMeta: Type, export function deserializeNft (onChainSchema: ProtobufAttributeType, buffer: Uint8Array, locale: string): { [key: string]: any } { try { const root = defineMessage(onChainSchema); - let NFTMeta: Type; - - // Obtain the message type - if (root?.nested?.onChainMetaData) { - NFTMeta = root.lookupType('onChainMetaData.NFTMeta'); - } else if (root?.nested?.onchainmetadata) { - NFTMeta = root.lookupType('onchainmetadata.NFTMeta'); - } + const NFTMeta = root.lookupType('onChainMetaData.NFTMeta'); // Decode a Uint8Array (browser) or Buffer (node) to a message const message = NFTMeta.decode(buffer); @@ -120,16 +113,22 @@ export function deserializeNft (onChainSchema: ProtobufAttributeType, buffer: Ui }); const newObjectItem = { ...objectItem }; - for (const key in objectItem) { + for (const key in newObjectItem) { if (NFTMeta?.fields[key]?.resolvedType?.options && Object.keys(NFTMeta?.fields[key]?.resolvedType?.options as {[key: string]: string}).length > 0) { if (Array.isArray(objectItem[key])) { const item = objectItem[key] as string[]; - item.forEach((value: string, index) => { - (newObjectItem[key] as string[])[index] = convertEnumToString(value, key, NFTMeta, locale); - }); + if (item.length !== 0) { + item.forEach((value: string, index) => { + (newObjectItem[key] as string[])[index] = convertEnumToString(value, key, NFTMeta, locale); + }); + } else delete newObjectItem[key]; } else { - newObjectItem[key] = convertEnumToString(objectItem[key], key, NFTMeta, locale); + const currentItem: string[] = (newObjectItem[key] as string).split('_'); + + if (currentItem[currentItem.length - 1] !== '0') { + newObjectItem[key] = convertEnumToString(newObjectItem[key], key, NFTMeta, locale); + } else delete newObjectItem[key]; } } }