Add tooltips for (Base) Token URI fields

This commit is contained in:
Serkan Reis 2023-07-04 08:38:59 +03:00
parent 23ef3ab3ea
commit 82f19267f3
2 changed files with 26 additions and 3 deletions

View File

@ -13,6 +13,7 @@ import { useInputState } from 'components/forms/FormInput.hooks'
import { MetadataInput } from 'components/MetadataInput'
import { MetadataModal } from 'components/MetadataModal'
import { SingleAssetPreview } from 'components/SingleAssetPreview'
import { Tooltip } from 'components/Tooltip'
import { addLogItem } from 'contexts/log'
import type { ChangeEvent } from 'react'
import { useEffect, useRef, useState } from 'react'
@ -336,7 +337,14 @@ export const UploadDetails = ({ onChange, minterType, baseMinterAcquisitionMetho
and upload your assets & metadata manually to get a base URI for your collection.
</p>
<div>
<Tooltip
backgroundColor="bg-blue-500"
className="mb-2 ml-20"
label="The base token URI that points to the IPFS folder containing the metadata files."
placement="top"
>
<TextInput {...baseTokenUriState} className="ml-4 w-1/2" />
</Tooltip>
</div>
<Conditional test={minterType !== 'base'}>
<div>
@ -360,7 +368,14 @@ export const UploadDetails = ({ onChange, minterType, baseMinterAcquisitionMetho
and upload your asset & metadata manually to get a URI for your token before minting.
</p>
<div>
<Tooltip
backgroundColor="bg-blue-500"
className="mb-2 ml-4"
label="The token URI that points directly to the metadata file stored on IPFS."
placement="top"
>
<TextInput {...baseTokenUriState} className="ml-4 w-1/2" />
</Tooltip>
</div>
<Conditional
test={minterType !== 'base' || (minterType === 'base' && baseMinterAcquisitionMethod === 'new')}

View File

@ -12,6 +12,7 @@ import { useInputState } from 'components/forms/FormInput.hooks'
import { MetadataInput } from 'components/MetadataInput'
import { MetadataModal } from 'components/MetadataModal'
import { SingleAssetPreview } from 'components/SingleAssetPreview'
import { Tooltip } from 'components/Tooltip'
import { addLogItem } from 'contexts/log'
import type { ChangeEvent } from 'react'
import { useEffect, useRef, useState } from 'react'
@ -291,7 +292,14 @@ export const OffChainMetadataUploadDetails = ({
and upload your asset & metadata manually to get a URI for your token before minting.
</p>
<div>
<Tooltip
backgroundColor="bg-blue-500"
className="mb-2 ml-28"
label="The token URI that points directly to the metadata file stored on IPFS."
placement="top"
>
<TextInput {...tokenUriState} className="ml-4 w-1/2" />
</Tooltip>
<TextInput {...coverImageUrlState} className="mt-2 ml-4 w-1/2" />
</div>
</div>