End of Year: Number of listened podcasts/episodes story design

[ashiagr]

📘 Project: #410

iOS PR: Automattic/pocket-casts-ios#454

Description

Add the design for the "number of podcasts/episodes listened" story.

The podcasts cover displayed is determined by getting the top 10 podcasts and reversing it. We then display the last 6 available.

Testing Instructions

1. Set END_OF_YEAR_ENABLED feature flag to true in base.gradle
2. Run the app and make sure you're logged in to an account with a few items on Listening History
3. When the prompt appears, tap "View My 2022"
4. Navigate to the 5th story
5. ✅ Check the design

Screenshots or Screencast

Phone (Pixel 6)	Tablet (Nexus 7 - 2012)

Checklist

• If this is a user-facing change, I have added an entry in CHANGELOG.md
• I have considered whether it makes sense to add tests for my changes
• All strings that need to be localized are in modules/services/localization/src/main/res/values/strings.xml
• Any jetpack compose components I added or changed are covered by compose previews

I have tested any UI changes...

• with different themes
• with a landscape orientation
• with the device set to have a large display and font size
• for accessibility with TalkBack

[geekygecko]

This worked really well! Amazing work.

My only comment would be that the text might look better with the same line breaks as the design, rather than just letting the width do it.

[ashiagr]

I added the line break feedback to the backlog. As discussed, I'll take it up later.

[mchowning]

My only comment would be that the text might look better with the same line breaks as the design, rather than just letting the width do it.

I wonder how line breaks will look in other languages though. 🤔 I always try to avoid line breaks for that reason, but maybe they don't cause problems in reality.