diff --git a/packages/nextjs/app/rep-tokens-demo/_components/RepTokensDemo.tsx b/packages/nextjs/app/rep-tokens-demo/_components/RepTokensDemo.tsx index 627607f..78813ca 100644 --- a/packages/nextjs/app/rep-tokens-demo/_components/RepTokensDemo.tsx +++ b/packages/nextjs/app/rep-tokens-demo/_components/RepTokensDemo.tsx @@ -1,32 +1,32 @@ "use client"; import { tokenCardConfigProps as singleCardConfig } from "./configs/SingleCardConfig"; -// import { addressConfigProps } from "./configs/values/AddressCardConfig"; -// import { balanceConfigProps } from "./configs/values/BalanceCardConfig"; -// import { descriptionConfigProps } from "./configs/values/DescriptionCardConfig"; -// import { imageConfigProps } from "./configs/values/ImageCardConfig"; -// import { isTradeableConfigProps } from "./configs/values/IsTradeableCardConfig"; -// import { maxMintAmountConfigProps } from "./configs/values/MaxMintAmountCardConfig"; -// import { nameConfigProps } from "./configs/values/NameCardConfig"; +import { addressConfigProps } from "./configs/values/AddressCardConfig"; +import { balanceConfigProps } from "./configs/values/BalanceCardConfig"; +import { descriptionConfigProps } from "./configs/values/DescriptionCardConfig"; +import { imageConfigProps } from "./configs/values/ImageCardConfig"; +import { isTradeableConfigProps } from "./configs/values/IsTradeableCardConfig"; +import { maxMintAmountConfigProps } from "./configs/values/MaxMintAmountCardConfig"; +import { nameConfigProps } from "./configs/values/NameCardConfig"; import { useAccount } from "wagmi"; -// import { tokenGroupCardConfigProps as mainTokenGroupCardConfigProps } from "~~/app/rep-tokens-demo/_components/configs/MainTokensCardConfig"; -// import { tokenGroupCardConfigProps as mainTokenGroupOverlayCardConfigProps } from "~~/app/rep-tokens-demo/_components/configs/MainTokensCardWithNumberOverlayConfig"; -// import { tokenGroupCardConfigProps as navBarTokenGroupConfigProps } from "~~/app/rep-tokens-demo/_components/configs/NavBarCardConfig"; +import { tokenGroupCardConfigProps as mainTokenGroupCardConfigProps } from "~~/app/rep-tokens-demo/_components/configs/MainTokensCardConfig"; +import { tokenGroupCardConfigProps as mainTokenGroupOverlayCardConfigProps } from "~~/app/rep-tokens-demo/_components/configs/MainTokensCardWithNumberOverlayConfig"; +import { tokenGroupCardConfigProps as navBarTokenGroupConfigProps } from "~~/app/rep-tokens-demo/_components/configs/NavBarCardConfig"; import { TokenCard } from "~~/components/rep-tokens/cards/token-card/TokenCard"; -// import { TokenGroupCard } from "~~/components/rep-tokens/cards/token-group-card/TokenGroupCard"; -// import { BalanceCard } from "~~/components/rep-tokens/cards/value-cards/BalanceCard"; -// import { ImageCard } from "~~/components/rep-tokens/cards/value-cards/ImageCard"; -// import { StringCard } from "~~/components/rep-tokens/cards/value-cards/StringCard"; +import { TokenGroupCard } from "~~/components/rep-tokens/cards/token-group-card/TokenGroupCard"; +import { BalanceCard } from "~~/components/rep-tokens/cards/value-cards/BalanceCard"; +import { ImageCard } from "~~/components/rep-tokens/cards/value-cards/ImageCard"; +import { StringCard } from "~~/components/rep-tokens/cards/value-cards/StringCard"; import { useRepTokens } from "~~/components/rep-tokens/hooks/Hooks"; import { - // buildBalanceCard, - // buildImageCard, - // buildStringCard, - buildTokenCard, // buildTokenCards, - // buildTokenGroupCard, + buildBalanceCard, + buildImageCard, + buildStringCard, + buildTokenCard, + buildTokenCards, + buildTokenGroupCard, } from "~~/components/rep-tokens/utils/buildTokensCard"; - -// import { Address } from "~~/components/scaffold-eth"; +import { Address } from "~~/components/scaffold-eth"; export function RepTokensDemo() { ////// @@ -45,102 +45,102 @@ export function RepTokensDemo() { ///// // Individual Components - // const balanceProps = buildBalanceCard(tokensData?.tokens[0]?.balance, balanceConfigProps); - // const nameProps = buildStringCard(tokensData?.tokens[0]?.name, nameConfigProps); - // const descriptionsProps = buildStringCard(tokensData?.tokens[0]?.description, descriptionConfigProps); - // const imageProps = buildImageCard(tokensData?.tokens[0]?.image, imageConfigProps); - // const addressProps = buildStringCard(tokensData?.address, addressConfigProps); - - // const isTradeableProps = buildStringCard( - // tokensData?.tokens[0]?.properties?.isTradeable !== undefined - // ? `Is Tradeable: ${tokensData?.tokens[0]?.properties.isTradeable}` - // : undefined, - // isTradeableConfigProps, - // ); - // const maxMintAmountProps = buildStringCard( - // tokensData?.tokens[0]?.properties?.maxMintAmountPerTx !== undefined - // ? `Max Mint Amount Per Tx: ${tokensData?.tokens[0]?.properties.maxMintAmountPerTx}` - // : undefined, - // maxMintAmountConfigProps, - // ); + const balanceProps = buildBalanceCard(tokensData?.tokens[0]?.balance, balanceConfigProps); + const nameProps = buildStringCard(tokensData?.tokens[0]?.name, nameConfigProps); + const descriptionsProps = buildStringCard(tokensData?.tokens[0]?.description, descriptionConfigProps); + const imageProps = buildImageCard(tokensData?.tokens[0]?.image, imageConfigProps); + const addressProps = buildStringCard(tokensData?.address, addressConfigProps); + + const isTradeableProps = buildStringCard( + tokensData?.tokens[0]?.properties?.isTradeable !== undefined + ? `Is Tradeable: ${tokensData?.tokens[0]?.properties.isTradeable}` + : undefined, + isTradeableConfigProps, + ); + const maxMintAmountProps = buildStringCard( + tokensData?.tokens[0]?.properties?.maxMintAmountPerTx !== undefined + ? `Max Mint Amount Per Tx: ${tokensData?.tokens[0]?.properties.maxMintAmountPerTx}` + : undefined, + maxMintAmountConfigProps, + ); // Single Card const singleCard = buildTokenCard(tokensData?.tokens[0], tokensData.address, singleCardConfig); // Multi-card - // const mainTokenCards = buildTokenCards( - // tokensData.tokens, - // tokensData.address, - // mainTokenGroupCardConfigProps.tokenCardConfigProps, - // ); - // const mainTokenGroupCardProps = buildTokenGroupCard( - // mainTokenGroupCardConfigProps, - // mainTokenCards, - // tokensData.address, - // ); - - // if (mainTokenGroupCardConfigProps.address?.isRendering) { - // mainTokenGroupCardProps.addressOutput =
; - // } + const mainTokenCards = buildTokenCards( + tokensData.tokens, + tokensData.address, + mainTokenGroupCardConfigProps.tokenCardConfigProps, + ); + const mainTokenGroupCardProps = buildTokenGroupCard( + mainTokenGroupCardConfigProps, + mainTokenCards, + tokensData.address, + ); + + if (mainTokenGroupCardConfigProps.address?.isRendering) { + mainTokenGroupCardProps.addressOutput = ; + } // Multi-card with overlay - // const mainTokensOverlayCards = buildTokenCards( - // tokensData.tokens, - // tokensData.address, - // mainTokenGroupOverlayCardConfigProps.tokenCardConfigProps, - // ); - - // const mainTokenGroupOverlayCardProps = buildTokenGroupCard( - // mainTokenGroupOverlayCardConfigProps, - // mainTokensOverlayCards, - // tokensData.address, - // ); - - // if (mainTokenGroupOverlayCardConfigProps.address?.isRendering) { - // mainTokenGroupOverlayCardProps.addressOutput = ; - // } + const mainTokensOverlayCards = buildTokenCards( + tokensData.tokens, + tokensData.address, + mainTokenGroupOverlayCardConfigProps.tokenCardConfigProps, + ); + + const mainTokenGroupOverlayCardProps = buildTokenGroupCard( + mainTokenGroupOverlayCardConfigProps, + mainTokensOverlayCards, + tokensData.address, + ); + + if (mainTokenGroupOverlayCardConfigProps.address?.isRendering) { + mainTokenGroupOverlayCardProps.addressOutput = ; + } // Widget - // const navBarTokenCards = buildTokenCards( - // tokensData.tokens, - // tokensData.address, - // navBarTokenGroupConfigProps.tokenCardConfigProps, - // ); - // const navBarTokenGroupCardProps = buildTokenGroupCard( - // navBarTokenGroupConfigProps, - // navBarTokenCards, - // tokensData.address, - // ); - - // if (navBarTokenGroupConfigProps.address?.isRendering) { - // navBarTokenGroupCardProps.addressOutput = ; - // } + const navBarTokenCards = buildTokenCards( + tokensData.tokens, + tokensData.address, + navBarTokenGroupConfigProps.tokenCardConfigProps, + ); + const navBarTokenGroupCardProps = buildTokenGroupCard( + navBarTokenGroupConfigProps, + navBarTokenCards, + tokensData.address, + ); + + if (navBarTokenGroupConfigProps.address?.isRendering) { + navBarTokenGroupCardProps.addressOutput = ; + } return ( <>Individual Components
Single Card
Multi-Card
-Multi-Card
+Multi-Card W/ Overlay
+Multi-Card W/ Overlay
-Widget
-