Commit f9f8eea6 authored by lynn's avatar lynn Committed by GitHub

fix: add filter text when filter button open (#5217)

* fix

* remove extra

* filter button text fixes
parent 3f6dc180
...@@ -6,5 +6,4 @@ REACT_APP_AWS_API_ACCESS_KEY="AKIAYJJWW6AQ47ODATHN" ...@@ -6,5 +6,4 @@ REACT_APP_AWS_API_ACCESS_KEY="AKIAYJJWW6AQ47ODATHN"
REACT_APP_AWS_API_ACCESS_SECRET="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" REACT_APP_AWS_API_ACCESS_SECRET="V9PoU0FhBP3cX760rPs9jMG/MIuDNLX6hYvVcaYO"
REACT_APP_AWS_X_API_KEY="z9dReS5UtHu7iTrUsTuWRozLthi3AxOZlvobrIdr14" REACT_APP_AWS_X_API_KEY="z9dReS5UtHu7iTrUsTuWRozLthi3AxOZlvobrIdr14"
REACT_APP_AWS_API_ENDPOINT="https://beta.api.uniswap.org/v1/graphql" REACT_APP_AWS_API_ENDPOINT="https://beta.api.uniswap.org/v1/graphql"
REACT_APP_TEMP_API_URL="https://temp.api.uniswap.org/v1" REACT_APP_TEMP_API_URL="https://temp.api.uniswap.org/v1"
ESLINT_NO_DEV_ERRORS=true \ No newline at end of file
...@@ -3,6 +3,7 @@ import { Box } from 'nft/components/Box' ...@@ -3,6 +3,7 @@ import { Box } from 'nft/components/Box'
import * as styles from 'nft/components/collection/FilterButton.css' import * as styles from 'nft/components/collection/FilterButton.css'
import { FilterIcon } from 'nft/components/icons' import { FilterIcon } from 'nft/components/icons'
import { buttonTextMedium } from 'nft/css/common.css' import { buttonTextMedium } from 'nft/css/common.css'
import { breakpoints } from 'nft/css/sprinkles.css'
import { pluralize, putCommas } from 'nft/utils' import { pluralize, putCommas } from 'nft/utils'
export const FilterButton = ({ export const FilterButton = ({
...@@ -16,6 +17,8 @@ export const FilterButton = ({ ...@@ -16,6 +17,8 @@ export const FilterButton = ({
onClick: () => void onClick: () => void
collectionCount?: number collectionCount?: number
}) => { }) => {
const hideResultsCount = window.innerWidth >= breakpoints.sm && window.innerWidth < breakpoints.md
return ( return (
<Box <Box
className={clsx(styles.filterButton, !isFiltersExpanded && styles.filterButtonExpanded)} className={clsx(styles.filterButton, !isFiltersExpanded && styles.filterButtonExpanded)}
...@@ -34,12 +37,12 @@ export const FilterButton = ({ ...@@ -34,12 +37,12 @@ export const FilterButton = ({
> >
<FilterIcon /> <FilterIcon />
{!isMobile ? ( {!isMobile ? (
<> <Box className={buttonTextMedium}>
<Box className={buttonTextMedium}> {' '}
{' '} {!collectionCount || hideResultsCount
Filter • {putCommas(collectionCount)} result{pluralize(collectionCount)} ? 'Filter'
</Box> : `Filter • ${putCommas(collectionCount)} result${pluralize(collectionCount)}`}
</> </Box>
) : null} ) : null}
</Box> </Box>
) )
......
...@@ -102,7 +102,6 @@ export const ProfilePage = () => { ...@@ -102,7 +102,6 @@ export const ProfilePage = () => {
<FilterButton <FilterButton
isMobile={isMobile} isMobile={isMobile}
isFiltersExpanded={isFiltersExpanded} isFiltersExpanded={isFiltersExpanded}
collectionCount={ownerAssets?.length}
onClick={() => setFiltersExpanded(!isFiltersExpanded)} onClick={() => setFiltersExpanded(!isFiltersExpanded)}
/> />
</Row> </Row>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment