Collectibles List - Manage list when no collectibles (#1419)

* Bump new onboard.js version

* Remove component

* Fix travis rollback bug

* Fix Typos + Updated logic

Co-authored-by: Daniel Sanchez <daniel.sanchez@gnosis.pm>
Co-authored-by: nicolas <nicosampler@users.noreply.github.com>
This commit is contained in:
Mati Dastugue 2020-10-27 11:53:03 -03:00 committed by GitHub
parent aa181fb9a1
commit cb051b1955
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 9 additions and 4 deletions

View File

@ -1,4 +1,5 @@
import MuiList from '@material-ui/core/List' import MuiList from '@material-ui/core/List'
import CircularProgress from '@material-ui/core/CircularProgress'
import Search from '@material-ui/icons/Search' import Search from '@material-ui/icons/Search'
import cn from 'classnames' import cn from 'classnames'
import SearchBar from 'material-ui-search-bar' import SearchBar from 'material-ui-search-bar'
@ -27,6 +28,10 @@ import {
export const ADD_CUSTOM_ASSET_BUTTON_TEST_ID = 'add-custom-asset-btn' export const ADD_CUSTOM_ASSET_BUTTON_TEST_ID = 'add-custom-asset-btn'
type Props = {
setActiveScreen: (newScreen: string) => void
}
const filterBy = (filter, nfts) => const filterBy = (filter, nfts) =>
nfts.filter( nfts.filter(
(asset) => (asset) =>
@ -36,7 +41,7 @@ const filterBy = (filter, nfts) =>
asset.symbol.toLowerCase().includes(filter.toLowerCase()), asset.symbol.toLowerCase().includes(filter.toLowerCase()),
) )
const AssetsList = (props) => { const AssetsList = (props: Props): React.ReactElement => {
const classes = useStyles() const classes = useStyles()
const searchClasses = { const searchClasses = {
input: classes.searchInput, input: classes.searchInput,
@ -126,12 +131,12 @@ const AssetsList = (props) => {
</Row> </Row>
<Hairline /> <Hairline />
</Block> </Block>
{!nftAssetsList.length && ( {!nftAssetsList?.length && (
<Block className={classes.progressContainer} justify="center"> <Block className={classes.progressContainer} justify="center">
<Paragraph>No collectibles available</Paragraph> {!nftAssetsList ? <CircularProgress /> : <Paragraph>No collectibles available</Paragraph>}
</Block> </Block>
)} )}
{nftAssetsList.length > 0 && ( {nftAssetsFilteredList.length > 0 && (
<MuiList className={classes.list}> <MuiList className={classes.list}>
<FixedSizeList <FixedSizeList
height={413} height={413}