/* eslint-disable eslint-comments/disable-enable-pair */ /* eslint-disable @typescript-eslint/restrict-template-expressions */ /* eslint-disable no-nested-ternary */ /* eslint-disable no-await-in-loop */ /* eslint-disable @typescript-eslint/no-unsafe-return */ /* eslint-disable @typescript-eslint/no-unsafe-call */ /* eslint-disable @typescript-eslint/no-unsafe-member-access */ /* eslint-disable @typescript-eslint/no-unsafe-assignment */ import { toUtf8 } from '@cosmjs/encoding' import clsx from 'clsx' import { Button } from 'components/Button' import type { WhitelistType } from 'components/collections/creation/WhitelistDetails' import { Conditional } from 'components/Conditional' import { ContractPageHeader } from 'components/ContractPageHeader' import { FormControl } from 'components/FormControl' import { AddressInput, NumberInput, TextInput } from 'components/forms/FormInput' import { useInputState, useNumberInputState } from 'components/forms/FormInput.hooks' import { JsonPreview } from 'components/JsonPreview' import { LinkTabs } from 'components/LinkTabs' import { whitelistLinkTabs } from 'components/LinkTabs.data' import { useContracts } from 'contexts/contracts' import type { QueryType } from 'contracts/whitelist/messages/query' import { dispatchQuery, QUERY_LIST } from 'contracts/whitelist/messages/query' import type { WhitelistMerkleTreeQueryType } from 'contracts/whitelistMerkleTree/messages/query' import { dispatchQuery as disptachWhitelistMerkleTreeQuery, WHITELIST_MERKLE_TREE_QUERY_LIST, } from 'contracts/whitelistMerkleTree/messages/query' import type { NextPage } from 'next' import { useRouter } from 'next/router' import { NextSeo } from 'next-seo' import { useEffect, useState } from 'react' import { toast } from 'react-hot-toast' import { useQuery } from 'react-query' import { WHITELIST_MERKLE_TREE_API_URL } from 'utils/constants' import { useDebounce } from 'utils/debounce' import { withMetadata } from 'utils/layout' import { links } from 'utils/links' import { resolveAddress } from 'utils/resolveAddress' import { useWallet } from 'utils/wallet' const WhitelistQueryPage: NextPage = () => { const { whitelist: contract } = useContracts() const { whitelistMerkleTree: contractWhitelistMerkleTree } = useContracts() const wallet = useWallet() const [exporting, setExporting] = useState(false) const [whitelistType, setWhitelistType] = useState('standard') const [proofHashes, setProofHashes] = useState([]) const contractState = useInputState({ id: 'contract-address', name: 'contract-address', title: 'Whitelist Address', subtitle: 'Address of the Whitelist contract', }) const contractAddress = contractState.value const debouncedWhitelistContractState = useDebounce(contractAddress, 300) useEffect(() => { async function getWhitelistContractType() { if (debouncedWhitelistContractState.length > 0) { const client = await wallet.getCosmWasmClient() const data = await toast.promise( client.queryContractRaw( debouncedWhitelistContractState, toUtf8(Buffer.from(Buffer.from('contract_info').toString('hex'), 'hex').toString()), ), { loading: 'Retrieving whitelist type...', error: 'Whitelist type retrieval failed.', success: 'Whitelist type retrieved.', }, ) const whitelistContract: string = JSON.parse(new TextDecoder().decode(data as Uint8Array)).contract console.log(contract) return whitelistContract } } void getWhitelistContractType() .then((whitelistContract) => { if (whitelistContract?.includes('merkletree')) { setWhitelistType('merkletree') } else if (whitelistContract?.includes('flex')) { setWhitelistType('flex') } else { setWhitelistType('standard') } }) .catch((err) => { console.log(err) setWhitelistType('standard') console.log('Unable to retrieve contract type. Defaulting to "standard".') }) // eslint-disable-next-line react-hooks/exhaustive-deps }, [debouncedWhitelistContractState, wallet.isWalletConnected]) const addressState = useInputState({ id: 'address', name: 'address', title: 'Address', subtitle: 'Address of the user - defaults to current address', }) const address = addressState.value const debouncedAddress = useDebounce(address, 300) const fetchProofHashes = async (whitelistContractAddress: string, memberAddress: string): Promise => { if (whitelistContractAddress.length === 0 || memberAddress.length === 0) throw new Error('Contract or member address is empty.') const resolvedAddress = await resolveAddress(memberAddress, wallet) const merkleRootResponse = await ( await wallet.getCosmWasmClient() ).queryContractSmart(contractAddress, { merkle_root: {} }) const proofs = await toast.promise( fetch(`${WHITELIST_MERKLE_TREE_API_URL}/whitelist/${merkleRootResponse.merkle_root}/${resolvedAddress}`) .then((res) => res.json()) .then((data) => data.proofs) .catch((e) => { console.log(e) setProofHashes([]) }), { loading: 'Fetching proof hashes...', error: 'Error fetching proof hashes from Whitelist Merkle Tree API.', success: 'Proof hashes fetched.', }, ) return proofs as string[] | [] } useEffect(() => { if ( whitelistType === 'merkletree' && whitelistMerkleTreeQueryType === 'has_member' && debouncedAddress.length > 0 ) { void fetchProofHashes(contractAddress, debouncedAddress) .then((proofs) => setProofHashes(proofs)) .catch((e) => { console.log(e) setProofHashes([]) }) } }, [debouncedAddress]) const limit = useNumberInputState({ id: 'limit', name: 'limit', title: 'Limit', subtitle: 'Maximum number of addresses to return', defaultValue: 20, }) const debouncedLimit = useDebounce(limit.value, 500) const startAfter = useInputState({ id: 'start-after', name: 'start-after', title: 'Start After', subtitle: 'Address to start after', }) useEffect(() => { if (debouncedLimit > 100) { toast.success('Only 100 addresses can be returned at a time even if the limit is higher.', { style: { maxWidth: 'none' }, icon: '📝', duration: 5000, }) } }, [debouncedLimit]) const [type, setType] = useState('config') const [whitelistMerkleTreeQueryType, setWhitelistMerkleTreeQueryType] = useState('config') const addressVisible = type === 'has_member' || whitelistMerkleTreeQueryType === 'has_member' const { data: response } = useQuery( [ contractAddress, type, whitelistMerkleTreeQueryType, contract, contractWhitelistMerkleTree, wallet.address, address, startAfter.value, limit.value, proofHashes, whitelistType, ] as const, async ({ queryKey }) => { const [ _contractAddress, _type, _whitelistMerkleTreeQueryType, _contract, _contractWhitelistMerkleTree, _wallet, _address, _startAfter, _limit, _proofHashes, _whitelistType, ] = queryKey const messages = contract?.use(contractAddress) const whitelistMerkleTreeMessages = contractWhitelistMerkleTree?.use(contractAddress) const res = await resolveAddress(_address, wallet).then(async (resolvedAddress) => { const result = whitelistType === 'merkletree' ? await disptachWhitelistMerkleTreeQuery({ messages: whitelistMerkleTreeMessages, address: resolvedAddress, type: whitelistMerkleTreeQueryType, limit: _limit, proofHashes: _proofHashes, }) : await dispatchQuery({ messages, type, address: resolvedAddress, startAfter: _startAfter || undefined, limit: _limit, }) return result }) return res }, { placeholderData: null, onError: (error: any) => { toast.error(error.message, { style: { maxWidth: 'none' } }) }, enabled: Boolean(contractAddress && (contract || contractWhitelistMerkleTree)), }, ) const router = useRouter() useEffect(() => { if (contractAddress.length > 0) { void router.replace({ query: { contractAddress } }) } if (contractAddress.length === 0) { void router.replace({ query: {} }) } // eslint-disable-next-line react-hooks/exhaustive-deps }, [contractAddress]) useEffect(() => { const initial = new URL(document.URL).searchParams.get('contractAddress') if (initial && initial.length > 0) contractState.onChange(initial) }, []) const exportAllMembers = async () => { if (wallet.isWalletDisconnected) { toast.error('Please connect your wallet first.', { style: { maxWidth: 'none' } }) setExporting(false) return } try { const messages = contract?.use(contractAddress) setExporting(true) const contractInfoResponse = await (await wallet.getCosmWasmClient()) .queryContractRaw( contractAddress.trim(), toUtf8(Buffer.from(Buffer.from('contract_info').toString('hex'), 'hex').toString()), ) .catch((e) => { if (e.message.includes('bech32')) throw new Error('Invalid whitelist contract address.') console.log(e.message) }) const contractInfo = JSON.parse(new TextDecoder().decode(contractInfoResponse as Uint8Array)) console.log('Contract Info: ', contractInfo.contract) if (contractInfo.contract.includes('flex')) { let membersResponse = (await dispatchQuery({ messages, address, type: 'members', limit: 100 })) as any let membersArray = [...membersResponse.members] let lastMember = membersResponse.members[membersResponse.members.length - 1] while (membersResponse.members.length === 100) { membersResponse = (await dispatchQuery({ messages, address, type: 'members', limit: 100, startAfter: lastMember.address, })) as any lastMember = membersResponse.members[membersResponse.members.length - 1] membersArray = [...membersArray, ...membersResponse.members] } membersArray.unshift({ address: 'address', mint_count: 'mint_count' }) const csv = membersArray.map((row) => Object.values(row).join(',')).join('\n') const csvData = new Blob([csv], { type: 'text/csv;charset=utf-8;' }) const csvURL = window.URL.createObjectURL(csvData) const tempLink = document.createElement('a') tempLink.href = csvURL tempLink.setAttribute('download', 'whitelist_flex_members.csv') tempLink.click() } else if (contractInfo.contract.includes('whitelist') && !contractInfo.contract.includes('flex')) { let membersResponse = (await dispatchQuery({ messages, address, type: 'members', limit: 100 })) as any let membersArray = [...membersResponse.members] let lastMember = membersResponse.members[membersResponse.members.length - 1] while (membersResponse.members.length === 100) { membersResponse = (await dispatchQuery({ messages, address, type: 'members', limit: 100, startAfter: lastMember, })) as any lastMember = membersResponse.members[membersResponse.members.length - 1] membersArray = [...membersArray, ...membersResponse.members] } const txt = membersArray.map((member) => member).join('\n') const txtData = new Blob([txt], { type: 'text/txt;charset=utf-8;' }) const txtURL = window.URL.createObjectURL(txtData) const tempLink = document.createElement('a') tempLink.href = txtURL tempLink.setAttribute('download', 'whitelist_members.txt') tempLink.click() } else { toast.error('Invalid whitelist contract address.', { style: { maxWidth: 'none' } }) } setExporting(false) } catch (e: any) { console.log(e) toast.error(e.message, { style: { maxWidth: 'none' } }) setExporting(false) } } return (
) } export default withMetadata(WhitelistQueryPage, { center: false })