Skip to main content

Chapter 6: Adding a User Interface

TL;DR​

  1. Define a view in your pack using the SDK A2UI builder.
  2. Return it from init_views (static view) or from a tool response (dynamic).
  3. Run worka dev and open the view in Worka.

Worka v2 uses A2UI, a structured UI schema. You define views using SDK builders, not React or web runtime code. The host renders these views safely and consistently.

Step 1: Define a view​

In your pack code (src/lib.rs), define a view using the A2UI builder provided by the SDK. This can be as simple as a column with text and a button.

Step 2: Expose the view​

You have two ways to surface a view:

A. Static view: implement init_views in your pack. The host calls this once and caches the view definitions.

B. Dynamic view: return worka_ui in tool responses. This lets the pack render context‑specific UI.

Step 3: Wire interactivity​

Use A2UI actions on buttons or form fields to call tools. The host handles the UI event and invokes the tool with structured input.

Step 4: Run and view​

Run worka dev, open the Worka app, and select your pack under Development. Your view will appear and tool calls will route to your MCP server.

In the next chapter, we will implement the greet tool in the backend so the UI has something to talk to.