ButterflyEffect/uniswap-interface-uncensored
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: give a bunch of list renders keys (#5158)

Browse Source 
* fix: give a bunch of list renders keys

* pr feedback

* pr feedback
This commit is contained in:
Jordan Frankfurt 2022-11-10 10:51:04 -06:00 committed by GitHub
parent 4438818f38
commit 4ef4ea8f58
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 22 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/nft/components/collection/ActivitySwitcher.tsx
View File

@ -6,7 +6,9 @@ import { useIsCollectionLoading } from 'nft/hooks'
import * as styles from './ActivitySwitcher.css'
export const ActivitySwitcherLoading = new Array(2).fill(<div className={styles.styledLoading} />)
export const ActivitySwitcherLoading = new Array(2)
.fill(null)
.map((_, index) => <div className={styles.styledLoading} key={`ActivitySwitcherLoading-key-${index}`} />)
export const ActivitySwitcher = ({
showActivity,

21
src/nft/components/collection/CollectionStats.tsx
View File

@ -255,14 +255,19 @@ const StatsItem = ({ children, label, shouldHide }: { children: ReactNode; label
}
const statsLoadingSkeleton = (isMobile: boolean) =>
new Array(5).fill(
<>
<Box display="flex" flexDirection={isMobile ? 'row' : 'column'} alignItems="baseline" gap="2" height="min">
<div className={styles.statsLabelLoading} />
<span className={styles.statsValueLoading} />
</Box>
</>
)
new Array(5).fill(null).map((_, index) => (
<Box
display="flex"
flexDirection={isMobile ? 'row' : 'column'}
alignItems="baseline"
gap="2"
height="min"
key={`statsLoadingSkeleton-key-${index}`}
>
<div className={styles.statsLabelLoading} />
<span className={styles.statsValueLoading} />
</Box>
))
const StatsRow = ({ stats, isMobile, ...props }: { stats: GenieCollection; isMobile?: boolean } & BoxProps) => {
const uniqueOwnersPercentage = stats?.stats?.total_supply

9
src/nft/components/explore/CarouselCard.tsx
View File

@ -227,12 +227,15 @@ export const CarouselCard = ({ collection, onClick }: CarouselCardProps) => {
const marketplace = gqlCollection.marketplaceCount?.find(
(marketplace) => marketplace.marketplace === market
)
if (!marketplace) {
return null
}
return (
<MarketplaceRow
key={'trendingCollection' + collection.address}
key={`CarouselCard-key-${collection.address}-${marketplace.marketplace}`}
marketplace={MARKETS_ENUM_TO_NAME[market]}
listings={marketplace?.count?.toString()}
floor={marketplace?.floorPrice?.toString()}
listings={marketplace.count.toString()}
floor={marketplace.floorPrice.toString()}
/>
)
})}