From ab9167598f3da5e527b216048bdcb8871011ecf4 Mon Sep 17 00:00:00 2001 From: Nacho Iacovino Date: Mon, 26 Sep 2022 21:02:55 +0200 Subject: [PATCH 01/10] Render tokenId for erc1155 --- src/embeds/edition-drop.tsx | 2 +- src/shared/claim-page.tsx | 27 ++++++++++++++++----------- 2 files changed, 17 insertions(+), 12 deletions(-) diff --git a/src/embeds/edition-drop.tsx b/src/embeds/edition-drop.tsx index 6be0c19..6638d2b 100644 --- a/src/embeds/edition-drop.tsx +++ b/src/embeds/edition-drop.tsx @@ -67,7 +67,7 @@ const EditionDropEmbed: React.FC = ({ >
- + ; + tokenId?: string; } export const ClaimPage: React.FC> = ({ contract, - + tokenId, children, }) => { const { data: metadata, isLoading } = useContractMetadata(contract); + const { data: nft } = useNFT(contract, tokenId); + + console.log(nft); + return (
@@ -35,14 +44,10 @@ export const ClaimPage: React.FC> = ({ placeContent="center" overflow="hidden" > - {metadata?.image ? ( - {metadata?.name} + {tokenId && nft?.metadata ? ( + + ) : metadata?.image ? ( + ) : ( )} From c5d09fc1160e8f022a3d2be4129324311a8397d9 Mon Sep 17 00:00:00 2001 From: Nacho Iacovino Date: Mon, 26 Sep 2022 21:26:27 +0200 Subject: [PATCH 02/10] wip --- src/embeds/marketplace.tsx | 33 +++-- src/shared/claim-page.tsx | 2 - src/shared/connect-wallet-button.tsx | 178 --------------------------- 3 files changed, 22 insertions(+), 191 deletions(-) delete mode 100644 src/shared/connect-wallet-button.tsx diff --git a/src/embeds/marketplace.tsx b/src/embeds/marketplace.tsx index 8b8099d..c9a3e99 100644 --- a/src/embeds/marketplace.tsx +++ b/src/embeds/marketplace.tsx @@ -23,6 +23,7 @@ import { } from "@chakra-ui/react"; import { css, Global } from "@emotion/react"; import { + ConnectWallet, ThirdwebProvider, useAddress, useAuctionWinner, @@ -33,6 +34,7 @@ import { useListing, useMakeBid, useWinningBid, + Web3Button, } from "@thirdweb-dev/react"; import { AuctionListing, @@ -48,7 +50,6 @@ import { AiFillExclamationCircle } from "react-icons/ai"; import { IoDiamondOutline } from "react-icons/io5"; import { RiAuctionLine } from "react-icons/ri"; import { Header } from "src/shared/header"; -import { ConnectWalletButton } from "../shared/connect-wallet-button"; import { Footer } from "../shared/footer"; import { DropSvg } from "../shared/svg/drop"; import chakraTheme from "../shared/theme"; @@ -71,6 +72,7 @@ interface BuyPageProps { listing: DirectListing | AuctionListing; primaryColor: string; secondaryColor: string; + colorScheme: ColorMode; } interface AuctionListingProps extends BuyPageProps { @@ -87,6 +89,7 @@ const AuctionListingComponent: React.FC = ({ listing, primaryColor, secondaryColor, + colorScheme, }) => { const toast = useToast(); const address = useAddress(); @@ -249,6 +252,9 @@ const AuctionListingComponent: React.FC = ({ ); }; + const colors = chakraTheme.colors; + const accentColor = colors[primaryColor as keyof typeof colors][500]; + return ( {address && chainId === expectedChainId ? ( @@ -442,11 +448,7 @@ const AuctionListingComponent: React.FC = ({ )} ) : ( - + )} ); @@ -457,7 +459,7 @@ const DirectListingComponent: React.FC = ({ expectedChainId, listing, primaryColor, - secondaryColor, + colorScheme, }) => { const address = useAddress(); const chainId = useChainId(); @@ -525,6 +527,9 @@ const DirectListingComponent: React.FC = ({ const showQuantityInput = canClaim && quantityLimit.gt(1) && quantityLimit.lte(1000); + const colors = chakraTheme.colors; + const accentColor = colors[primaryColor as keyof typeof colors][500]; + return ( {!isSoldOut && ( @@ -582,10 +587,12 @@ const DirectListingComponent: React.FC = ({ ) : ( - null} + accentColor={accentColor} + colorMode={colorScheme} /> )} @@ -598,6 +605,7 @@ const BuyPage: React.FC = ({ listing, primaryColor, secondaryColor, + colorScheme, }) => { if (listing === null) { return ( @@ -662,6 +670,7 @@ const BuyPage: React.FC = ({ listing={listing} primaryColor={primaryColor} secondaryColor={secondaryColor} + colorScheme={colorScheme} /> ) : ( = ({ listing={listing} primaryColor={primaryColor} secondaryColor={secondaryColor} + colorScheme={colorScheme} /> )} @@ -728,6 +738,7 @@ const MarketplaceEmbed: React.FC = ({ listing={listing as DirectListing | AuctionListing} primaryColor={primaryColor} secondaryColor={secondaryColor} + colorScheme={colorScheme} />