[website] Introduce a Personal Playground mode

[akirk]

Based on #3152.

Motivation for the change, related issues

Adds a persistent personalwp deployment mode where WordPress sites are stored in OPFS and survive browser sessions.

To avoid conflicts with other (earlier) uses of persistent across the code base.

Implementation details

• virtual:website-defaults Vite plugin for build-time configuration (defaultStorageType, personalWPSiteSlug, defaultBlueprintUrl)
• PersonalWPBrowserChrome and PersonalWPOverlay components (lazy-loaded to avoid bundling in playground.wordpress.net)
• lastUrl tracking in site metadata to restore user position on return
• Auto-login when returning to a PersonalWP site
• URL blueprint support: URL params like ?plugin=friends or ?blueprint-url=data:... are applied to existing sites, then URL is cleared
• Dual dev servers: port 5400 (temporary) and port 5401 (personalwp)
• Parametrized bootSiteClient() with clearUrlAfterBlueprintApplied and autoLogin options

Screenshot

The new overlay:

Testing Instructions (or ideally a Blueprint)

1. Run npm run dev (starts both servers)
2. Visit http://127.0.0.1:5401/website-server/ for PersonalWP mode
3. Navigate somewhere in wp-admin, close the tab, reopen - you should return to the same page, logged in
4. Visit with ?plugin=friends - the plugin should be installed on the existing site, URL params cleared after
5. "Start over" button should delete the site and reload fresh

[adamziel]

How could we do code splitting here to avoid adding these components into playground.wordpress.net build.js bundle?

[akirk]

I added a React.lazy and verified that the PersonalWP components are in a separate lazy-loaded chunk:

# Fresh production build, checking for PersonalWP-specific content ("Start over" button text)

$ grep -l "Start over" dist/packages/playground/website/assets/*.js
index-CxgH81pX.js   # Lazy chunk only

$ grep -c "Start over" dist/packages/playground/website/assets/main-*.js
0   #  Not in main bundle

[adamziel]

Thanks! We also need to consider the impact on packages/vite-extensions/vite-list-assets-required-for-offline-mode.ts. The offline mode won't work until all those files are cached so we don't want to put the PersonalWP assets on the core Playground offline assets list.

We roughly have two possible solutions here:

1. Output a separate list of required assets for Playground and PersonalWP. This is ideal but might not be easy and maybe shouldn't block this work.
2. Break the offline mode support in PersonalWP for the time being, and exclude PersonalWP bundle files from the list of required assets. We could do that by storing them in, say, dist/packages/playground/website/assets/personalwp/ and adding that as a regexp to packages/vite-extensions/vite-list-assets-required-for-offline-mode.ts.

A third option, that would take care of 1 and 2 but would also make the maintenance more annoying, would be to just copy the entire website package as personal-wp and duplicate everything. It has its own upsides and downsides, but would solve for this particular problem.

[adamziel]

This if is pretty generic. It looks a bit as if Playground had a concept of defaultStorageType that it does not have. When it does, the implementation may differ. Let's disambiguate the naming here and just say if (insidePersonalWp) { or something to that effect that tells us directly "ah, this is another app and it does things a bit differently".