Plugin Directory: Try using core Gallery & Image blocks for screenshots

[ryelle]

This switches the plugin directory's screenshot section to use a pattern with core blocks instead of the shortcode. It loads the screenshots as Image blocks inside a Gallery instead of the React screenshot UI. This removes the React dependency from the page, so it's no longer necessary to load all of that JS, saving about 140KB.

I'm not sure this is merge-able as-is since it does look very different than the current UI, but I saw the ticket and wanted to give it a shot.

Fixes https://meta.trac.wordpress.org/ticket/8083

Notes

• I did not remove any code in this PR, but the React screenshots and [wporg-plugins-screenshots] code can be removed before merging (I don't think they're used anywhere else).
• This relies on a small style fix in Gallery block: Remove blur from captioned images in galleries wporg-parent-2021#178, which I'll probably merge shortly.

Screenshots

This uses the default layout of a 3-column gallery, which is pretty divergent from the current slideshow style of images, especially when they have captions. As for captions, they're visible on all images now, but they do not show up in the lightbox (see WordPress/gutenberg#60469).

Before	After

[dd32]

❤️

I was thinking about this, and whether there's any routinely maintained gallery block plugin that implements a slider-type we currently have.

I then queried the number of screenshots plugins had, and found multiple with over 100 screenshots 🤯
Optimizing for plugins with less than 10 though makes sense, based on the number of plugins that have more than that.

Here's that data:

Screenshots	Count	As a percent
40+	25	0.0%
30-39	34	0.1%
20-29	187	0.3%
19	46	0.1%
18	67	0.1%
17	71	0.1%
16	108	0.2%
15	139	0.2%
14	201	0.3%
13	196	0.3%
12	327	0.5%
11	329	0.5%
10	519	0.9%
9	772	1.3%
8	1,041	1.7%
7	1,523	2.5%
6	2,270	3.8%
5	3,168	5.3%
4	4,699	7.8%
3	6,794	11.3%
2	8,306	13.8%
1	7,340	12.2%
0	22,172	36.7%

[dd32]

Optimizing for plugins with less than 10 though makes sense, based on the number of plugins that have more than that.

As a followup to this, I would suggest the overall height of the section is limited to ~3 rows of screenshots or an absolute arbitrary pixel count, with the rest hidden behind a expand / see more type selector.

[dd32]

This would also fix https://meta.trac.wordpress.org/ticket/2273 and render #67 obsolete.