[heydemoura]

Second half of the All Playlists work, stacked on the playlist index PR (see "Stack" below). Implements the block per the design's sections 2a–2d (sidebar settings, gallery, list with "Load more", edge states).

Stack

1. VideoPress: add a site-wide playlist index option #52729 — playlist index option and playlist block settings (base of this PR; the diff here shrinks to the block once it merges)
2. This PR: the All Playlists block

Proposed changes

• New videopress/all-playlists block ("All Playlists"), a Query Loop-style block that lists every Video Playlist published on the site, read from the videopress_playlist_index option. Server rendered by All_Playlists_Block::render(); the editor canvas shows the same markup through core's block-renderer endpoint.
• Sidebar (2a): Display with Gallery/List, a Columns slider (gallery only, 1–6), Playlists per page (1–48) and Order by (newest first, oldest first, title A–Z); Show on each playlist toggles for Description and Video count; Pagination radio between numbered pages and a "Load more" button.
• Gallery (2b): a "Playlists" heading with the playlist count, a CSS grid of cards with the stacked-deck poster, the "≡ N videos" badge, title and a two-line-clamped description, and centred ← Previous / 1 2 3 / Next → links driven by a playlists-page query argument.
• List (2c): rows with a 240px poster, title, description and a "View full playlist →" link to the post the playlist lives in. With "Load more" pagination every card is rendered and the later pages start hidden; the view script reveals them, updates "Showing X of N" and drops the button when nothing is left.
• Edge states (2d): a shimmer skeleton while the canvas loads, a "No poster available" frame plus "First video is private or was deleted." note when the first video's poster cannot be fetched, and a dashed "No playlists yet" box in the editor when the index is empty (the front end renders nothing).
• Posters are resolved on the front end from each playlist's first VideoPress video, through the same live-metadata lookup the Video Playlist block uses (moved into playlist/fetch-live-metadata.ts so both view scripts share it, with the token retry for private videos).
• Ordering by date uses the source post's publish date; playlists whose post is gone are listed last, without a link.
• Editable heading. The "Playlists" title is a core Heading inner block (locked to one heading, no appender), so it is edited in place and takes every Heading option: level H1–H6, font family, size and appearance, text and background colors. The saved heading renders in the header on the front end; content saved before this keeps a plain <h2> fallback.
• Block-level styles. The block declares color (text, background, gradients, link) and typography (family, size, appearance, line height, letter spacing, text transform) supports, so the Styles tab styles the whole block. Muted text, rules, the poster deck and the current page tint derive from the block's text color (through color-mix, with the light-theme values as the fallback), so a dark background stays legible.
• Block styles reach every text element. Theme rules that target h2/h3 beat inheritance from the block wrapper, so font family, size, style, weight, line height, letter spacing, text transform, decoration and text color set in the block's Styles tab are also forwarded as --vpap-* custom properties (with a has-vpap-<property> class per setting) and applied to the playlist titles and the header heading. Only properties the block actually sets are forwarded, so the theme still styles the headings otherwise. The header Heading block's own settings still win, since WordPress writes them inline or with !important. Values are limited to presets and plain CSS values in both the PHP render and the editor.
• Card titles follow the theme and the block. The <h3> playlist titles carry no typography of their own any more, so the theme's heading styles (family, weight, size, line height) and the block's Styles settings apply to them; the rest of the card text is sized in em, so a block font size scales descriptions, badges and pagination with it.
• Posters in the editor. The canvas hydrates each card's poster itself (the view script never runs there), through the shared hydrate-poster.ts.
• The block registers only once the Video Playlist block has, in the package initializer and in the Jetpack plugin's VideoPress extension (guarded with method_exists() as usual).

Screenshots

Rendered through the real callback with the built assets; posters are stand-ins, and the "Glaze Chemistry" card has a first video the lookup refuses.

Gallery, numbered pages · List, "Load more"	After "Load more"	Mobile

With a custom heading block (H3, italic, custom color) and block-level text/background colors from the Styles tab:

Related product discussion/links

• Base PR: VideoPress: add a site-wide playlist index option #52729 (playlist index option).
• Sync: sync the videopress_playlist_index option #52728 syncs the option to WordPress.com.
• Design: "WordPress video playlist block mockups", turn 2 (2a–2d).

Does this pull request change what data or activity we track or use?

No.

Testing instructions

Automated:

