Skip to content

Latest commit

 

History

History
80 lines (60 loc) · 3.3 KB

File metadata and controls

80 lines (60 loc) · 3.3 KB

VeADK Web

A React web UI for VeADK / Google ADK agents. It talks to the standard ADK API server that veadk frontend launches — no separate backend.

Features

  • Streaming chat over the ADK /run_sse event stream.
  • Markdown rendering for user and assistant messages (GFM + code highlight).
  • Reasoning & tool calls shown inline (collapsible "thinking", tool blocks).
  • Sessions: pick an agent, browse history, new chat, delete — per signed-in user.
  • Tracing viewer: a span tree + detail panel from the ADK debug trace.
  • Auth: optional VeIdentity SSO, or a local username for dev.
  • Agent-driven UI (A2UI): when an agent emits A2UI, it renders as native components (one feature among the above — not required).

Run

The build output ships inside the package at veadk/webui (committed), so veadk frontend works for installed users with no build step. Run it from the parent folder of your agent directories (like adk web) — every subdir with an agent.py that exposes root_agent becomes a selectable app in the dropdown:

cd path/to/your/agents     # parent dir containing agent_a/, agent_b/, ...
veadk frontend             # serves UI + ADK API on http://127.0.0.1:8000
# or point elsewhere:  veadk frontend --agents-dir ./examples

Rebuild the UI from source after changing it:

cd frontend && npm install && npm run build   # -> veadk/webui

Dev loop with hot reload (Vite proxies the API):

veadk frontend --dev        # API only, CORS for the vite dev server
cd frontend && npm run dev  # http://localhost:5173

Authentication

The ADK user_id (which scopes sessions/memory) comes from the signed-in user.

SSO (VeIdentity OAuth2) — enable with flags; the UI shows a login page and redirects through VeIdentity, then uses the sub from /oauth2/userinfo:

veadk frontend \
  --oauth2-user-pool <name>      --oauth2-user-pool-client <name>
  # or by id (env: OAUTH2_USER_POOL_ID / OAUTH2_USER_POOL_CLIENT_ID):
  # --oauth2-user-pool-uid <id>  --oauth2-user-pool-client-uid <id>

Requires Volcengine credentials (AK/SK) in the environment. The login button's label/icon is config-driven (--oauth2-provider / --oauth2-provider-label), exposed at GET /web/auth-config.

No SSO (local) — without those flags, the login page asks for a username (letters + digits, ≤16), stored locally and used as the user_id.

Login state is cached: SSO via the veadk_session cookie, local mode via localStorage. The session itself is created lazily on the first message.

How it works

  • adk/client.ts calls /list-apps, creates a session, and streams /run_sse; events are normalised into ordered blocks (blocks.ts).
  • ui/ holds the chat shell: sidebar, composer, message blocks, trace drawer.
  • adk/identity.ts resolves the user (SSO userinfo or local username).

Agent-driven UI (A2UI)

When an agent emits A2UI (declarative UI), the client renders it natively. Each component lives in its own self-registering directory under src/a2ui/components/<Name>/; unknown components fall back to a collapsible JSON view, so a catalog/renderer mismatch never breaks the page. To add a component, drop a folder there (frontend) and declare it in the agent's catalog (backend — see veadk.a2ui.BaseA2UICatalog).