Skip to content

feat(website): host A2UI playground at /a2ui #2533

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
Huxpro merged 1 commit into from
May 3, 2026
Merged

feat(website): host A2UI playground at /a2ui #2533

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
15 changes: 15 additions & 0 deletions .github/workflows/workflow-website.yml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -46,6 +46,21 @@ jobs:
rm -rf website/doc_build/repl
mkdir -p website/doc_build
cp -r packages/repl/dist website/doc_build/repl
- name: Build A2UI dependencies
run: |
pnpm turbo --filter a2ui-playground^... build
- name: Build A2UI Lynx bundle
run: |
pnpm --filter a2ui-playground build:lynx
- name: Build A2UI Playground
run: |
BASE_PATH='${{ steps.pages.outputs.base_path }}'
Comment thread
Huxpro marked this conversation as resolved.
Dismissed
export ASSET_PREFIX="${BASE_PATH%/}/a2ui/"
pnpm --filter a2ui-playground build
- name: Copy A2UI Playground into website output
run: |
rm -rf website/doc_build/a2ui
cp -r packages/genui/a2ui-playground/dist website/doc_build/a2ui
- name: Upload artifact
uses: actions/upload-pages-artifact@7b1f4a764d45c48632c6b24a0339c27f5614fb0b # v4
with:
Expand Down
5 changes: 4 additions & 1 deletion packages/genui/a2ui-playground/rsbuild.config.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -43,6 +43,9 @@ export default defineConfig({
render: './src/render.tsx',
},
},
output: {
assetPrefix: process.env.ASSET_PREFIX,
},
server: {
port: PORT,
host: '0.0.0.0',
Expand All @@ -52,7 +55,7 @@ export default defineConfig({
publicDir: [
{
name: 'www',
copyOnBuild: false,
copyOnBuild: true,
watch: true,
},
],
Expand Down
8 changes: 4 additions & 4 deletions packages/genui/a2ui-playground/src/pages/DemosPage.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -92,7 +92,7 @@ export function DemosPage(props: { protocol: ProtocolVersion }) {
const [lynxDevQrError, setLynxDevQrError] = useState('');
const [lynxDevCopied, setLynxDevCopied] = useState(false);

const origin = window.location.origin;
const baseUrl = window.location.href.replace(/#.*$/, '');
Copy link
Copy Markdown
Contributor

@coderabbitai coderabbitai Bot May 2, 2026

Choose a reason for hiding this comment

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

⚠️ Potential issue | 🟡 Minor | ⚡ Quick win

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.

const rspeedyDevUrl = useRspeedyDevUrl();
const lynxUrlSeqRef = useRef(0);

Expand All @@ -115,7 +115,7 @@ export function DemosPage(props: { protocol: ProtocolVersion }) {
const actionMocks = scenario?.actionMocks;
const url = buildRenderUrl(
{ protocol, demoUrl: DEFAULT_DEMO_URL, messages: parsed, actionMocks },
origin,
baseUrl,
);
setRenderUrl(url);

Expand Down Expand Up @@ -174,7 +174,7 @@ export function DemosPage(props: { protocol: ProtocolVersion }) {
// "View on Device" QR is scannable. render.html already supports
// messagesUrl / actionMocksUrl query params.
if (messagesUrlAbs) {
const r = new URL('/render.html', origin);
const r = new URL('render.html', baseUrl);
r.searchParams.set('protocol', protocol);
r.searchParams.set('demoUrl', DEFAULT_DEMO_URL);
r.searchParams.set('messagesUrl', messagesUrlAbs);
Expand All @@ -189,7 +189,7 @@ export function DemosPage(props: { protocol: ProtocolVersion }) {
}
})();
},
[origin, protocol, rspeedyDevUrl],
[baseUrl, protocol, rspeedyDevUrl],
);

useEffect(() => {
Expand Down
2 changes: 1 addition & 1 deletion packages/genui/a2ui-playground/src/utils/demoUrl.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
// Copyright 2026 The Lynx Authors. All rights reserved.
// Licensed under the Apache License Version 2.0 that can be found in the
// LICENSE file in the root directory of this source tree.
export const DEFAULT_DEMO_URL = '/main.web.js';
export const DEFAULT_DEMO_URL = './main.web.js';
17 changes: 10 additions & 7 deletions packages/genui/a2ui-playground/src/utils/renderUrl.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,19 +11,22 @@ export interface RenderInit {
actionMocks?: unknown;
}

export function buildRenderUrl(init: RenderInit, baseOrigin: string): string {
const params = new URLSearchParams();
params.set('protocol', init.protocol);
params.set('demoUrl', init.demoUrl);
export function buildRenderUrl(init: RenderInit, baseUrl: string): string {
const url = new URL('render.html', baseUrl);
url.searchParams.set('protocol', init.protocol);
url.searchParams.set('demoUrl', init.demoUrl);
// Use base64url to avoid URL-encoding overhead for JSON payloads.
params.set('messages', encodeBase64Url(JSON.stringify(init.messages)));
url.searchParams.set(
'messages',
encodeBase64Url(JSON.stringify(init.messages)),
);

if (init.actionMocks !== undefined) {
params.set(
url.searchParams.set(
'actionMocks',
encodeBase64Url(JSON.stringify(init.actionMocks)),
);
}

return `${baseOrigin}/render.html?${params.toString()}`;
return url.toString();
}
4 changes: 4 additions & 0 deletions website/rspress.config.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -751,6 +751,10 @@ const config: UserConfig = defineConfig({
text: 'REPL',
link: '/repl',
},
{
text: 'A2UI',
link: '/a2ui',
},
{
text: 'API',
items: [
Expand Down
Loading