LaconicNetwork/stargaze-studio
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Enable multiple asset selection & preview for 1/1 Minting

Browse Source
This commit is contained in:
Serkan Reis 2023-01-16 13:24:23 +03:00
parent 74ee927fac
commit e5cb8faf51
1 changed files with 23 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
components/collections/creation/UploadDetails.tsx
View File

@ -1,4 +1,5 @@
/* eslint-disable eslint-comments/disable-enable-pair */ /* eslint-disable eslint-comments/disable-enable-pair */
/* eslint-disable no-nested-ternary */
/* eslint-disable no-misleading-character-class */ /* eslint-disable no-misleading-character-class */
/* eslint-disable no-control-regex */ /* eslint-disable no-control-regex */
/* eslint-disable @typescript-eslint/no-loop-func */ /* eslint-disable @typescript-eslint/no-loop-func */
@ -445,7 +446,7 @@ export const UploadDetails = ({ onChange, minterType, baseMinterAcquisitionMetho
'before:absolute before:inset-0 before:hover:bg-white/5 before:transition', 'before:absolute before:inset-0 before:hover:bg-white/5 before:transition',
)} )}
id="assetFiles" id="assetFiles"
multiple={minterType === 'vending'} multiple
onChange={selectAssets} onChange={selectAssets}
ref={assetFilesRef} ref={assetFilesRef}
type="file" type="file"
@ -459,7 +460,11 @@ export const UploadDetails = ({ onChange, minterType, baseMinterAcquisitionMetho
className="block mt-5 mr-1 mb-1 ml-8 w-full font-bold text-white dark:text-gray-300" className="block mt-5 mr-1 mb-1 ml-8 w-full font-bold text-white dark:text-gray-300"
htmlFor="metadataFiles" htmlFor="metadataFiles"
> >
{minterType === 'vending' ? 'Metadata Selection' : 'Metadata Selection (optional)'} {minterType === 'vending'
? 'Metadata Selection'
: assetFilesArray.length === 1
? 'Metadata Selection (optional)'
: 'Metadata Selection'}
</label> </label>
<div <div
className={clsx( className={clsx(
@ -474,7 +479,7 @@ export const UploadDetails = ({ onChange, minterType, baseMinterAcquisitionMetho
'before:absolute before:inset-0 before:hover:bg-white/5 before:transition', 'before:absolute before:inset-0 before:hover:bg-white/5 before:transition',
)} )}
id="metadataFiles" id="metadataFiles"
multiple={minterType === 'vending'} multiple
onChange={selectMetadata} onChange={selectMetadata}
ref={metadataFilesRef} ref={metadataFilesRef}
type="file" type="file"
@ -482,7 +487,7 @@ export const UploadDetails = ({ onChange, minterType, baseMinterAcquisitionMetho
</div> </div>
</div> </div>
)} )}
<Conditional test={minterType === 'vending'}> <Conditional test={assetFilesArray.length > 1}>
<MetadataModal <MetadataModal
assetFile={assetFilesArray[metadataFileArrayIndex]} assetFile={assetFilesArray[metadataFileArrayIndex]}
metadataFile={metadataFilesArray[metadataFileArrayIndex]} metadataFile={metadataFilesArray[metadataFileArrayIndex]}
@ -496,14 +501,22 @@ export const UploadDetails = ({ onChange, minterType, baseMinterAcquisitionMetho
<AssetsPreview assetFilesArray={assetFilesArray} updateMetadataFileIndex={updateMetadataFileIndex} /> <AssetsPreview assetFilesArray={assetFilesArray} updateMetadataFileIndex={updateMetadataFileIndex} />
</Conditional> </Conditional>
<Conditional test={assetFilesArray.length > 0 && minterType === 'base'}> <Conditional test={assetFilesArray.length > 0 && minterType === 'base'}>
<SingleAssetPreview <Conditional test={assetFilesArray.length === 1}>
relatedAsset={assetFilesArray[0]} <SingleAssetPreview
subtitle={`Asset filename: ${assetFilesArray[0]?.name}`} relatedAsset={assetFilesArray[0]}
updateMetadataFileIndex={updateMetadataFileIndex} subtitle={`Asset filename: ${assetFilesArray[0]?.name}`}
/> updateMetadataFileIndex={updateMetadataFileIndex}
/>
</Conditional>
<Conditional test={assetFilesArray.length > 1}>
<AssetsPreview
assetFilesArray={assetFilesArray}
updateMetadataFileIndex={updateMetadataFileIndex}
/>
</Conditional>
</Conditional> </Conditional>
</div> </div>
<Conditional test={minterType === 'base' && assetFilesArray.length > 0}> <Conditional test={minterType === 'base' && assetFilesArray.length === 1}>
<MetadataInput <MetadataInput
selectedAssetFile={assetFilesArray[0]} selectedAssetFile={assetFilesArray[0]}
selectedMetadataFile={metadataFilesArray[0]} selectedMetadataFile={metadataFilesArray[0]}