Support the `blockTypes` and `viewport_width` props for remote patterns fetched from Pattern Directory

[ntsekouras]

We need to add the support for blockTypes and viewport_width props for remote patterns fetched from Pattern Directory. With this we can fetch remote patterns and use them properly as suggestions where needed.

The addition of block_types field in Pattern Directory API was made here: ​https://github.com/WordPress/pattern-directory/pull/111

GB PR: ​https://github.com/WordPress/gutenberg/pull/47677

Trac ticket: https://core.trac.wordpress.org/ticket/57611

We need to add the support for block_types and viewport_width props for remote patterns fetched from Pattern Directory.

With this support, we can fetch remote patterns and use them properly as suggestions where needed.

The addition of block_types field in Pattern Directory API was made here: ​https://github.com/WordPress/pattern-directory/pull/111

GB PR: ​https://github.com/WordPress/gutenberg/pull/47677

#### Before

​https://user-images.githubusercontent.com/16275880/216287451-cbadec15-3a7e-4461-bb8e-d3e8ea7f9aab.mov

#### After

​https://user-images.githubusercontent.com/16275880/216287480-253f724b-4605-4387-9796-8767cd0fa080.mov

## Testing Instructions

1. Insert a Heading block
2. Open the block switcher menu
3. Observe that there is a pattern suggested, coming from Pattern Directory

[hellofromTonya]

I'm hesitant to pull this Trac ticket into the 6.2 milestone without additional information.

Why?

The PR driving this Trac ticket, ​Gutenberg PR 47677, has has not yet gone through a Gutenberg release. It is targeted for GB 15.2. But GB 15.1.0 is currently in RC1 and has not yet been final released (targeted for next week).

​The PR it was extracted from has been open since May 21, 2021 (and is still open).

This means this PR is an unreleased enhancement.

The expectation for backports is that the code is well tested by going through at least one full Gutenberg release cycle before introducing into a Core major release.

Additional information needed:

• Why is this change needed for 6.2?
• What are the risks to users upgrading to 6.2?
• When will Gutenberg 15.2 be released?

[ntsekouras]

The PR driving this Trac ticket, Gutenberg PR 47677, has has not yet gone through a Gutenberg release. It is targeted for GB 15.2. But GB 15.1.0 is currently in RC1 and has not yet been final released (targeted for next week).

My understanding was that the specific PR will be part of 15.1 as an important one.

Why?

1. It's an existing big bug in GB because of the recent move of some patterns in PD(part of: ​https://github.com/WordPress/gutenberg/issues/46017). What happens there is the patterns are fetched, but not suggested in the respective block flows that use them. It's unfortunate that this was missed by everyone and only discovered yesterday as part of ​https://github.com/WordPress/gutenberg/issues/44140, where we need to add more core patterns.

2. Because Pattern Directory API sends this field for a while and we were just ignoring it. I don't see any risks with that. This field is used to suggest patterns with this prop in certain flows, like the creation/replace flow of Query Loop or Template Part blocks.
3. Currently many new patterns are fetched in GB/core from Pattern Directory for many reasons. For example:
   1. we don't need to bundle them and maintain them in core
   2. it's really easy to version them in PD with a minimum WP version without any changes needed in core files
   3. it's really easy to update them without any file changes

The PR it was extracted from has been open since May 21, 2021 (and is still open).

I closed that PR, as it was fixed in mine: ​https://github.com/WordPress/gutenberg/pull/47677. The original PR just slipped through the cracks because the focus for a while was add new patterns to fetch in GB, which didn't use/needed this property.

[ntsekouras]

I'm confirming that the GB PR will be part of 15.1 release. ​https://github.com/WordPress/gutenberg/compare/trunk...release/15.1

[ironprogrammer]

Testing Instructions

There are test instructions mirrored over from the PR, but adding these here for improved readability.

Steps to Test

1. Create a new post with a header block.
2. Open the pattern switcher.
3. Observe the switcher's dropdown.

Expected Results

• ✅ The heading block switcher displays a "Patterns" menu, with selectable headings to swap in.

[ironprogrammer]

Test Report

Patch tested: ​https://github.com/WordPress/wordpress-develop/pull/3967 👍🏻

Environment

• Hardware: MacBook Pro Apple M1 Pro
• OS: macOS 12.6.3
• Browser: Safari 16.3
• Server: nginx/1.23.3
• PHP: 7.4.33
• WordPress: 6.2-alpha-54642-src
• Theme: twentytwentythree v1.0

Actual Results

• ✅ Heading block switcher displayed a Patterns menu with a remote heading option to switch to.

Additional Information

• Based on the ​pattern directory API options ​described in the original Gutenberg PR, the only returned pattern suggestion has the expected meta.wpop_block_types value of core/heading (i.e. ​this pattern).
• To view a similar API call to verify the meta.wpop_block_types value, see: ​https://api.wordpress.org/patterns/1.0/?wp-version=6.2&pattern-keywords=11&locale=en_US&search=heading

Supplemental Artifacts

Figure 1: Contextual pattern suggestion in block switcher.

[hellofromTonya]

Thank you @ntsekouras for clarifying. Moving this ticket into 6.2.

[hellofromTonya]

PR approved and Test Report confirms it works. Ready for commit.

[flixos90]

In 55234:

Editor: Support the block_types and viewport_width props for remote patterns fetched from Pattern Directory.

Props ntsekouras, ironprogrammer, hellofromtonya, flixos90.
Fixes #57611.

Committed in https://core.trac.wordpress.org/changeset/55234.