Skip to content

Conversation

@franky47
Copy link
Contributor

@franky47 franky47 commented Dec 15, 2025

Fixes an issue where previous themes would be stuck after switching items or base library.

There were a couple of issues:

  • The preview iframe was fed a URL containing stale search params (initialParams were never updated)
  • The useSyncExternalStore storage inside the iframe could opt out nuqs' state transitions out of concurrent mode (more of a performance thing than correctness).

The proposed refactor is to keep the iframe URL as the source of truth within it, and sync it to the host's URL from the outside:

  1. On initial load, the current search params from the hosts are passed to the iframe src, to avoid a flash of unthemed content. This is not made reactive on search params to avoid a full-frame load (flashing & loss of local state).
  2. When the host's search params change, they are forwarded to the iframe via postMessage. The iframe then applies those to its own internal URL, using nuqs (in shallow + replace mode) to benefit from the time-safety (URL throttling shared between host & iframe).

Note: some dead code was found and removed in the process:

  • use-canva.tsx
  • use-design-system.tsx (made redundant)

One thing I noticed while testing is that in production, pressing R to randomise emits two RSC requests (with identical search params aside from the _rsc marker), but only one in development.

Note: it also fixes an issue where pressing the Back button erased the ability to move forward. We can now use Back/Forward to time-travel navigate theme changes, allowing for A/B testing.

@vercel
Copy link
Contributor

vercel bot commented Dec 15, 2025

@franky47 is attempting to deploy a commit to the shadcn-pro Team on Vercel.

A member of the Team first needs to authorize it.

Comment on lines +7 to +10
type ParentToIframeMessage = {
type: "design-system-params"
data: DesignSystemSearchParams
}
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

note: More types can be added to this discriminated union for type-safe comms between the top level document and iframes.

@franky47 franky47 marked this pull request as ready for review December 15, 2025 22:21
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants