Include the whitelist contract address in the collection creation info box (#6)

* Add whitelist contract address to the collection creation result box

* Account for the no whitelist option

components/collections/creation/UploadDetails.tsx

@@ -41,7 +41,7 @@ export const UploadDetails = ({ onChange }: UploadDetailsProps) => {
   const nftStorageApiKeyState = useInputState({
     id: 'nft-storage-api-key',
     name: 'nftStorageApiKey',
-    title: 'NFT Storage API Key',
+    title: 'NFT.Storage API Key',
     placeholder: 'Enter NFT.Storage API Key',
     defaultValue: '',
   })
@@ -243,7 +243,7 @@ export const UploadDetails = ({ onChange }: UploadDetailsProps) => {
               Though Stargaze's sg721 contract allows for off-chain metadata storage, it is recommended to use a
               decentralized storage solution, such as IPFS. <br /> You may head over to{' '}
               <Anchor className="font-bold text-plumbus hover:underline" href="https://nft.storage">
-                NFT Storage
+                NFT.Storage
               </Anchor>{' '}
               or{' '}
               <Anchor className="font-bold text-plumbus hover:underline" href="https://www.pinata.cloud/">

pages/collections/create.tsx

@@ -53,6 +53,7 @@ const CollectionCreationPage: NextPage = () => {
   const [readyToCreate, setReadyToCreate] = useState(false)
   const [minterContractAddress, setMinterContractAddress] = useState<string | null>(null)
   const [sg721ContractAddress, setSg721ContractAddress] = useState<string | null>(null)
+  const [whitelistContractAddress, setWhitelistContractAddress] = useState<string | null | undefined>(null)
   const [baseTokenUri, setBaseTokenUri] = useState<string | null>(null)
   const [coverImageUrl, setCoverImageUrl] = useState<string | null>(null)
   const [transactionHash, setTransactionHash] = useState<string | null>(null)
@@ -80,6 +81,7 @@ const CollectionCreationPage: NextPage = () => {
       setCoverImageUrl(null)
       setMinterContractAddress(null)
       setSg721ContractAddress(null)
+      setWhitelistContractAddress(null)
       setTransactionHash(null)
       if (uploadDetails?.uploadMethod === 'new') {
         setUploading(true)
@@ -103,6 +105,7 @@ const CollectionCreationPage: NextPage = () => {
         let whitelist: string | undefined
         if (whitelistDetails?.whitelistType === 'existing') whitelist = whitelistDetails.contractAddress
         else if (whitelistDetails?.whitelistType === 'new') whitelist = await instantiateWhitelist()
+        setWhitelistContractAddress(whitelist as string)
 
         await instantiate(baseUri, coverImageUri, whitelist)
       } else {
@@ -112,6 +115,7 @@ const CollectionCreationPage: NextPage = () => {
         let whitelist: string | undefined
         if (whitelistDetails?.whitelistType === 'existing') whitelist = whitelistDetails.contractAddress
         else if (whitelistDetails?.whitelistType === 'new') whitelist = await instantiateWhitelist()
+        setWhitelistContractAddress(whitelist as string)
 
         await instantiate(baseTokenUri as string, coverImageUrl as string, whitelist)
       }
@@ -269,7 +273,7 @@ const CollectionCreationPage: NextPage = () => {
     if (uploadDetails.uploadMethod === 'new') {
       if (uploadDetails.uploadService === 'nft-storage') {
         if (uploadDetails.nftStorageApiKey === '') {
-          throw new Error('Please enter a valid NFT Storage API key')
+          throw new Error('Please enter a valid NFT.Storage API key')
         }
       } else if (uploadDetails.pinataApiKey === '' || uploadDetails.pinataSecretKey === '') {
         throw new Error('Please enter Pinata API and secret keys')
@@ -413,6 +417,17 @@ const CollectionCreationPage: NextPage = () => {
                 {sg721ContractAddress}
               </Anchor>
               <br />
+              <Conditional test={whitelistContractAddress !== null && whitelistContractAddress !== undefined}>
+                Whitelist Contract Address:{'  '}
+                <Anchor
+                  className="text-stargaze hover:underline"
+                  external
+                  href={`/contracts/whitelist/query/?contractAddress=${whitelistContractAddress as string}`}
+                >
+                  {whitelistContractAddress}
+                </Anchor>
+                <br />
+              </Conditional>
               Transaction Hash: {'  '}
               <Anchor
                 className="text-stargaze hover:underline"

pages/contracts/whitelist/query.tsx

@@ -40,7 +40,7 @@ const WhitelistQueryPage: NextPage = () => {
   })
   const address = addressState.value
 
-  const [type, setType] = useState<QueryType>('has_started')
+  const [type, setType] = useState<QueryType>('config')
 
   const addressVisible = type === 'has_member'
 
@@ -98,6 +98,7 @@ const WhitelistQueryPage: NextPage = () => {
                 'placeholder:text-white/50',
                 'focus:ring focus:ring-plumbus-20',
               )}
+              defaultValue="config"
               id="contract-query-type"
               name="query-type"
               onChange={(e) => setType(e.target.value as QueryType)}

services/upload/nft-storage.ts

@@ -2,7 +2,7 @@ import type { CIDString } from 'nft.storage'
 import { NFTStorage } from 'nft.storage'
 
 export const uploadToNftStorage = async (fileArray: File[], nftStorageApiKey: string): Promise<CIDString> => {
-  console.log('Uploading to NFT Storage...')
+  console.log('Uploading to NFT.Storage...')
   const client = new NFTStorage({ token: nftStorageApiKey })
   return client.storeDirectory(fileArray)
 }