diff --git a/components/buttons/Bid.tsx b/components/buttons/Bid.tsx index 93c22b831..346e6ec02 100644 --- a/components/buttons/Bid.tsx +++ b/components/buttons/Bid.tsx @@ -1,12 +1,25 @@ import { BidModal, BidStep } from '@reservoir0x/reservoir-kit-ui' import { Button } from 'components/primitives' -import { cloneElement, ComponentProps, FC, useContext } from 'react' +import { + cloneElement, + ComponentProps, + ComponentPropsWithoutRef, + FC, + useContext, +} from 'react' import { CSS } from '@stitches/react' import { SWRResponse } from 'swr' -import { useAccount, useNetwork, useSigner, useSwitchNetwork } from 'wagmi' +import { + mainnet, + useAccount, + useNetwork, + useSigner, + useSwitchNetwork, +} from 'wagmi' import { useConnectModal } from '@rainbow-me/rainbowkit' import { ToastContext } from 'context/ToastContextProvider' import { useMarketplaceChain } from 'hooks' +import { constants } from 'ethers' type Props = { tokenId?: string | undefined @@ -18,6 +31,8 @@ type Props = { mutate?: SWRResponse['mutate'] } +type BiddingCurrencies = ComponentPropsWithoutRef['currencies'] + const Bid: FC = ({ tokenId, collectionId, @@ -48,6 +63,24 @@ const Bid: FC = ({ ) + // CONFIGURABLE: Here you can configure which currencies you would like to support for bidding + let bidCurrencies: BiddingCurrencies = undefined + if (marketplaceChain.id === mainnet.id) { + bidCurrencies = [ + { + contract: constants.AddressZero, + symbol: 'ETH', + coinGeckoId: 'ethereum', + }, + { + contract: '0xa0b86991c6218b36c1d19d4a2e9eb0ce3606eb48', + symbol: 'USDC', + decimals: 6, + coinGeckoId: 'usd-coin', + }, + ] + } + if (isDisconnected || isInTheWrongNetwork) { return cloneElement(trigger, { onClick: async () => { @@ -70,6 +103,7 @@ const Bid: FC = ({ collectionId={collectionId} trigger={trigger} openState={openState} + currencies={bidCurrencies} onClose={(data, stepData, currentStep) => { if (mutate && currentStep == BidStep.Complete) mutate() }} diff --git a/components/buttons/CollectionOffer.tsx b/components/buttons/CollectionOffer.tsx index f4714715a..7d633fdd3 100644 --- a/components/buttons/CollectionOffer.tsx +++ b/components/buttons/CollectionOffer.tsx @@ -1,14 +1,28 @@ import { BidModal, BidStep, Trait } from '@reservoir0x/reservoir-kit-ui' import { Button } from 'components/primitives' import { useRouter } from 'next/router' -import { ComponentProps, FC, useContext, useEffect, useState } from 'react' -import { useAccount, useNetwork, useSigner, useSwitchNetwork } from 'wagmi' +import { + ComponentProps, + ComponentPropsWithoutRef, + FC, + useContext, + useEffect, + useState, +} from 'react' +import { + mainnet, + useAccount, + useNetwork, + useSigner, + useSwitchNetwork, +} from 'wagmi' import { useCollections } from '@reservoir0x/reservoir-kit-ui' import { SWRResponse } from 'swr' import { CSS } from '@stitches/react' import { useConnectModal } from '@rainbow-me/rainbowkit' import { ToastContext } from 'context/ToastContextProvider' import { useMarketplaceChain } from 'hooks' +import { constants } from 'ethers' type Props = { collection: NonNullable['data']>[0] @@ -17,6 +31,8 @@ type Props = { buttonProps?: ComponentProps } +type BiddingCurrencies = ComponentPropsWithoutRef['currencies'] + const CollectionOffer: FC = ({ collection, mutate, @@ -68,6 +84,24 @@ const CollectionOffer: FC = ({ ) const isAttributeModal = !!attribute + // CONFIGURABLE: Here you can configure which currencies you would like to support for bidding + let bidCurrencies: BiddingCurrencies = undefined + if (marketplaceChain.id === mainnet.id) { + bidCurrencies = [ + { + contract: constants.AddressZero, + symbol: 'ETH', + coinGeckoId: 'ethereum', + }, + { + contract: '0xa0b86991c6218b36c1d19d4a2e9eb0ce3606eb48', + symbol: 'USDC', + decimals: 6, + coinGeckoId: 'usd-coin', + }, + ] + } + if (isDisconnected || isInTheWrongNetwork) { return ( } attribute={attribute} + currencies={bidCurrencies} onClose={(data, stepData, currentStep) => { if (mutate && currentStep == BidStep.Complete) mutate() }} diff --git a/components/buttons/List.tsx b/components/buttons/List.tsx index cba1ace0f..9cf2a9722 100644 --- a/components/buttons/List.tsx +++ b/components/buttons/List.tsx @@ -10,10 +10,17 @@ import { } from 'react' import { CSS } from '@stitches/react' import { SWRResponse } from 'swr' -import { useAccount, useNetwork, useSigner, useSwitchNetwork } from 'wagmi' +import { + mainnet, + useAccount, + useNetwork, + useSigner, + useSwitchNetwork, +} from 'wagmi' import { useConnectModal } from '@rainbow-me/rainbowkit' import { ToastContext } from 'context/ToastContextProvider' import { useMarketplaceChain } from 'hooks' +import { constants } from 'ethers' type ListingCurrencies = ComponentPropsWithoutRef< typeof ListModal @@ -50,7 +57,23 @@ const List: FC = ({ signer && marketplaceChain.id !== activeChain?.id ) + // CONFIGURABLE: Here you can configure which currencies you would like to support for listing let listingCurrencies: ListingCurrencies = undefined + if (marketplaceChain.id === mainnet.id) { + listingCurrencies = [ + { + contract: constants.AddressZero, + symbol: 'ETH', + coinGeckoId: 'ethereum', + }, + { + contract: '0xa0b86991c6218b36c1d19d4a2e9eb0ce3606eb48', + symbol: 'USDC', + decimals: 6, + coinGeckoId: 'usd-coin', + }, + ] + } const tokenId = token?.token?.tokenId const contract = token?.token?.contract diff --git a/components/portfolio/BatchListings.tsx b/components/portfolio/BatchListings.tsx index da77b7b23..e71c7b6f4 100644 --- a/components/portfolio/BatchListings.tsx +++ b/components/portfolio/BatchListings.tsx @@ -31,6 +31,8 @@ import { useMediaQuery } from 'react-responsive' import { BatchListingsTableHeading } from './BatchListingsTableHeading' import { BatchListingsTableRow } from './BatchListingsTableRow' import wrappedContracts from 'utils/wrappedContracts' +import { constants } from 'ethers' +import { mainnet } from 'wagmi' export type BatchListing = { token: UserToken @@ -105,7 +107,7 @@ const BatchListings: FC = ({ symbol: chainCurrency.symbol, } // CONFIGURABLE: Here you can configure which currencies you would like to support for batch listing - const currencies: ListingCurrencies = [ + let currencies: ListingCurrencies = [ { ...defaultCurrency }, { contract: wrappedContracts[chain.id], @@ -114,6 +116,15 @@ const BatchListings: FC = ({ }, ] + if (chain.id === mainnet.id) { + currencies.push({ + contract: '0xa0b86991c6218b36c1d19d4a2e9eb0ce3606eb48', + symbol: 'USDC', + decimals: 6, + coinGeckoId: 'usd-coin', + }) + } + const [currency, setCurrency] = useState( currencies && currencies[0] ? currencies[0] : defaultCurrency ) diff --git a/package.json b/package.json index 4f2038596..3c83df412 100644 --- a/package.json +++ b/package.json @@ -28,7 +28,7 @@ "@radix-ui/react-toggle-group": "^1.0.1", "@radix-ui/react-tooltip": "^1.0.2", "@rainbow-me/rainbowkit": "0.12.2", - "@reservoir0x/reservoir-kit-ui": "^0.16.6", + "@reservoir0x/reservoir-kit-ui": "^0.16.9", "@sentry/nextjs": "^7.53.1", "@types/uuid": "^9.0.1", "dayjs": "^1.11.6", diff --git a/yarn.lock b/yarn.lock index 2cdb3107f..55fd61790 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2139,10 +2139,10 @@ dependencies: "@react-hookz/deep-equal" "^1.0.3" -"@reservoir0x/reservoir-kit-ui@^0.16.6": - version "0.16.8" - resolved "https://registry.yarnpkg.com/@reservoir0x/reservoir-kit-ui/-/reservoir-kit-ui-0.16.8.tgz#11e70272f228b55c586b5ace85083e44551b2a47" - integrity sha512-GaWfM2CV4Xj1wZiF5uTqtyVxlbxNt8QuWyI8yAtfEP0UwZeARLfyGAbaVGrhztbHXnHxUV+qYg8VbTa2vY5vNg== +"@reservoir0x/reservoir-kit-ui@^0.16.8": + version "0.16.9" + resolved "https://registry.yarnpkg.com/@reservoir0x/reservoir-kit-ui/-/reservoir-kit-ui-0.16.9.tgz#c4a63922a630e3085df3549c65becb90ac7bd3a9" + integrity sha512-pJopkNiat29FpwE9tOnt35rIW96VEXYY3OZCCBTQVaS7NfjEpmnzqbI47yHqaZIk8YMJfq68dNbrllt/QQOr6w== dependencies: "@fortawesome/fontawesome-svg-core" "^6.1.1" "@fortawesome/free-solid-svg-icons" "^6.1.1"