New Page Layout Picker: rename "templates" to "page patterns"

[p-jackson]

Changes proposed in this Pull Request

• Refactor JS so the "templates" concept is instead called "patterns" or "page patterns" in the code
• Leave PHP and API as is. We will need to change this more carefully so that it can be deployed without fatals (given the deployment process for ETK has changed recently)
• Update e2e page objects with new CSS selectors

Initially proposed here (#49661 (review)) when we refactored the modal into it's own package. The word "template" has become very overloaded. The things chosen by the new page modal are really more like "patterns" (i.e. the pattern inserter in core Gutenberg), except they're for a whole page. Hence "Page Patterns".

I also considered calling the package @automattic/new-page-modal, since it's the modal that appears when creating a new page. But that's just what we happen to use it for now. Since it's a package it could be used anywhere one needed to select a page pattern.

FYI @noahtallen

Testing instructions

• e2e tests pass (selectors have changed)
• apply diff to sandbox and smoke test the feature still works
• verify that no changes have been made to the API (i.e. the starterPageTemplatesConfig global) and that it won't cause fatals when deploying

Related to #50363

[matticbot]

Test live: https://calypso.live/?branch=update/rename-page-pattern-modal

[matticbot]

This PR does not affect the size of JS and CSS bundles shipped to the user's browser.

Generated by performance advisor bot at iscalypsofastyet.com.

[noahtallen]

Cool! Taking a quick look at the build log for ETK, I see the changed files look pretty safe:

(Link to the lines in the build output)

It looks like from the perspective of the build artifact, only one JS file has changed, and that wouldn't be an asset file anyways, so it should be safe to go

[roo2]

Tested this and it all LGTM 👍
I think it would also make sense to update the naming in the starter-page-templates subproject of the ETK in this PR, we still use templates in there.
But that's up to you

🚢 once the modal itself is deployed and rebased ✅

[p-jackson]

Thanks @roo2 👍

I think it would also make sense to update the naming in the starter-page-templates subproject of the ETK in this PR, we still use templates in there.

Definitely want to rename this, but we're just going to have to have a think how to do this with the new deployment process. We'll need to have one PR that adds a copy of the files with a new name, and then another PR that removes the old files. And perhaps temporarily the JS will need to be able to deal with either starterPageTemplatesConfig.templates or starterPageTemplatesConfig.pagePatterns. This is because during deployment there could be a window where the old JS is being served by the new PHP, or the new JS has been served up by the old PHP.

[p-jackson]

I believe e2e tests are failing because the I've changed some test selectors to use the new classname. However because this is a change to the ETK build, the calypso e2e tests are still being run against the production version of ETK. This should be fixed once this PR merges and the new ETK build is released.

[creativecoder]

👋🏼 Wanted to let you know that this rename broke the from_template_selector property in our tracking events. PR, for more context: #53640

I humbly recommend a more thorough code search in the future to catch any consumers of the existing hook 🙂

[p-jackson]

Sorry about that! I did search for usage but clearly I wasn't thorough enough (I don't know how I missed it given the usage in wpcom-block-editor is in the same repo 🤦‍♂️). Losing 3 months worth of that prop is frustrating.