package com.suno.android.ui.screens.hooks.overlay.capsule import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.offset import androidx.compose.foundation.layout.padding import androidx.compose.foundation.layout.size import androidx.compose.foundation.text.InlineTextContent import androidx.compose.foundation.text.appendInlineContent import androidx.compose.material3.Icon import androidx.compose.material3.Text import androidx.compose.runtime.Composable import androidx.compose.runtime.remember import androidx.compose.ui.Modifier import androidx.compose.ui.graphics.Color import androidx.compose.ui.graphics.vector.ImageVector import androidx.compose.ui.res.stringResource import androidx.compose.ui.res.vectorResource import androidx.compose.ui.text.Placeholder import androidx.compose.ui.text.PlaceholderVerticalAlign import androidx.compose.ui.text.SpanStyle import androidx.compose.ui.text.buildAnnotatedString import androidx.compose.ui.text.style.TextOverflow import androidx.compose.ui.text.withStyle import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.sp import com.suno.android.common_ui.R import com.suno.android.common_ui.extensions.xAsFormattedCount import com.suno.android.common_ui.theme.ExtendedTheme import com.suno.android.common_res.R as CommonResR private val SubtextColor = Color.White.copy(alpha = 0.5f) @Composable fun SongInfo( title: String, artist: String, playCount: Int, modifier: Modifier = Modifier, ) { Column( modifier = modifier.padding(vertical = 2.dp), ) { Text( text = title, style = ExtendedTheme.typography.smallPlayerTitle, color = Color.White, maxLines = 1, overflow = TextOverflow.Ellipsis, ) Subtext( playCount = playCount, artist = artist, ) } } @Composable private fun Subtext( playCount: Int, artist: String, ) { val formattedPlayCount = remember(playCount) { playCount.xAsFormattedCount() } Text( text = buildAnnotatedString { withStyle(SpanStyle(color = SubtextColor)) { appendInlineContent("play_icon") append(formattedPlayCount) append(" • ") append(artist) } }, style = ExtendedTheme.typography.smallBody, maxLines = 1, overflow = TextOverflow.Ellipsis, modifier = Modifier.offset(x = (-4).dp), inlineContent = mapOf( "play_icon" to InlineTextContent( placeholder = Placeholder( width = 18.sp, height = 18.sp, placeholderVerticalAlign = PlaceholderVerticalAlign.Center, ), ) { Icon( imageVector = ImageVector.vectorResource(id = R.drawable.play), contentDescription = stringResource(CommonResR.string.play_count), tint = SubtextColor, modifier = Modifier.size(18.dp), ) }, ), ) }