@OptIn(ExperimentalComposeUiApi::class) @Composable fun PocketSponsoredStory( story: PocketSponsoredStory, backgroundColor: Color, onStoryClick: (PocketSponsoredStory) -> Unit, ) { val (imageWidth, imageHeight) = with(LocalDensity.current) { 116.dp.toPx().roundToInt() to 84.dp.toPx().roundToInt() } val imageUrl = story.imageUrl.replace( "&resize=w[0-9]+-h[0-9]+".toRegex(), "&resize=w$imageWidth-h$imageHeight", ) ListItemTabSurface( imageUrl = imageUrl, backgroundColor = backgroundColor, onClick = { onStoryClick(story) }, ) { Text( text = story.title, modifier = Modifier.semantics { testTagsAsResourceId = true testTag = "pocket.sponsoredStory.title" }, color = FirefoxTheme.colors.textPrimary, overflow = TextOverflow.Ellipsis, maxLines = 2, style = FirefoxTheme.typography.body2, ) Spacer(Modifier.height(9.dp)) Text( text = stringResource(R.string.pocket_stories_sponsor_indication), modifier = Modifier.semantics { testTagsAsResourceId = true testTag = "pocket.sponsoredStory.identifier" }, color = FirefoxTheme.colors.textSecondary, overflow = TextOverflow.Ellipsis, maxLines = 1, style = FirefoxTheme.typography.caption, ) Spacer(Modifier.height(7.dp)) Text( text = story.sponsor, modifier = Modifier.semantics { testTagsAsResourceId = true testTag = "pocket.sponsoredStory.sponsor" }, color = FirefoxTheme.colors.textSecondary, overflow = TextOverflow.Ellipsis, maxLines = 1, style = FirefoxTheme.typography.caption, ) } }
Displays a single [PocketSponsoredStory].