Page MenuHomePhabricator

[M] Article introduction view for Image Recs
Open, MediumPublic

Description

Create the article introduction portion of the suggested image task view, according to Figma

We can try and repurpose some of the work done for Alt Text suggested edits on the branch T347121/prototype

Screenshot 2024-02-06 at 19.13.18.png (374×418 px, 34 KB)

Items:

  • Create UI
  • Create view model
Testing

Please test in TestFlight Wikipedia app 7.5.0 (3509).

Event Timeline

Mazevedo renamed this task from [Task] CArticle introduction view for Image Recs to [Task] Article introduction view for Image Recs.Feb 6 2024, 10:18 PM
Mazevedo updated the task description. (Show Details)
Seddon renamed this task from [Task] Article introduction view for Image Recs to [M] Article introduction view for Image Recs.Feb 13 2024, 6:32 PM

Estimation notes:

We aren't estimating tapping to go to article or providing the real data. This is only for building out the view.

Some potential complexity is multilingual support.

Another concern is the text formatting - currently with our Components system, we do not yet have support for bold, superscript, and link formatting in a label like this. The alt-text prototype in T347121/prototype does not use formatting for this body text. We would need to figure that out if this formatting is a must-have.

JTannerWMF triaged this task as Medium priority.Feb 13 2024, 9:00 PM

PR for html > AttributedString styling: https://github.com/wikimedia/wikipedia-ios/pull/4759

I will continue to keep this in Doing while I stack on more PRs for this task.

PR for UI - https://github.com/wikimedia/wikipedia-ios/pull/4762

Note I think we may be using the wrong API call, because I can get EN image recommendations on Android, but our calls do not work for EN. For now the data works well enough for Design review.

@OTichonova This will be in Experimental Build #86 for design review.

  1. Launch app, add FR Wikipedia as a primary language.
  2. Tap Notifications Center bell icon (this is a temporary entry point)
  3. Confirm article intro view looks okay.

We aren't estimating tapping to go to article or providing the real data. This is only for building out the view.

I strayed from this. Providing the real data was done in PR #2 (my interpretation of the view model checkbox) and tapping to go to article was done in PR #3 (this was just a few lines of code). I'll make sure this work isn't represented elsewhere in the task breakdown doc.

Hi @Tsevener, per todays meeting.

  • Add left/right padding for iPad.

Thanks!

@Tsevener I merged the PRs so I could integrate with the bottom sheet, I can tackle the design review note from Olga if you'd like

Hi @Mazevedo, per our conversation the article summary doesn't yet support RTL.

Hi @Mazevedo, per our conversation the article summary doesn't yet support RTL.

@OTichonova
Yes, on it! I'll let you know when we have a new test build

Hi @Mazevedo, I noticed that when the device language is set to a LTR language (eg. EN) but the article summary is a RTL language the summary text has LTR orientation rather than RTL.

Group 20.png (667×632 px, 63 KB)

@OTichonova How do these screenshots look? We made some tweaks to the Explore card PR to propagate RTL wiki states.

LTR device language, LTR wiki language:

Screenshot 2024-03-19 at 10.36.56 AM (1×559 px, 217 KB)

LTR device language, RTL wiki language:

Screenshot 2024-03-19 at 10.36.34 AM (1×559 px, 202 KB)

RTL device language, RTL wiki language:

Screenshot 2024-03-19 at 10.35.31 AM (1×559 px, 260 KB)