I couldn't tell if it was a regression or not, if it was one it was from more than 2 months ago. I pushed a patch for it.

@mewoph I will rename the non-Homepage modules

In T296333#7536374, @Tgr wrote:

I think the easiest way to test it would be to use the SubpageImageRecommendationProvider with some random Ogg file of your choice.

It definitely has been. Thanks for this. I did some changes in the subpage providers to accept quality gates.

@MMiller_WMF could you point to some article which is returning video or audio files. I remember one task showing some OGG file recommendation but I can't find it now.

Not in the immediate priorities of the team. Moving it to Triaged. We're open to review any patches that may come in.

Apparently the imports to wikimedia-ui-base started causing some problems, see T296379: GrowthExperiments: Less_Exception_Parser: File `resources/lib/ooui/wikimedia-ui-base.less` not found. I pushed a possible solution like the one used in the MediaSearch extension. I agree on binging this to a retro to see which steps forward we can make to improve the current status.

In T296379#7529369, @kostajh wrote:

cc @Urbanecm_WMF, looks like this particular code was added in rEGREc49129b46b5e: Mentor dashboard: Add subheader style. Although, we have this @import 'resources/lib/ooui/wikimedia-ui-base.less'; statement all over our LESS files.

In T296427#7528476, @Tgr wrote:

@MMiller_WMF do you mean, filter out all invalid images and then use the first one? Or should the remaining images be ranked somehow? (How?)

@Tgr I updated the panels. Maybe we should add some documentation in the Chore list checklist. What's a reasonable upper bound for the API requests?

Also fixing the skeleton overflow in this patch

I added new a row Image recommendation service and created 3 panels in grafana dashboard based on existing ones. All feedback on the naming and metrics aggregation is welcome. @Tgr you mentioned a way to aggregate both get and processApiResponseData; On the rate panel I added a "total" aggregation but I'm not 100% sure how you were thinking of displaying this.

In T295720#7509537, @RHo wrote:

Hi @Sgs - unfortunately there is a different base font size for Desktop and Mobile web. I try to use standard 4px grid regardless of mobile and desktop so actually it's intended that mobile and desktop have the same 4px space between the checkbox form element and the machine suggestions label (you have to measure between the entire checkbox component and the machine suggestions below):

Mobile

Desktop

@RHo There are some differences on the font-size and line-height scales and the vertical margin between figma desktop spec and mobile spec.

Possible duplicate of https://phabricator.wikimedia.org/T291142. Should be fixed in OOUI 0.42.1 https://github.com/wikimedia/oojs-ui/commit/d69dbcc01996830e96dca5cac4d143eb577d477e

@kostajh Besides the call for the API get request ServiceImageRecommendationProvider::processApiResponseData is called from SubpageImageRecommendationProvider::createRecommendation (see code here). Do we need to track performance for this creation?

The copy content of the quick tips coming from T292092 includes several paragraphs in tips 1, 2 and 4. https://gerrit.wikimedia.org/r/736270 adds logic to be able to display n paragraphs with the same styles for a single tip with a limit of 3.

Thanks for the feedback @RHo, I pushed another patch to address both issues. You can check the demo here

In T292933#7454632, @RHo wrote:

Hi @Sgs - thanks for spinning this up for review. A couple of things:
i. the Desktop version of the help panel is different from expected on the selected and selected focus states:

Expected styling for selected (with "?" turning into the downwards chevron	Actual

Having said that, I am fine with this as a button instead of a toggle button if it will add substantial work to change the code.

The current implementation is using a standard ButtonWidget from OOUI not the ToggleButtonWidget so we have to handle the toggled state manually. Could be improved in the future but for now I think the behavior mimics well the toggle button.

@RHo I have created a patchdemo instance (https://patchdemo.wmflabs.org/wikis/f7c0c93022/w/) so the updated styles can be confirmed.

Thanks for the insights @mewoph

In T292933#7437138, @mewoph wrote:

Hi @Sgs, for the button from getHelpPanelCtaButton, unfortunately the attributes would have to be kept in sync manually with the new component (we have several of this pattern where PHP & JS attributes need to align). Right now when the button is returned in the initial HTML, it's infused by OO.ui.ButtonWidget so I think instead this can be infused by the new HelpPanelButton class.

@mewoph I extracted the help cta style and instantiation to a separate component (See 731349). I would need your input to clarify what to do with the getHelpPanelCtaButton in HelpPanel.php:30 since it also holds some button properties.

@RHo there's a slight divergence between the Figma designs and standard OOUI states (active and focus). Very slight difference in the icon color (active and focus) and the border/outline (active). We can add extra styles to match the designs. For the focus border I think it's worth since makes the tab navigation coherent.

@mewoph it totally makes sense. I will start taking the ButtonWidget code from HelpPanel to a separate component.