diff --git a/packages/mobile/src/components/lineup-tile/LineupTile.tsx b/packages/mobile/src/components/lineup-tile/LineupTile.tsx
index 1c4e565b2fb..1aedf9081e0 100644
--- a/packages/mobile/src/components/lineup-tile/LineupTile.tsx
+++ b/packages/mobile/src/components/lineup-tile/LineupTile.tsx
@@ -148,26 +148,28 @@ export const LineupTile = ({
{children}
-
+ {isReadonly ? null : (
+
+ )}
)
}
diff --git a/packages/mobile/src/components/lineup-tile/LineupTileStats.tsx b/packages/mobile/src/components/lineup-tile/LineupTileStats.tsx
index efdd17e97b9..67c0c0c390b 100644
--- a/packages/mobile/src/components/lineup-tile/LineupTileStats.tsx
+++ b/packages/mobile/src/components/lineup-tile/LineupTileStats.tsx
@@ -4,7 +4,8 @@ import { isContentUSDCPurchaseGated } from '@audius/common/models'
import type { FavoriteType, ID, AccessConditions } from '@audius/common/models'
import {
repostsUserListActions,
- favoritesUserListActions
+ favoritesUserListActions,
+ PurchaseableContentType
} from '@audius/common/store'
import type { RepostType } from '@audius/common/store'
import { dayjs, formatCount } from '@audius/common/utils'
@@ -28,6 +29,7 @@ import { makeStyles, flexRowCentered } from 'app/styles'
import { spacing } from 'app/styles/spacing'
import { useThemeColors } from 'app/utils/theme'
+import { LineupTileAccessStatus } from './LineupTileAccessStatus'
import { LineupTileGatedContentTypeTag } from './LineupTilePremiumContentTypeTag'
import { LineupTileRankIcon } from './LineupTileRankIcon'
import { useStyles as useTrackTileStyles } from './styles'
@@ -139,6 +141,7 @@ export const LineupTileStats = ({
const navigation = useNavigation()
const hasEngagement = Boolean(repostCount || saveCount)
+ const isPurchase = isContentUSDCPurchaseGated(streamConditions)
const handlePressFavorites = useCallback(() => {
dispatch(setFavorite(id, favoriteType))
@@ -158,6 +161,41 @@ export const LineupTileStats = ({
const isReadonly = variant === 'readonly'
const isScheduledRelease = isUnlisted && moment(releaseDate).isAfter(moment())
+
+ const renderLockedContentOrPlayCount = () => {
+ if (streamConditions && !isOwner) {
+ if (isPurchase) {
+ return (
+
+ )
+ }
+ return (
+
+ )
+ }
+
+ return (
+ !hidePlays &&
+ playCount !== undefined &&
+ playCount > 0 && (
+
+ {formatPlayCount(playCount)}
+
+ )
+ )
+ }
+
return (
@@ -259,18 +297,7 @@ export const LineupTileStats = ({
) : null}
- {streamConditions && !isOwner ? (
-
- ) : !hidePlays ? (
-
- {formatPlayCount(playCount)}
-
- ) : null}
+ {renderLockedContentOrPlayCount()}
)
}
diff --git a/packages/web/src/components/track/desktop/TrackTile.tsx b/packages/web/src/components/track/desktop/TrackTile.tsx
index 9673fc24fd7..9f69216b1d2 100644
--- a/packages/web/src/components/track/desktop/TrackTile.tsx
+++ b/packages/web/src/components/track/desktop/TrackTile.tsx
@@ -77,7 +77,7 @@ const RankAndIndexIndicator = ({
)
}
-const renderLockedOrPlaysContent = ({
+const renderLockedContentOrPlayCount = ({
hasStreamAccess,
fieldVisibility,
isOwner,
@@ -366,7 +366,7 @@ const TrackTile = ({
{!isLoading
- ? renderLockedOrPlaysContent({
+ ? renderLockedContentOrPlayCount({
hasStreamAccess,
fieldVisibility,
isOwner,
diff --git a/packages/web/src/components/track/mobile/TrackTile.tsx b/packages/web/src/components/track/mobile/TrackTile.tsx
index 9c8c079a8df..8ba1251c896 100644
--- a/packages/web/src/components/track/mobile/TrackTile.tsx
+++ b/packages/web/src/components/track/mobile/TrackTile.tsx
@@ -86,7 +86,7 @@ type LockedOrPlaysContentProps = Pick<
onClickGatedUnlockPill: (e: MouseEvent) => void
}
-const renderLockedOrPlaysContent = ({
+const renderLockedContentOrPlayCount = ({
hasStreamAccess,
fieldVisibility,
isOwner,
@@ -477,7 +477,7 @@ const TrackTile = (props: CombinedProps) => {
className={cn(styles.bottomRight, fadeIn)}
>
{!isLoading
- ? renderLockedOrPlaysContent({
+ ? renderLockedContentOrPlayCount({
hasStreamAccess,
fieldVisibility,
isOwner,