feat(website): host A2UI playground at /a2ui#2533
Conversation
|
📝 WalkthroughWalkthroughThis PR integrates the A2UI Playground build output into the website deployment pipeline by establishing asset prefixing, adjusting URL resolution from absolute to relative paths, and extending website navigation. The workflow builds A2UI dependencies and the playground with computed asset prefixes, then copies the dist output into the website build directory. ChangesA2UI Playground Integration
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~20 minutes Possibly related PRs
Suggested labels
Suggested reviewers
Poem
🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
Tip 💬 Introducing Slack Agent: Turn conversations into code.Slack Agent is built on CodeRabbit's deep understanding of your code, so your team can collaborate across the entire SDLC without losing context.
Built for teams:
One agent for your entire SDLC. Right inside Slack. 👉 Get your free trial and get 200 agent minutes per Slack user (a $50 value). Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Review rate limit: 7/8 reviews remaining, refill in 7 minutes and 30 seconds.Comment |
![github-advanced-security[bot]](https://avatars.githubusercontent.com/in/57789?s=60&v=4){kind=small}
Codecov Report✅ All modified and coverable lines are covered by tests. 📢 Thoughts on this report? Let us know! |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
packages/genui/a2ui-playground/src/pages/Dynamic.tsx (1)
83-90:⚠️ Potential issue | 🔴 CriticalCustom mode still uses
origin, breaking/a2uiURL resolution.
Preset mode usesbaseUrl, but custom mode still passesorigin, so it can generate the wrongrender.htmlpath in subpath deployments.🔧 Proposed fix
const url = buildRenderUrl( { protocol, demoUrl, messages: parsed, }, - origin, + baseUrl, );🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@packages/genui/a2ui-playground/src/pages/Dynamic.tsx` around lines 83 - 90, The custom mode is incorrectly passing origin into buildRenderUrl which breaks subpath deployments; in the URL construction where buildRenderUrl is called (the call that currently passes { protocol, demoUrl, messages: parsed } and origin), detect when custom mode is active and pass baseUrl (or a computed baseUrl fallback) instead of origin so render.html resolves under the app subpath; update the call site that references the origin variable to use baseUrl (or a fallback to origin only if baseUrl is undefined) so both preset and custom modes generate correct URLs.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Outside diff comments:
In `@packages/genui/a2ui-playground/src/pages/Dynamic.tsx`:
- Around line 83-90: The custom mode is incorrectly passing origin into
buildRenderUrl which breaks subpath deployments; in the URL construction where
buildRenderUrl is called (the call that currently passes { protocol, demoUrl,
messages: parsed } and origin), detect when custom mode is active and pass
baseUrl (or a computed baseUrl fallback) instead of origin so render.html
resolves under the app subpath; update the call site that references the origin
variable to use baseUrl (or a fallback to origin only if baseUrl is undefined)
so both preset and custom modes generate correct URLs.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
Run ID: a73940c3-55c2-4459-a30d-e44ca46a6f10
📒 Files selected for processing (8)
.github/workflows/workflow-website.ymlpackages/genui/a2ui-playground/rsbuild.config.tspackages/genui/a2ui-playground/src/pages/DemosPage.tsxpackages/genui/a2ui-playground/src/pages/Dynamic.tsxpackages/genui/a2ui-playground/src/pages/Static.tsxpackages/genui/a2ui-playground/src/utils/demoUrl.tspackages/genui/a2ui-playground/src/utils/renderUrl.tswebsite/rspress.config.ts
Similar to how the REPL is hosted at lynx-stack.dev/repl, this adds the A2UI playground as a standalone SPA at lynx-stack.dev/a2ui. Changes: - Add ASSET_PREFIX support and copyOnBuild for the www/ public dir - Fix URL construction to be base-path aware (use URL API instead of origin concatenation, relative demoUrl) - Add "A2UI" nav link to the website - Add CI workflow steps to build and deploy the playground
Huxpro
force-pushed
the
Huxpro/host-a2ui-playground
branch
from
73f8b8d to
d43a28a
Compare
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@packages/genui/a2ui-playground/src/pages/DemosPage.tsx`:
- Line 95: The baseUrl computed as window.location.href.replace(/#.*$/, '') can
lack a trailing slash and cause new URL('render.html', baseUrl) in
buildRenderUrl (and the usage at line 177) to resolve incorrectly; fix by
normalizing baseUrl to always end with '/' and memoize it with useMemo so you
only read window.location once per component render, then have buildRenderUrl
and the QR/iframe URL creation use this normalizedMemoized baseUrl.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
Run ID: 612cb420-e87b-4f86-826e-362cd3332da3
📒 Files selected for processing (5)
.github/workflows/workflow-website.ymlpackages/genui/a2ui-playground/rsbuild.config.tspackages/genui/a2ui-playground/src/pages/DemosPage.tsxpackages/genui/a2ui-playground/src/utils/demoUrl.tspackages/genui/a2ui-playground/src/utils/renderUrl.ts
✅ Files skipped from review due to trivial changes (4)
- packages/genui/a2ui-playground/src/utils/demoUrl.ts
- packages/genui/a2ui-playground/rsbuild.config.ts
- .github/workflows/workflow-website.yml
- packages/genui/a2ui-playground/src/utils/renderUrl.ts
| const [lynxDevCopied, setLynxDevCopied] = useState(false); | ||
|
|
||
| const origin = window.location.origin; | ||
| const baseUrl = window.location.href.replace(/#.*$/, ''); |
There was a problem hiding this comment.
baseUrl may lack a trailing slash, causing incorrect relative URL resolution.
new URL('render.html', baseUrl) (used at line 177 and inside buildRenderUrl) resolves render.html relative to the last slash in the base path. If the page is ever served at https://lynx-stack.dev/a2ui (no trailing slash), the URL API treats a2ui as a filename, strips it, and resolves to https://lynx-stack.dev/render.html instead of https://lynx-stack.dev/a2ui/render.html.
GitHub Pages typically redirects directory paths to the slash form, so this is low-probability — but it's a silent failure that produces a wrong QR code/iframe URL with no error. Pairing the fix with useMemo also avoids reading the DOM API on every render:
🛡️ Proposed fix — normalize trailing slash + memoize
- const baseUrl = window.location.href.replace(/#.*$/, '');
+ const baseUrl = useMemo(() => {
+ // Strip hash, then ensure the path ends with a slash so that
+ // new URL('render.html', baseUrl) always resolves into the same
+ // directory rather than replacing the last path segment.
+ const stripped = window.location.href.replace(/#.*$/, '');
+ const url = new URL(stripped);
+ if (!url.pathname.endsWith('/')) {
+ url.pathname = url.pathname.replace(/\/[^/]*$/, '/');
+ }
+ return url.toString();
+ }, []);🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.
In `@packages/genui/a2ui-playground/src/pages/DemosPage.tsx` at line 95, The
baseUrl computed as window.location.href.replace(/#.*$/, '') can lack a trailing
slash and cause new URL('render.html', baseUrl) in buildRenderUrl (and the usage
at line 177) to resolve incorrectly; fix by normalizing baseUrl to always end
with '/' and memoize it with useMemo so you only read window.location once per
component render, then have buildRenderUrl and the QR/iframe URL creation use
this normalizedMemoized baseUrl.
Merging this PR will improve performance by 18.85%
|
| Benchmark | BASE |
HEAD |
Efficiency | |
|---|---|---|---|---|
| ⚡ | 008-many-use-state-destroyBackground |
9.5 ms | 8 ms | +18.85% |
| ⚡ | transform 1000 view elements |
46.8 ms | 43 ms | +8.83% |
Comparing Huxpro:Huxpro/host-a2ui-playground (d43a28a) with main (7abb0a9)2
Footnotes
-
26 benchmarks were skipped, so the baseline results were used instead. If they were deleted from the codebase, click here and archive them to remove them from the performance reports. ↩
-
No successful run was found on
main(08aa667) during the generation of this report, so 7abb0a9 was used instead as the comparison base. There might be some changes unrelated to this pull request in this report. ↩
Web Explorer#9324 Bundle Size — 900.03KiB (0%).d43a28a(current) vs 7abb0a9 main#9309(baseline) Bundle metrics
|
| Current #9324 |
Baseline #9309 |
|
|---|---|---|
 Initial JS |
44.46KiB |
44.46KiB |
| Initial CSS |
2.22KiB |
2.22KiB |
| Cache Invalidation |
0% |
0% |
| Chunks |
9 |
9 |
| Assets |
11 |
11 |
 Modules |
228(-0.87%) |
230 |
| Duplicate Modules |
11 |
11 |
| Duplicate Code |
27.29%(+0.04%) |
27.28% |
| Packages |
10 |
10 |
| Duplicate Packages |
0 |
0 |
Bundle size by type no changes
| Current #9324 |
Baseline #9309 |
|
|---|---|---|
| JS |
495.9KiB |
495.9KiB |
| Other |
401.92KiB |
401.92KiB |
| CSS |
2.22KiB |
2.22KiB |
Bundle analysis report Branch Huxpro:Huxpro/host-a2ui-playgrou... Project dashboard
Generated by RelativeCI Documentation Report issue
React Example (Element Template)#19 Bundle Size — 198.61KiB (0%).d43a28a(current) vs 7abb0a9 main#4(baseline) Bundle metrics
|
| Current #19 |
Baseline #4 |
|
|---|---|---|
| Initial JS |
0B |
0B |
| Initial CSS |
0B |
0B |
| Cache Invalidation |
0% |
0% |
| Chunks |
0 |
0 |
| Assets |
4 |
4 |
| Modules |
79(-1.25%) |
80 |
| Duplicate Modules |
23 |
23 |
| Duplicate Code |
40.5%(-0.44%) |
40.68% |
| Packages |
2 |
2 |
| Duplicate Packages |
0 |
0 |
Bundle size by type no changes
| Current #19 |
Baseline #4 |
|
|---|---|---|
| IMG |
145.76KiB |
145.76KiB |
| Other |
52.85KiB |
52.85KiB |
Bundle analysis report Branch Huxpro:Huxpro/host-a2ui-playgrou... Project dashboard
Generated by RelativeCI Documentation Report issue
React External#866 Bundle Size — 680.82KiB (0%).d43a28a(current) vs 7abb0a9 main#851(baseline) Bundle metrics
|
| Current #866 |
Baseline #851 |
|
|---|---|---|
| Initial JS |
0B |
0B |
| Initial CSS |
0B |
0B |
| Cache Invalidation |
0% |
0% |
| Chunks |
0 |
0 |
| Assets |
3 |
3 |
| Modules |
17 |
17 |
| Duplicate Modules |
5 |
5 |
| Duplicate Code |
8.59% |
8.59% |
| Packages |
0 |
0 |
| Duplicate Packages |
0 |
0 |
Bundle analysis report Branch Huxpro:Huxpro/host-a2ui-playgrou... Project dashboard
Generated by RelativeCI Documentation Report issue
React Example#7751 Bundle Size — 225.52KiB (0%).d43a28a(current) vs 7abb0a9 main#7736(baseline) Bundle metrics
|
| Current #7751 |
Baseline #7736 |
|
|---|---|---|
| Initial JS |
0B |
0B |
| Initial CSS |
0B |
0B |
| Cache Invalidation |
0% |
0% |
| Chunks |
0 |
0 |
| Assets |
4 |
4 |
| Modules |
180 |
180 |
| Duplicate Modules |
69 |
69 |
| Duplicate Code |
44.54% |
44.54% |
| Packages |
2 |
2 |
| Duplicate Packages |
0 |
0 |
Bundle size by type no changes
| Current #7751 |
Baseline #7736 |
|
|---|---|---|
| IMG |
145.76KiB |
145.76KiB |
| Other |
79.77KiB |
79.77KiB |
Bundle analysis report Branch Huxpro:Huxpro/host-a2ui-playgrou... Project dashboard
Generated by RelativeCI Documentation Report issue
React MTF Example#883 Bundle Size — 196.68KiB (0%).d43a28a(current) vs 7abb0a9 main#868(baseline) Bundle metrics
|
| Current #883 |
Baseline #868 |
|
|---|---|---|
| Initial JS |
0B |
0B |
| Initial CSS |
0B |
0B |
| Cache Invalidation |
0% |
0% |
| Chunks |
0 |
0 |
| Assets |
3 |
3 |
| Modules |
174 |
174 |
| Duplicate Modules |
66 |
66 |
| Duplicate Code |
44.05% |
44.05% |
| Packages |
2 |
2 |
| Duplicate Packages |
0 |
0 |
Bundle size by type no changes
| Current #883 |
Baseline #868 |
|
|---|---|---|
| IMG |
111.23KiB |
111.23KiB |
| Other |
85.45KiB |
85.45KiB |
Bundle analysis report Branch Huxpro:Huxpro/host-a2ui-playgrou... Project dashboard
Generated by RelativeCI Documentation Report issue
3 participants
Summary
Host the A2UI playground as a standalone SPA at
lynx-stack.dev/a2ui, following the same pattern as the REPL playground atlynx-stack.dev/repl.ASSET_PREFIXsupport to rsbuild config and setcopyOnBuild: truefor thewww/public dir so the Lynx bundle is included in the production build outputnew URL()instead of origin string concatenation, and makeDEFAULT_DEMO_URLrelative (./main.web.jsinstead of/main.web.js)doc_build/a2ui/Test plan
ASSET_PREFIX=/a2ui/ pnpm --filter a2ui-playground buildproduces correct asset paths in HTMLmain.web.jsis present indist/(fromcopyOnBuild: true)lynx-stack.dev/a2uiloads correctly after CI completesSummary by CodeRabbit
New Features
Infrastructure