{imageUrl.name}
\r\n{imageUrl.description}
\r\n\r\n {\" \"}\r\n 🦊{\" \"}\r\n \r\n You must install Metamask, a virtual Ethereum wallet, in your\r\n browser.\r\n \r\n
\r\n \r\n ),\r\n };\r\n }\r\n};\r\n\r\nexport async function getNFTMediaUrl(tokenId) {\r\n const result = await web3.alchemy.getNftMetadata({tokenId: tokenId,contractAddress: contractAddress});\r\n //return result.media[0].raw;\r\n return result.metadata;\r\n}\r\n\r\nexport async function getVisitorNFTs(address) {\r\n return web3.alchemy.getNfts({owner: address,contractAddresses: [contractAddress]});\r\n /*\r\n var config = {\r\n method: 'get',\r\n url: `${getNFTsBaseURL}?owner=${address}&contractAddresses[]=${contractAddress}`\r\n };\r\n \r\n axios(config)\r\n .then(response => console.log(JSON.stringify(response.data, null, 2)))\r\n .catch(error => console.log(error));\r\n */\r\n}\r\n\r\nexport const getCurrentWalletConnected = async () => {\r\n if (window.ethereum) {\r\n try {\r\n const addressArray = await window.ethereum.request({\r\n method: \"eth_accounts\",\r\n });\r\n if (addressArray.length > 0) {\r\n return {\r\n address: addressArray[0],\r\n status: \"👆🏽 Wallet connected!.\",\r\n };\r\n } else {\r\n return {\r\n address: \"\",\r\n status: \"🦊 Connect to Metamask using the top right button.\",\r\n };\r\n }\r\n } catch (err) {\r\n return {\r\n address: \"\",\r\n status: \"😥 \" + err.message,\r\n };\r\n }\r\n } else {\r\n return {\r\n address: \"\",\r\n status: (\r\n \r\n\r\n {\" \"}\r\n 🦊{\" \"}\r\n \r\n You must install Metamask, a virtual Ethereum wallet, in your\r\n browser.\r\n \r\n
\r\n \r\n ),\r\n };\r\n }\r\n};\r\n\r\nasync function loadContract() {\r\n return new web3.eth.Contract(contractABI, contractAddress);\r\n}\r\n\r\nexport const mintNFT = async () => {\r\n \r\n window.contract = await new web3.eth.Contract(contractABI, contractAddress);\r\n\r\n const transactionParameters = {\r\n to: contractAddress, // Required except during contract publications.\r\n from: window.ethereum.selectedAddress, // must match user's active address.\r\n value: mintingPrice,\r\n data: window.contract.methods\r\n .mint()\r\n .encodeABI(),\r\n };\r\n\r\n try {\r\n const txHash = await window.ethereum.request({\r\n method: \"eth_sendTransaction\",\r\n params: [transactionParameters],\r\n });\r\n return {\r\n success: true,\r\n txHash: txHash,\r\n status:\r\n \"✅ Transaction submited, waiting for confirmation.\",\r\n };\r\n } catch (error) {\r\n return {\r\n success: false,\r\n status: \"😥 Something went wrong: \" + error.message,\r\n };\r\n }\r\n};\r\n\r\nconst DEFAULT_INTERVAL = 1000;\r\nconst DEFAULT_BLOCKS_TO_WAIT = 0;\r\n\r\nexport function awaitTx(txnHash, blocksToWait) {\r\n const interval = DEFAULT_INTERVAL;\r\n blocksToWait = blocksToWait ? blocksToWait : DEFAULT_BLOCKS_TO_WAIT;\r\n var transactionReceiptAsync = async function(txnHash, resolve, reject) {\r\n try {\r\n var receipt = web3.eth.getTransactionReceipt(txnHash);\r\n if (!receipt) {\r\n setTimeout(function () {\r\n transactionReceiptAsync(txnHash, resolve, reject);\r\n }, interval);\r\n } else {\r\n if (blocksToWait > 0) {\r\n var resolvedReceipt = await receipt;\r\n if (!resolvedReceipt || !resolvedReceipt.blockNumber) setTimeout(function () { transactionReceiptAsync(txnHash, resolve, reject);\r\n }, interval);\r\n else {\r\n try {\r\n var block = await web3.eth.getBlock(resolvedReceipt.blockNumber)\r\n var current = await web3.eth.getBlock('latest');\r\n if (current.number - block.number >= blocksToWait) {\r\n var txn = await web3.eth.getTransaction(txnHash)\r\n if (txn.blockNumber != null) resolve(resolvedReceipt);\r\n else reject(new Error('Transaction with hash: ' + txnHash + ' ended up in an uncle block.'));\r\n }\r\n else setTimeout(function () {\r\n transactionReceiptAsync(txnHash, resolve, reject);\r\n }, interval);\r\n }\r\n catch (e) {\r\n setTimeout(function () {\r\n transactionReceiptAsync(txnHash, resolve, reject);\r\n }, interval);\r\n }\r\n }\r\n }\r\n else resolve(receipt);\r\n }\r\n } catch(e) {\r\n reject(e);\r\n }\r\n };\r\n\r\n if (Array.isArray(txnHash)) {\r\n var promises = [];\r\n txnHash.forEach(function (oneTxHash) {\r\n promises.push(awaitTx(oneTxHash, blocksToWait));\r\n });\r\n return Promise.all(promises);\r\n } else {\r\n return new Promise(function (resolve, reject) {\r\n transactionReceiptAsync(txnHash, resolve, reject);\r\n });\r\n }\r\n};\r\n","const ImageList = (props) => {\r\n\r\n function renderImage(imageUrl) {\r\n return (\r\n{imageUrl.description}
\r\nNo owned NFTs.
)\r\n }\r\n}\r\n\r\nexport default ImageList;","import React from \"react\";\r\nimport { usePromiseTracker } from \"react-promise-tracker\";\r\nimport {ThreeDots} from \"react-loader-spinner\";\r\nimport \"./spinner.css\";\r\n\r\nexport const Spinner = (props) => {\r\n const { promiseInProgress } = usePromiseTracker();\r\n\r\n return (\r\n promiseInProgress && (\r\nYou have minted {image_urls.length} NFTs.
)\r\n }else{\r\n setMinted(You have not minted any NFTs yet.
)\r\n }\r\n set_nfts_urls(image_urls);\r\n }\r\n\r\n function addWalletListener() {\r\n if (window.ethereum) {\r\n window.ethereum.on(\"accountsChanged\", (accounts) => {\r\n if (accounts.length > 0) {\r\n setWallet(accounts[0]);\r\n setStatus(\"👆🏽 Wallet is connected.\");\r\n Promise.resolve(trackPromise(listNFTsOwned(accounts[0])));\r\n } else {\r\n setWallet(\"\");\r\n setStatus(\"🦊 Connect to Metamask using the top right button.\");\r\n }\r\n });\r\n } else {\r\n setStatus(\r\n\r\n {\" \"}\r\n 🦊{\" \"}\r\n \r\n You must install Metamask, a virtual Ethereum wallet, in your\r\n browser.\r\n \r\n
\r\n );\r\n }\r\n }\r\n\r\n const connectWalletPressed = async () => {\r\n const walletResponse = await connectWallet();\r\n setStatus(walletResponse.status);\r\n setWallet(walletResponse.address);\r\n \r\n };\r\n\r\n const refreshNFTs = async (txHash) => {\r\n const response = await awaitTx(txHash,1);\r\n setStatus(\"Transaction has been confirmed. Loading NFTs\");\r\n await listNFTsOwned(walletAddress);\r\n }\r\n\r\n const onMintPressed = async () => {\r\n const { success, txHash, status } = await mintNFT();\r\n setStatus(status);\r\n if (success) {\r\n await trackPromise(refreshNFTs(txHash));\r\n }\r\n };\r\n\r\n return (\r\n\r\n Press the \"Mint NFT\" button to mint a random NFT from our Narcicity Outcast collection.\r\n
\r\nThe mint cost is 50 MATIC. Please make sure your Metamask wallet is switched to the Polygon network and have enough funds to cover the mint price and the transaction fees.
\r\n \r\n \r\n\r\n {status}\r\n
\r\n\r\n {minted}\r\n
\r\n \r\n