• jp test php packages/videopress (All_Playlists_Block_Test: settings normalization, cards, toggles, ordering, both paginations, forwarded block styles), jp test js packages/videopress (registration, sidebar, preview states, the view script's posters and "Load more"), jp phan packages/videopress, pnpm run typecheck, PHPCS, ESLint and Stylelint on the touched files all pass locally. The Jetpack plugin's VideoPress_Video_Extension_Test was not run locally; CI covers it.

Manual (a site with VideoPress active and the package built with jp build packages/videopress):

1. Publish a few posts with a Video Playlist block, each with a title and description (the base PR's Playlist details panel).
2. Insert an All Playlists block in a page. The canvas shows the gallery with posters loading from the first video of each playlist; the sidebar has Display, Show on each playlist and Pagination panels.
3. Switch Show playlists as to List, change Columns, Playlists per page and Order by, and toggle Description and Video count: the canvas re-renders each time.
4. Click the "Playlists" heading in the canvas: it is a Heading block. Change its level, font, color and background from its toolbar and sidebar; save and confirm the front end shows the same heading.
5. Select the All Playlists block, open the Styles tab and set a background, text color and font family: the whole block follows, on the canvas and on the front end.
   Set a font family, style, weight and text color on the All Playlists block: the playlist titles, descriptions and the "Playlists" heading all change. Then give the heading block its own font or color: the heading keeps its own, the rest of the block keeps the block's.
   The playlist titles use the theme's heading styles; change the theme's heading font or the block's font family and size and confirm the titles and card text follow.
6. The cards' posters load in the canvas, not only on the front end.
7. Publish with numbered pages and a per-page count smaller than the number of playlists: the front end shows the first page and the ← Previous / 1 2 / Next → links, and ?playlists-page=2 shows the rest.
8. Switch to the "Load more" button: the front end shows the first page, "Showing X of N", and the button reveals the next page until it disappears.
9. Make a playlist's first video private (or point it at a deleted GUID): its card shows "No poster available" and the note under the description.
10. Unpublish every playlist post: the editor shows "No playlists yet" and the front end renders nothing.

🤖 Generated with Claude Code

[github-actions]

Are you an Automattician? Please test your changes on all WordPress.com environments to help mitigate accidental explosions.

• To test on WoA, go to the Plugins menu on a WoA dev site. Click on the "Upload" button and follow the upgrade flow to be able to upload, install, and activate the Jetpack Beta plugin. Once the plugin is active, go to Jetpack > Jetpack Beta, select your plugin (Jetpack), and enable the add/videopress-all-playlists-block branch.
• To test on Simple, run the following command on your sandbox:

bin/jetpack-downloader test jetpack add/videopress-all-playlists-block

Interested in more tips and information?

• In your local development environment, use the jetpack rsync command to sync your changes to a WoA dev blog.
• Read more about our development workflow here: PCYsg-eg0-p2
• Figure out when your changes will be shipped to customers here: PCYsg-eg5-p2

[github-actions]

Thank you for your PR!

When contributing to Jetpack, we have a few suggestions that can help us test and review your patch:

• ✅ Include a description of your PR changes.
  
• ✅ Add a "[Status]" label (In Progress, Needs Review, ...).
  
• ✅ Add testing instructions.
  
• ✅ Specify whether this PR includes any changes to data or privacy.
  
• ✅ Add changelog entries to affected projects
  

This comment will be updated as you work on your PR and make changes. If you think that some of those checks are not needed for your PR, please explain why you think so. Thanks for cooperation 🤖

---

Follow this PR Review Process:

1. Ensure all required checks appearing at the bottom of this PR are passing.
2. Make sure to test your changes on all platforms that it applies to. You're responsible for the quality of the code you ship.
3. You can use GitHub's Reviewers functionality to request a review.
4. When it's reviewed and merged, you will be pinged in Slack to deploy the changes to WordPress.com simple once the build is done.

If you have questions about anything, reach out in #jetpack-developers for guidance!

---

Jetpack plugin:

The Jetpack plugin has different release cadences depending on the platform:

• WordPress.com Simple releases happen as soon as you deploy your changes after merging this PR (PCYsg-Jjm-p2).
• WoA releases happen weekly.
• Releases to self-hosted sites happen monthly:
  • Scheduled release: October 6, 2026

If you have any questions about the release process, please ask in the #jetpack-releases channel on Slack.

---

Videopress plugin:

No scheduled milestone found for this plugin.

If you have any questions about the release process, please ask in the #jetpack-releases channel on Slack.

[jp-launch-control]

Code Coverage Summary

Coverage changed in 3 files.

File	Coverage	Δ%	Δ Uncovered
projects/plugins/jetpack/extensions/extended-blocks/videopress-video/videopress-video.php	12/26 (46.15%)	-3.85%	2 ❤️‍🩹
projects/packages/videopress/src/class-initializer.php	447/504 (88.69%)	-0.15%	1 ❤️‍🩹
projects/packages/videopress/src/client/block-editor/blocks/playlist/view.ts	82/83 (98.80%)	3.51%	-4 💚

9 files are newly checked for coverage. Only the first 5 are listed here.

File	Coverage
projects/packages/videopress/src/client/block-editor/blocks/playlist/fetch-live-metadata.ts	19/23 (82.61%) 💚
projects/packages/videopress/src/client/block-editor/blocks/all-playlists/edit.tsx	29/33 (87.88%) 💚
projects/packages/videopress/src/class-all-playlists-block.php	309/312 (99.04%) 💚
projects/packages/videopress/src/client/block-editor/blocks/all-playlists/block-style-vars.ts	25/25 (100.00%) 💚
projects/packages/videopress/src/client/block-editor/blocks/all-playlists/hydrate-poster.ts	11/11 (100.00%) 💚

Full summary · PHP report · JS report

_{Coverage check overridden by I don't care about code coverage for this PR Use this label to ignore the check for insufficient code coveage. .}

[heydemoura]

Stacked on #52729, so the coverage service has no baseline for this branch; adding the code-coverage opt-out label until the base merges and this PR retargets to trunk.