import { NFTCard } from "./nftCard" import { useState } from 'react' import Head from 'next/head' import Image from 'next/image' const Home = () => { const [wallet, setWalletAddress] = useState(""); const [collection, setCollectionAddress] = useState(""); const [NFTs, setNFTs] = useState([]) const [fetchForCollection, setFetchForCollection]=useState(false) const fetchNFTs = async() => { let nfts; console.log("fetching nfts"); const api_key = "1111" const baseURL = `https://eth-mainnet.alchemyapi.io/v2/${api_key}/getNFTs/`; var requestOptions = { method: 'GET' }; if (!collection.length) { const fetchURL = `${baseURL}?owner=${wallet}`; nfts = await fetch(fetchURL, requestOptions).then(data => data.json()) } else { console.log("fetching nfts for collection owned by address") const fetchURL = `${baseURL}?owner=${wallet}&contractAddresses%5B%5D=${collection}`; nfts= await fetch(fetchURL, requestOptions).then(data => data.json()) } if (nfts) { console.log("nfts:", nfts) setNFTs(nfts.ownedNfts) } } const fetchNFTsForCollection = async () => { if (collection.length) { var requestOptions = { method: 'GET' }; const api_key = "1111" const baseURL = `https://eth-mainnet.alchemyapi.io/v2/${api_key}/getNFTsForCollection/`; const fetchURL = `${baseURL}?contractAddress=${collection}&withMetadata=${"true"}`; const nfts = await fetch(fetchURL, requestOptions).then(data => data.json()) if (nfts) { console.log("NFTs in collection:", nfts) setNFTs(nfts.nfts) } } } return (

{setWalletAddress(e.target.value)}} value={wallet} type={"text"} placeholder="Add your wallet address"> {setCollectionAddress(e.target.value)}} value={collection} placeholder="Add the collection address"> {setFetchForCollection(e.target.checked)}} type={"checkbox"} className="mr-2">Fetch for collection

{ NFTs.length && NFTs.map(nft => { return ( ) }) }

) } export default Home