diff --git a/packages/mobile/src/components/details-tile/DetailsTile.tsx b/packages/mobile/src/components/details-tile/DetailsTile.tsx index 7bd8c96a9bc..1ec41a10704 100644 --- a/packages/mobile/src/components/details-tile/DetailsTile.tsx +++ b/packages/mobile/src/components/details-tile/DetailsTile.tsx @@ -377,12 +377,14 @@ export const DetailsTile = ({ ) : null} {!isPublished ? null : ( )} {description ? ( diff --git a/packages/mobile/src/components/details-tile/DetailsTileStats.tsx b/packages/mobile/src/components/details-tile/DetailsTileStats.tsx index 52c23960a7e..4b84daf0d23 100644 --- a/packages/mobile/src/components/details-tile/DetailsTileStats.tsx +++ b/packages/mobile/src/components/details-tile/DetailsTileStats.tsx @@ -1,19 +1,20 @@ +import { pluralize } from '@audius/common/utils' + import { Flex, IconHeart, IconPlay, IconRepost } from '@audius/harmony-native' import type { GestureResponderHandler } from 'app/types/gesture' import { DetailsTileStat } from './DetailsStat' const messages = { - plays: 'Plays', - favorites: 'Favorites', - reposts: 'Reposts' + favorites: (count: number) => `${pluralize('Favorite', count)}`, + reposts: (count: number) => `${pluralize('Repost', count)}` } type DetailsTileStatsProps = { playCount?: number repostCount?: number favoriteCount?: number - hidePlayCount?: number + hidePlayCount?: boolean hideRepostCount?: boolean hideFavoriteCount?: boolean onPressFavorites?: GestureResponderHandler @@ -24,21 +25,15 @@ type DetailsTileStatsProps = { * The stats displayed on track and playlist screens */ export const DetailsTileStats = ({ - playCount, - repostCount, - favoriteCount, + playCount = 0, + repostCount = 0, + favoriteCount = 0, hidePlayCount, hideRepostCount, hideFavoriteCount, onPressFavorites, onPressReposts }: DetailsTileStatsProps) => { - if ( - (hideFavoriteCount && hideRepostCount && hidePlayCount) || - (!favoriteCount && !repostCount && !playCount) - ) { - return null - } return ( {hidePlayCount ? null : ( - + )} {hideRepostCount ? null : ( )} {hideFavoriteCount ? null : ( )} diff --git a/packages/mobile/src/components/details-tile/MetadataItem.tsx b/packages/mobile/src/components/details-tile/MetadataItem.tsx index 25fed3efa3d..736cd71668a 100644 --- a/packages/mobile/src/components/details-tile/MetadataItem.tsx +++ b/packages/mobile/src/components/details-tile/MetadataItem.tsx @@ -9,7 +9,9 @@ type MetadataItemProps = PropsWithChildren<{ export const MetadataItem = ({ label, children }: MetadataItemProps) => { return ( - {label} + + {label} + {children} diff --git a/packages/mobile/src/screens/track-screen/TrackScreenDetailsTile.tsx b/packages/mobile/src/screens/track-screen/TrackScreenDetailsTile.tsx index 3a1294ced8e..3fdf5a6f474 100644 --- a/packages/mobile/src/screens/track-screen/TrackScreenDetailsTile.tsx +++ b/packages/mobile/src/screens/track-screen/TrackScreenDetailsTile.tsx @@ -314,9 +314,13 @@ export const TrackScreenDetailsTile = ({ hideRepost={hideRepost} hideShare={isUnlisted && !isOwner} hideOverflow={!isReachable || (isUnlisted && !isOwner)} - hideFavoriteCount={isUnlisted} - hidePlayCount={(!isOwner && isUnlisted) || isStreamGated} - hideRepostCount={isUnlisted} + hideFavoriteCount={isUnlisted || (!isOwner && (save_count ?? 0) <= 0)} + hidePlayCount={ + (!isOwner && isUnlisted) || + isStreamGated || + (!isOwner && (play_count ?? 0) <= 0) + } + hideRepostCount={isUnlisted || (!isOwner && (repost_count ?? 0) <= 0)} isPlaying={isPlaying && isPlayingId} isPreviewing={isPreviewing} isUnlisted={isUnlisted}