Merge branch 'bj/noun-93-create-a-private-sale-private-asks' of githu…

…b.com:ourzora/nouns-marketplace into bj/noun-93-create-a-private-sale-private-asks

@filter/hooks/useTokensQuery.ts

@@ -16,7 +16,7 @@ import useSWRInfinite from 'swr/infinite'
 const PAGE_SIZE = 24
 
 export interface UseTokenQueryProps {
-  contractWhiteList?: string[] | undefined
+  contractAllowList?: string[] | undefined
   contractAddress?: string | null
   ownerAddress?: string
   initialData?: NFTObject[]
@@ -43,7 +43,7 @@ async function getNFTs(query: TokensQueryArgs): Promise<GetNFTReturnType> {
 }
 
 export function useTokensQuery({
-  contractWhiteList,
+  contractAllowList,
   contractAddress,
   ownerAddress,
   sort,
@@ -57,11 +57,11 @@ UseTokenQueryProps) {
       where: {
         ...(contractAddress && {
           collectionAddresses: ownerAddress
-            ? contractWhiteList
+            ? contractAllowList
             : getAddress(contractAddress),
         }),
         ...(ownerAddress && {
-          collectionAddresses: contractWhiteList,
+          collectionAddresses: contractAllowList,
           ownerAddresses: [getAddress(ownerAddress)],
         }),
         ...where,

@filter/providers/CollectionFilterProvider.tsx

@@ -22,7 +22,7 @@ const CollectionFilterContext = createContext<CollectionFilterContextTypes>({
   isEmpty: true,
   handleLoadMore: () => {},
   hasActiveMarkets: false,
-  contractWhiteList: undefined,
+  contractAllowList: undefined,
   contractAddress: undefined,
   ownerAddress: undefined,
   strings: stringDefaults,
@@ -48,7 +48,7 @@ export function CollectionFilterProvider({
   contractAddress,
   ownerAddress,
   initialPage,
-  contractWhiteList,
+  contractAllowList,
   children,
   filtersVisible = false,
   useMarketStatus = false,
@@ -73,7 +73,7 @@ export function CollectionFilterProvider({
     isEmpty,
     handleLoadMore,
   } = useTokensQuery({
-    contractWhiteList,
+    contractAllowList,
     contractAddress: contractAddress ? contractAddress : undefined,
     ownerAddress,
     initialData: initialPage,

@filter/typings/filter-provider.ts

@@ -44,7 +44,7 @@ export interface FilterConfigProps {
 export interface FilterContextInputProps extends FilterConfigProps {
   contractAddress?: string | null
   ownerAddress?: string
-  contractWhiteList?: string[] | undefined
+  contractAllowList?: string[] | undefined
 }
 
 export interface TokenQueryReturnTypes extends FilterContextInputProps {

@market/modules/PrivateAsk/hooks/useFormattedPrivateAskInfo.ts

@@ -107,7 +107,6 @@ export const useFormattedPrivateAskInfo = ({ nft: nftObj }: PrivateAskInfoProps)
         },
         address: finalizedPrivateAskDetails?.buyerAddress,
       },
-      // @BJ TODO: Should we also add seller data to this table?
     ]
   }, [
     hasRelevantPrivateAsk,

@market/modules/PrivateAsk/hooks/usePrimaryAuctionDataTable.ts

@@ -4,16 +4,21 @@ import { NFTObject } from '@zoralabs/nft-hooks'
 import { DataTableItemProps } from '@shared/components/DataTable/DataTableItem'
 import { useRelevantMarket } from '@market/hooks'
 import { useNounishAuctionProvider } from '@noun-auction'
+import { returnDaoAuctionContract } from 'constants/collection-addresses'
 
 interface NounishAuctionInfoProps {
   nft: NFTObject
 }
 
 export const usePrimaryAuctionDataTable = ({ nft: nftObj }: NounishAuctionInfoProps) => {
   const { nft, markets } = nftObj
-  const { primarySalePrice } = useNounishAuctionProvider()
+  const { primarySalePrice, data } = useNounishAuctionProvider()
   const { ask } = useRelevantMarket(markets)
   const askPrice = useMemo(() => ask?.amount?.eth?.value, [ask?.amount?.eth?.value])
+  const auctionContractAddress = useMemo(
+    () => (nft ? returnDaoAuctionContract(nft?.contract.address) : null),
+    [nft]
+  )
 
   const askPriceSummary = useMemo(
     () =>
@@ -31,23 +36,38 @@ export const usePrimaryAuctionDataTable = ({ nft: nftObj }: NounishAuctionInfoPr
       {
         label: 'Owned by',
         value: shortenAddress(nft?.owner?.address),
+        url: {
+          href: `https://market.zora.co/${nft?.owner?.address}`,
+          target: '_blank',
+          rel: 'noreferrer',
+        },
       },
       {
         label: 'Minted by',
         value: shortenAddress(nft?.minted.address),
+        url: {
+          href: `https://market.zora.co/${nft?.minted?.address}`,
+          target: '_blank',
+          rel: 'noreferrer',
+        },
       },
     ]
 
     if (primarySalePrice) {
       const primarySummary = {
         label: 'Auctioned for',
         value: `${primarySalePrice} ETH`,
+        url: {
+          href: `https://etherscan.io/address/${auctionContractAddress}`,
+          target: '_blank',
+          rel: 'noreferrer',
+        },
       }
       summary.push(primarySummary)
     }
 
     return summary
-  }, [nft?.owner?.address, nft?.minted.address, primarySalePrice])
+  }, [nft?.owner?.address, nft?.minted.address, primarySalePrice, auctionContractAddress])
 
   const copyableValue = useMemo(() => {
     if (!formattedAuctionDataTable) return ''

@market/modules/PrivateAsk/view/PrivateAskViewListing.tsx

@@ -1,11 +1,12 @@
 import { useModal } from '@modal'
 import { DataTable } from '@shared/components/DataTable'
 import { useCopyToClipboard } from '@shared/hooks/useCopyToClipboard'
-import { useToast } from '@shared/hooks/useToast'
 import { Button, Heading, Stack } from '@zoralabs/zord'
 import React, { useEffect } from 'react'
 import { useFormattedPrivateAskInfo } from '../hooks'
 import { CommonPrivateAskComponentProps } from '../PrivateAskFlow'
+import { useToast } from '@toast'
+import { ToastStatus, ToastVariant } from '@toast/toastReducer'
 
 interface PrivateAskFillAskSuccessProps extends CommonPrivateAskComponentProps {}
 
@@ -14,13 +15,20 @@ export function PrivateAskViewListing({ nft, ...props }: PrivateAskFillAskSucces
   const { formattedAskDetails, copyableValue } = useFormattedPrivateAskInfo({ nft })
 
   const [_, copied, copy] = useCopyToClipboard(copyableValue)
-  const { toast, showToast } = useToast()
+  const { toastDispatch } = useToast()
 
   useEffect(() => {
     if (copied) {
-      showToast('Copied')
+      toastDispatch({
+        type: ToastStatus.REPLACE,
+        item: {
+          duration: 3500,
+          description: 'Copied to clipboard.',
+          variant: ToastVariant.SUCCESS,
+        },
+      })
     }
-  }, [copied, showToast])
+  }, [copied, toastDispatch])
 
   return (
     <>
@@ -39,8 +47,6 @@ export function PrivateAskViewListing({ nft, ...props }: PrivateAskFillAskSucces
           </Button>
         </Stack>
       </Stack>
-
-      {toast}
     </>
   )
 }

@noun-auction/components/DataRenderers/AuctionBidder.tsx

@@ -1,7 +1,5 @@
-import { useMemo } from 'react'
 import { useEnsName } from 'wagmi'
 import { Flex, Label, Icon } from '@zoralabs/zord'
-import { AddressZero } from '@ethersproject/constants'
 
 // @noun-auction
 import { SharedDataRendererProps } from '@noun-auction/typings'
@@ -10,7 +8,7 @@ import { useNounishAuctionProvider } from '@noun-auction/providers'
 import { sideBarUpperLabel } from '@noun-auction/styles/NounishStyles.css'
 
 // @shared
-import { lightFont, useShortAddress, isAddressMatch } from '@shared'
+import { lightFont, useShortAddress } from '@shared'
 
 export function AuctionBidder({
   label = 'Top bidder',
@@ -21,21 +19,14 @@ export function AuctionBidder({
 }: {
   useAvatar?: boolean
 } & SharedDataRendererProps) {
-  const { layout, activeAuction } = useNounishAuctionProvider()
+  const { layout, highestBidderAddress, hasNonZeroHighestBidder } =
+    useNounishAuctionProvider()
 
   const { data: ensName } = useEnsName({
-    address: activeAuction?.properties?.highestBidder || undefined,
+    address: highestBidderAddress,
   })
 
-  const shortAddress = useShortAddress(activeAuction?.properties?.highestBidder)
-
-  const highestBidder = useMemo(
-    () =>
-      activeAuction?.properties?.highestBidder
-        ? activeAuction?.properties?.highestBidder
-        : undefined,
-    [activeAuction, activeAuction?.properties?.highestBidder]
-  )
+  const shortAddress = useShortAddress(highestBidderAddress)
 
   return (
     <Flex
@@ -67,17 +58,17 @@ export function AuctionBidder({
           style={{ lineHeight: '1.15' }}
           align="right"
           className={[sideBarUpperLabel]}
-          color={!isAddressMatch(highestBidder, AddressZero) ? 'primary' : 'tertiary'}
+          color={hasNonZeroHighestBidder ? 'primary' : 'tertiary'}
         >
-          {!isAddressMatch(highestBidder, AddressZero) ? (
+          {hasNonZeroHighestBidder ? (
             <Flex gap="x2" align="center">
               <Label size="md" gap="x1" align={'center'} style={{ lineHeight: '1.15' }}>
                 {ensName ? ensName : shortAddress}
               </Label>
               {useAvatar && (
                 <>
-                  {layout !== 'sideBarBid' && highestBidder ? (
-                    <EnsAvatar address={highestBidder} />
+                  {layout !== 'sideBarBid' && highestBidderAddress ? (
+                    <EnsAvatar address={highestBidderAddress} />
                   ) : (
                     <Icon id="ArrowRightAngle" />
                   )}

@noun-auction/providers/NounishAuctionProvider.tsx

@@ -17,8 +17,10 @@ import {
 import { defaultDaoConfig } from '@noun-auction/constants'
 import { auctionWrapperVariants } from '@noun-auction/styles/NounishStyles.css'
 import { useActiveNounishAuction } from '@noun-auction/hooks/useActiveNounishAuction'
-import { first, isArray } from 'lodash'
+import { first } from 'lodash'
+import { AddressZero } from '@ethersproject/constants'
 import { formatUnits } from 'ethers/lib/utils'
+import { isAddressMatch } from '@shared'
 
 export type NounishAuctionProviderProps = {
   tokenId?: string
@@ -50,6 +52,8 @@ const NounsAuctionContext = createContext<{
   activeAuctionId: string | undefined
   activeAuction: ActiveNounishAuctionResponse
   primarySalePrice?: string
+  highestBidderAddress?: string
+  hasNonZeroHighestBidder?: boolean
 }>({
   daoConfig: defaultDaoConfig,
   timerComplete: false,
@@ -58,6 +62,7 @@ const NounsAuctionContext = createContext<{
   activeAuction: undefined,
   reservePrice: '0.01',
   primarySalePrice: undefined,
+  highestBidderAddress: undefined,
 })
 
 export function useNounishAuctionProvider() {
@@ -87,7 +92,7 @@ export function NounishAuctionProvider({
   }, [data])
 
   const isSettled = useMemo(() => {
-    if (noAuctionHistory) return null
+    if (noAuctionHistory) return false
 
     const settledAuctionEventType =
       marketType === 'NOUNS_AUCTION'
@@ -126,6 +131,18 @@ export function NounishAuctionProvider({
     return firstPrice
   }, [data?.events?.nodes, isSettled, marketType, noAuctionHistory])
 
+  const highestBidderAddress = useMemo(
+    () =>
+      activeAuction?.properties?.highestBidder
+        ? activeAuction?.properties?.highestBidder
+        : undefined,
+    [activeAuction?.properties?.highestBidder]
+  )
+  const hasNonZeroHighestBidder = useMemo(
+    () => !isAddressMatch(highestBidderAddress, AddressZero),
+    [highestBidderAddress]
+  )
+
   return (
     <NounsAuctionContext.Provider
       value={{
@@ -142,6 +159,8 @@ export function NounishAuctionProvider({
         layout,
         minBidIncrementPercentage: activeAuction?.properties?.minBidIncrementPercentage,
         reservePrice: '0.01',
+        highestBidderAddress,
+        hasNonZeroHighestBidder,
       }}
     >
       {children}

@shared/components/CopyButton.tsx

@@ -1,4 +1,4 @@
-import { CopyStatus, useCopyToClipboard } from '@shared/hooks/useCopyToClipboard'
+import { useCopyToClipboard } from '@shared/hooks/useCopyToClipboard'
 import { mixins, Button, ButtonProps, Icon } from '@zoralabs/zord'
 import React, { useEffect } from 'react'
 

@shared/components/index.ts

@@ -6,5 +6,4 @@ export * from './CopyButton'
 export * from './DescriptionWithMaxLines'
 export * from './ImageBoundaryWithFallback'
 export * from './Avatar'
-export * from './Toast'
 export * from './Motion'

@shared/hooks/index.ts

@@ -10,5 +10,4 @@ export * from './useClickOutside'
 export * from './useCopyToClipboard'
 export * from './useWindowWidth'
 export * from './useTitleWithFallback'
-export * from './useToast'
 export * from './useToggle'