[Blueprints] Export resolveBlueprintFromURL, applyQueryOverrides and parseBlueprint functions in the @wp-playground/blueprints package #2867
Conversation
…parseBlueprint functions in the @wp-playground/blueprints package
There was a problem hiding this comment.
Pull Request Overview
This PR refactors the codebase to consolidate base64 utilities and blueprint resolution logic by moving them from website-specific code into shared packages. The changes improve code reusability and better organize the codebase structure.
- Moved base64 encoding/decoding utilities from
packages/playground/websiteto@wp-playground/commonwith improved cross-environment support - Moved blueprint parsing and URL resolution logic from
packages/playground/websiteto@wp-playground/blueprints - Added comprehensive test coverage for the newly relocated functionality
Reviewed Changes
Copilot reviewed 14 out of 14 changed files in this pull request and generated no comments.
Show a summary per file
| File | Description |
|---|---|
| packages/playground/website/src/lib/base64.ts | Removed file - base64 utilities moved to @wp-playground/common |
| packages/playground/website/src/lib/state/url/router.ts | Removed parseBlueprint function and base64 import, now using blueprints package |
| packages/playground/website/src/components/site-manager/site-info-panel/index.tsx | Updated import to use encodeStringAsBase64 from @wp-playground/common |
| packages/playground/website/src/lib/state/redux/slice-sites.ts | Consolidated imports to use blueprint utilities from @wp-playground/blueprints |
| packages/playground/common/src/base64.ts | Added base64 utilities with Node.js/browser compatibility |
| packages/playground/common/src/index.ts | Exported base64 utilities |
| packages/playground/common/src/test/base64.spec.ts | Added comprehensive tests for base64 utilities |
| packages/playground/blueprints/src/lib/utils/parse-blueprint.ts | New file with parseBlueprint function and documentation |
| packages/playground/blueprints/src/lib/utils/parse-blueprint.spec.ts | Added tests for parseBlueprint function |
| packages/playground/blueprints/src/lib/resolve-blueprint-from-url.ts | Moved blueprint URL resolution logic from website package |
| packages/playground/blueprints/src/test/resolve-blueprint-from-url.spec.ts | Added comprehensive tests for URL resolution |
| packages/playground/blueprints/src/lib/apply-query-overrides.ts | Refactored to separate concerns and use dynamic imports |
| packages/playground/blueprints/src/test/apply-query-overrides.spec.ts | Added comprehensive tests for query overrides |
| packages/playground/blueprints/src/index.ts | Exported new blueprint utilities |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
|
What is the use-case for this? All these functions will either change or be removed to integrate Blueprints v2. In v2, all the logic runs in PHP. |
When using the Here's an example from Calypso where we want to support both JSON Blueprints and bundles, but need the ability to override some Blueprint arguments. Is there a better way to achieve this?
I don't want to export functions that we will plan to remove soon, but the use case I explained here also applies to Blueprints v2. Ideally, a developer should just update Playground packages to the latest version and get Blueprint v2 support alongside v1 support without doing any custom work in their project. |
Which ones? Query API can do it |
In my case, we need to set the PHP and WP versions. Also, we need to ensure that login and networking are true.
Exactly, but before this PR, the Query API was limited to the Playground Website, and now by exporting these functions, it can be used outside of the website. In my case, together with Sorry if I'm missing something obvious, but I don't think that there's a way to use the Query API together with |
Motivation for the change, related issues
In the past when we had only JSON Blueprints v1 it was easy download and customize a Blueprint with vanilla JS, but today we have Blueprints v1 and v2, JSON Blueprints, and bundles.
For a site that uses the
@wp-playground/clientpackage, there's currently no easy way to download a Blueprint and adjust it, but the Playground website has helper functions that enable the query API to fetch and override a Blueprint.This PR moves the
resolveBlueprintFromURL,applyQueryOverrides,parseBlueprintfunctions, and related types to the@wp-playground/blueprintspackage, so users can import and use these helper functions.We had to move the code out of the website package because it isn't public, while the Blueprint package is.
The PR also moves the base64 related helpers to
@wp-playground/commonas this seemed like a appropriate place for these helpers.Implementation details
apply-query-overrides.tsfrom the website package to the blueprints packageapply-query-overrides.tsandpesolve-blueprint-from-url.tsbase64.tsfrom the website package to the common packagedecodeBase64ToUint8ArrayandencodeUint8ArrayAsBase64Testing Instructions (or ideally a Blueprint)