diff --git a/src/@utils/nft.ts b/src/@utils/nft.ts index ef2a93af0..0ea026cb5 100644 --- a/src/@utils/nft.ts +++ b/src/@utils/nft.ts @@ -24,12 +24,20 @@ function encodeSvg(svgString: string): string { } export function generateNftOptions(): NftOptions { - const image = '' + // TODO: generate new SVG image here + // @images/arrow.svg test + const image = `` + const newNft: NftOptions = { - name: 'Ocean Asset v4', - symbol: 'OCEAN-V4', + name: 'Ocean Asset v4 NFT', + symbol: 'OCEAN-V4-NFT', description: `This NFT represents an asset in the Ocean Protocol v4 ecosystem.`, - image: `data:image/svg+xml,${encodeSvg(image)}` // generated SVG embedded as 'data:image/svg+xml;base64' + // TODO: figure out if also image URI needs base64 encoding + // generated SVG embedded as 'data:image/svg+xml' and encoded characters + image: `data:image/svg+xml,${encodeSvg(image)}` + // generated SVG embedded as 'data:image/svg+xml;base64' + // image: `data:image/svg+xml;base64,${window?.btoa(image)}` + // image: `data:image/svg+xml;base64,${Buffer.from(image).toString('base64')}` } return newNft @@ -40,7 +48,9 @@ export function generateNftCreateData(nftOptions: NftOptions): any { name: nftOptions.name, symbol: nftOptions.symbol, templateIndex: 1, - tokenURI: Buffer.from(JSON.stringify(nftOptions)).toString('base64') // data:application/json;base64 + // TODO: figure out if Buffer.from method is working in browser in final build + tokenURI: window?.btoa(JSON.stringify(nftOptions)) + // tokenURI: Buffer.from(JSON.stringify(nftOptions)).toString('base64') // should end up as data:application/json;base64 } return nftCreateData diff --git a/src/components/@shared/FormFields/Nft/index.tsx b/src/components/@shared/FormFields/Nft/index.tsx index 66a527d5b..1d9be995d 100644 --- a/src/components/@shared/FormFields/Nft/index.tsx +++ b/src/components/@shared/FormFields/Nft/index.tsx @@ -18,12 +18,14 @@ export default function Nft(props: InputProps): ReactElement { return (
- +
{field?.value?.name} —{' '} {field?.value?.symbol} +
+ {field?.value?.description}
) diff --git a/src/components/Publish/_constants.tsx b/src/components/Publish/_constants.tsx index 966481d36..bdfc16fe2 100644 --- a/src/components/Publish/_constants.tsx +++ b/src/components/Publish/_constants.tsx @@ -36,7 +36,7 @@ export const initialValues: FormPublishData = { chainId: 1, accountId: '', metadata: { - nft: { name: '', symbol: '', tokenURI: '' }, + nft: { name: '', symbol: '', description: '', image: '' }, type: 'dataset', name: '', author: '',