Update collection creation logic for OE/on-chain metadata

This commit is contained in:
Serkan Reis 2023-09-10 12:46:52 +03:00
parent 26c39e8985
commit 75a2d4c089
2 changed files with 28 additions and 5 deletions

View File

@ -134,6 +134,7 @@ export const UploadDetails = ({
for (let i = 0; i < sortedFileNames.length; i++) {
if (isNaN(Number(sortedFileNames[i])) || parseInt(sortedFileNames[i]) !== i + 1) {
toast.error('The file names should be in numerical order starting from 1.')
setThumbnailCompatibleAssetFileNames([])
addLogItem({
id: uid(),
message: 'The file names should be in numerical order starting from 1.',

View File

@ -28,6 +28,7 @@ import {
SG721_OPEN_EDITION_CODE_ID,
SG721_OPEN_EDITION_UPDATABLE_CODE_ID,
} from 'utils/constants'
import type { AssetType } from 'utils/getAssetType'
import { getAssetType } from 'utils/getAssetType'
import { isValidAddress } from 'utils/isValidAddress'
import { checkTokenUri } from 'utils/isValidTokenUri'
@ -116,6 +117,9 @@ export const OpenEditionMinterCreator = ({
const [openEditionMinterContractAddress, setOpenEditionMinterContractAddress] = useState<string | null>(null)
const [sg721ContractAddress, setSg721ContractAddress] = useState<string | null>(null)
const [transactionHash, setTransactionHash] = useState<string | null>(null)
const [thumbnailImageUri, setThumbnailImageUri] = useState<string | undefined>(undefined)
const thumbnailCompatibleAssetTypes: AssetType[] = ['video', 'audio', 'html']
const factoryAddressForSelectedDenom =
openEditionMinterList.find((minter) => minter.supportedToken === mintTokenFromFactory && minter.updatable === false)
@ -436,8 +440,23 @@ export const OpenEditionMinterCreator = ({
const coverImageUriWithBase = `ipfs://${coverImageUri}/${(collectionDetails?.imageFile as File[])[0].name}`
setCoverImageUrl(coverImageUriWithBase)
let thumbnailUri: string | undefined
if (imageUploadDetails.isThumbnailCompatible && imageUploadDetails.thumbnailFile)
thumbnailUri = await upload(
[imageUploadDetails.thumbnailFile] as File[],
imageUploadDetails.uploadService,
'thumbnail',
imageUploadDetails.nftStorageApiKey as string,
imageUploadDetails.pinataApiKey as string,
imageUploadDetails.pinataSecretKey as string,
)
const thumbnailUriWithBase = thumbnailUri
? `ipfs://${thumbnailUri}/${(imageUploadDetails.thumbnailFile as File).name}`
: undefined
setThumbnailImageUri(thumbnailUriWithBase)
setUploading(false)
await instantiateOpenEditionMinter(imageUriWithBase, coverImageUriWithBase)
await instantiateOpenEditionMinter(imageUriWithBase, coverImageUriWithBase, thumbnailUriWithBase)
} else if (imageUploadDetails?.uploadMethod === 'existing') {
setTokenImageUri(imageUploadDetails.imageUrl as string)
setCoverImageUrl(imageUploadDetails.coverImageUrl as string)
@ -527,7 +546,7 @@ export const OpenEditionMinterCreator = ({
})
}
const instantiateOpenEditionMinter = async (uri: string, coverImageUri: string) => {
const instantiateOpenEditionMinter = async (uri: string, coverImageUri: string, thumbnailUri?: string) => {
if (!wallet.initialized) throw new Error('Wallet not connected')
if (!openEditionFactoryContract) throw new Error('Contract not found')
if (!openEditionMinterContract) throw new Error('Contract not found')
@ -549,7 +568,10 @@ export const OpenEditionMinterCreator = ({
extension:
metadataStorageMethod === 'on-chain'
? {
image: uri,
image:
imageUploadDetails?.isThumbnailCompatible && imageUploadDetails.thumbnailFile
? thumbnailUri
: uri,
name: onChainMetadataInputDetails?.name,
description: onChainMetadataInputDetails?.description?.replaceAll('\\n', '\n'),
attributes: onChainMetadataInputDetails?.attributes,
@ -557,7 +579,7 @@ export const OpenEditionMinterCreator = ({
animation_url:
imageUploadDetails?.uploadMethod === 'existing'
? onChainMetadataInputDetails?.animation_url
: getAssetType(imageUploadDetails?.assetFile?.name as string) === 'video'
: imageUploadDetails?.isThumbnailCompatible
? uri
: undefined,
youtube_url: onChainMetadataInputDetails?.youtube_url,
@ -677,7 +699,7 @@ export const OpenEditionMinterCreator = ({
return (
<div>
{/* TODO: Cancel once we're able to index on-chain metadata */}
<Conditional test={false}>
<Conditional test>
<div className="mx-10 mb-4 rounded border-2 border-white/20">
<div className="flex justify-center mb-2">
<div className="mt-3 ml-4 font-bold form-check form-check-inline">