Skip to content

Commit

Permalink
Merge pull request #290 from reservoirprotocol/ted/homepage-fixes
Browse files Browse the repository at this point in the history 
Reduce padding on homepage dropdowns, fix no data bug
  • Loading branch information
@pedromcunha
pedromcunha committed Jul 31, 2023
2 parents 03f927e + 1fcd1d5 commit e5fe60b
Show file tree
Hide file tree
Showing 4 changed files with 58 additions and 56 deletions.
103 changes: 51 additions & 52 deletions components/home/CollectionTopSellingTable.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -44,61 +44,60 @@ export const CollectionTopSellingTable: FC<Props> = ({
}) => {
const isSmallDevice = useMediaQuery({ maxWidth: 900 })

if (!loading && topSellingCollections?.length === 0) {
return (
<Flex
direction="column"
align="center"
css={{ py: '$6', gap: '$4', width: '100%' }}
>
<Text css={{ color: '$gray11' }}>
<FontAwesomeIcon icon={faMagnifyingGlass} size="2xl" />
</Text>
<Text css={{ color: '$gray11' }}>No collections found</Text>
</Flex>
)
}

return (
<Flex direction="column" css={{ width: '100%', pb: '$2' }}>
{!isSmallDevice ? <CollectionTableHeading fillType={fillType} /> : null}
<Flex direction="column" css={{ position: 'relative' }}>
{topSellingCollections?.map((collection, i) => {
switch (fillType) {
case 'sale':
return (
<SaleTableRow
key={collection.id}
topSellingCollection={collection}
collection={collections[collection.id as string]}
rank={i + 1}
isSmallDevice={isSmallDevice}
/>
)
case 'mint':
return (
<MintTableRow
key={collection.id}
topSellingCollection={collection}
collection={collections[collection.id as string]}
rank={i + 1}
isSmallDevice={isSmallDevice}
/>
)
case 'any':
default:
return (
<AllSalesTableRow
key={collection.id}
topSellingCollection={collection}
collection={collections[collection.id as string]}
rank={i + 1}
isSmallDevice={isSmallDevice}
/>
)
}
})}
</Flex>

{!loading && topSellingCollections?.length === 0 ? (
<Flex
direction="column"
align="center"
css={{ py: '$6', gap: '$4', width: '100%' }}
>
<Text css={{ color: '$gray11' }}>
<FontAwesomeIcon icon={faMagnifyingGlass} size="2xl" />
</Text>
<Text css={{ color: '$gray11' }}>No collections found</Text>
</Flex>
) : (
<Flex direction="column" css={{ position: 'relative' }}>
{topSellingCollections?.map((collection, i) => {
switch (fillType) {
case 'sale':
return (
<SaleTableRow
key={collection.id}
topSellingCollection={collection}
collection={collections[collection.id as string]}
rank={i + 1}
isSmallDevice={isSmallDevice}
/>
)
case 'mint':
return (
<MintTableRow
key={collection.id}
topSellingCollection={collection}
collection={collections[collection.id as string]}
rank={i + 1}
isSmallDevice={isSmallDevice}
/>
)
case 'any':
default:
return (
<AllSalesTableRow
key={collection.id}
topSellingCollection={collection}
collection={collections[collection.id as string]}
rank={i + 1}
isSmallDevice={isSmallDevice}
/>
)
}
})}
</Flex>
)}
</Flex>
)
}
Expand Down
1 change: 1 addition & 0 deletions components/home/FillTypeToggle.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -83,6 +83,7 @@ export const FillTypeToggle: FC<Props> = ({ fillType, setFillType }) => {
onClick={() => {
setFillType(fillType.value as Props['fillType'])
}}
css={{ py: '$2' }}
>
{fillType.display}
</DropdownMenuItem>
Expand Down
1 change: 1 addition & 0 deletions components/home/TimeFilterToggle.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -93,6 +93,7 @@ export const TimeFilterToggle: FC<Props> = ({
onClick={() => {
setMinutesFilter(+time.value)
}}
css={{ py: '$2' }}
>
{time.display}
</DropdownMenuItem>
Expand Down
9 changes: 5 additions & 4 deletions pages/[chain]/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -47,7 +47,7 @@ const IndexPage: NextPage<Props> = ({ ssr }) => {
const {
data: topSellingCollectionsData,
collections: collectionsData,
isValidating,
isLoading,
} = useTopSellingCollections(
{
startTime,
Expand All @@ -74,11 +74,11 @@ const IndexPage: NextPage<Props> = ({ ssr }) => {
)

useEffect(() => {
if (!isValidating) {
if (!isLoading) {
setTopSellingCollections(topSellingCollectionsData)
setCollections(collectionsData)
}
}, [isValidating])
}, [isLoading])

return (
<Layout>
Expand Down Expand Up @@ -165,6 +165,7 @@ const IndexPage: NextPage<Props> = ({ ssr }) => {
<DropdownMenuItem
css={{
textAlign: 'left',
py: '$2',
}}
key={id}
onClick={() => {
Expand Down Expand Up @@ -221,7 +222,7 @@ const IndexPage: NextPage<Props> = ({ ssr }) => {
<CollectionTopSellingTable
topSellingCollections={topSellingCollections?.collections}
collections={collections}
loading={isValidating}
loading={isLoading}
fillType={fillType}
/>
)}
Expand Down

2 comments on commit e5fe60b

@vercel
Copy link

@vercel vercel bot commented on e5fe60b Jul 31, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Successfully deployed to the following URLs:

artblocks-v2 – ./

artblocks-v2-unevenlabs.vercel.app
artblocks-v2.vercel.app
artblocks-v2-git-main-unevenlabs.vercel.app

@vercel
Copy link

@vercel vercel bot commented on e5fe60b Jul 31, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Successfully deployed to the following URLs:

explorer – ./

explorer-git-main-unevenlabs.vercel.app
marketplace.reservoir.tools
explorer-unevenlabs.vercel.app
explorer.reservoir.tools
testnets-marketplace.reservoir.tools

Please sign in to comment.