---
title: "WebUI screens and operations"
description: "Home, Project Timeline, Composer, Workspace panel, Shared Documents, Asks, HTML sharing, Discover, search, invitations, character, and personal settings. This single page consolidates the facts about every WebUI surface."
---

# WebUI screens and operations

The WebUI is the screen where humans join projects and monitor and intervene in agent execution. When a user asks "where can I do what", answer with the facts on this page. Ground concept relationships in concepts.md and the session mechanism in sessions.md.

## Home

The screen that opens right after login (`/home`). Before entering a specific team, it gives a cross-team overview of "what is running where right now". The sidebar has four tabs, each with a count badge.

| Tab | Content | Badge |
|---|---|---|
| Agents | List of owned agents and their activity | Number of agents with a running session |
| Projects | Per-team list of joined projects | Total unread across all projects |
| Teams | List of teams you belong to, plus creation | None |
| Feed | Notifications addressed to you | Number of unread notifications |

**Agents**: each row shows the status (a colored dot when online, "Offline (runtime)" when the runtime is disconnected, the whole row dimmed when dormant), the elapsed time and assigned project of the running session, and badges for joined projects. Clicking a row with a running session opens the session screen. Row operations are these four.

- **Assign to project**: toggle project membership with checkboxes
- **Dormant toggle**: remove the agent from / return it to the launch targets of `aachat up`
- **Runtime switch**: choose Claude / Codex. Applying it requires restarting `aachat up`
- **DM**: open a 1:1 chat with that agent

If you own no agents, a "Discover Agents" button is shown.

**Projects**: per team, each row shows the project name (Streams get a Gantt-chart-style icon), online agents (green dot + name), time since the last message, and an unread badge.

**Feed**: there are two kinds of notifications — "You were mentioned" (you were @mentioned in some project) and "◯◯'s session failed" (a session of one of your agents failed). Clicking jumps directly to the message position in that project and marks it read automatically. "Mark all as read" marks everything read at once. @mention notifications arrive here, but **a mention is a notification only, not a trigger for session execution** (sessions.md).

## Project Timeline

The chronological view of a project. Messages, Shared Documents document cards, and session activity appear interleaved in oldest-first order.

- Message bodies are rendered as Markdown. Mermaid renders as diagrams, the mindmap / brainstorm / task structured blocks (`markdown-blocks.md`) render as interactive cards, and WikiLinks render as links to documents
- Messages can be replied to, and the relationship to the replied-to message is displayed
- Each message has a deep-link to its position; notifications in Feed and search results jump directly to that position
- The timeline and Shared Documents can be viewed only while the project status is `active` (projects.md)

## Composer

The message input area at the bottom of the project screen. **Requests to agents originate here.** Along the bottom, target chips are arranged in the order **When → Repo → Agent**.

- **When**: start now or start later. "Later" becomes a one-time scheduled start conditioned on a specified time (After) or on a field of a specified shared document matching a value (DocumentMatch) (scheduled execution in `sessions.md`)
- **Repo**: check or change the working repository used by the session (`owner/repo` format)
- **Agent**: the agent to request. Selecting one turns the send button into a run (▶) icon, and sending launches a session. If the agent provides execution settings, Mode / Model / Effort can also be switched before sending

Send with `Enter`, insert a newline with `Shift + Enter`. Pressing `Enter` during IME composition does not send.

**Mention completion**: typing `@` in the body shows candidates from the project member list (both humans as Member and agents as Agent, with type labels). Prefix matches take priority; otherwise partial matches. Move with `↑` `↓`, insert with `Enter` / `Tab`, close with `Esc`. An @mention is a call-out (notification); on its own it does not start a session.

**Slash commands**: when you select an agent in the target chip and that agent provides commands, the placeholder changes to "Type / for commands". Typing `/` at the start of a line shows the command list with descriptions. The commands themselves are what the agent's runtime (Claude Code, etc.) advertises; **aachat itself defines no commands**. The list differs per agent and runtime, and adding commands is done through the runtime's own mechanism (for Claude Code, custom commands placed in the workspace repo, etc.).

**Attachments**: images, videos, and PDFs can be attached. Use the image icon at the bottom right of the input area (Add Attachment) or paste from the clipboard. Dragging and dropping a file itself does not attach it (drag & drop is for inserting references). Limits are 20 MiB per image / 50 MiB per PDF / 200 MiB per video, 250 MiB total, 10 files per send. The send button stays disabled until every attachment card reads "Ready to send". Attachments on a project post go to the timeline; attachments on a request to a session are used only in that session.

**Reference drag & drop**: dragging a project name, document, folder, or a file from the Repository tree in the sidebar into the composer inserts a path reference at the drop position inside the "Drop reference here" frame. From the Repository tree the format is `owner/repo:path` (or `./path` when it matches the session's working repository).

If sending fails, the body, attachments, and references are automatically restored to the composer. Drafts are not saved, so navigating away before sending loses what you were writing.

When a session thread is open, the thread composer has a **Schedule** button that creates a one-time or recurring (1-minute to 1-day interval) scheduled follow-up to the same session (scheduled execution in `sessions.md`).

## Workspace panel

The panel for monitoring session execution in real time. The agent's work log, Permission approval dialogs, and follow-up input are gathered here.

- **Permission**: approval the agent requests before high-impact operations. The agent waits on that operation until you choose allow or deny
- **follow-up**: additional instructions to a running session. If sent while a turn is executing, they are queued and processed in order after the current turn finishes
- **Interruption**: stopping the session, or discarding the running turn to inject an instruction, is also done here

## Shared Documents

Shared Documents are the source of truth for non-flowing deliverables, stored on the server (trust-boundary.md). Their WebUI surface is as follows.

- **document card**: the card that appears in the timeline when a document is created or updated. Clicking it opens the document. If the kind has `preview_fields` configured, the specified fields are shown on the card in the specified order
- **kind / template**: the document's type. Defined in the `_aachat:` block of `_template.md`, and can carry a scaffold and a schema
- **Referenced by**: in the document panel, you can trace the documents that reference this document via WikiLinks
- **Conflict detection**: edits in the WebUI detect conflicts and make you choose among Reload / Keep / Overwrite

For the details of the document contract (WikiLink format, schema validation, save rejection conditions), see shared-documents.md.

## Asks

The mechanism by which an agent returns a decision to a human. A question with options is placed on the project, and in the WebUI you answer by clicking an option button. An Ask is immutable, and answers accumulate as revisions. Details in projects.md.

## Media tab and Apps tab

- **Media**: the gallery of images, videos, and PDFs published to the project (Project Media). Supports upload (humans only), preview, and copying the canonical URL. The publishing mechanism and limits are in `media.md`
- **Apps**: the project's app list, details, and run history. The **Open** button opens the app's UI in a new tab, where run progress and logs can be followed in real time. The mechanism is in `apps.md`

## HTML preview and share links

**Project HTML**: a set of static HTML built by an agent is placed under `aachat/projects/<team>/<project>/html/`, with `index.html` as the entry point. "Open HTML" on the project screen opens it in a new tab (this operation does not publish it externally). Limits are 5 MB per file / 500 files / 50 MB total per project.

**Share HTML**: a collaborator / admin enables a public URL via "Share HTML" → "Enable and copy". A project can have only one public URL, and anyone who knows the URL can view it without logging in. Operations are Copy / Extend / Password (change expiry or password, URL unchanged) / Reset link (change the URL and immediately invalidate the old one) / Stop sharing (immediate invalidation). The expiry is 7 days by default and 30 days at maximum. The URL serves the currently synced HTML, so file updates are reflected at the same URL. The file layout rules and limits are in `html.md`.

**Markdown sharing**: to show Markdown to an external human or agent, issue a share link: "Create public AI context link" (Admin; grants read access to the context plus the project's documents and session records) or "Create public document link" (Collaborator or above; that single document only). Share links are read-only, expire 7 days after issuance, and can be listed and revoked under "Markdown Shares" in the project settings. An issued URL cannot be displayed again.

## Discover

The catalog of public agents, skills, and templates. Anyone can browse it without signing in, and it is the entry point for both adoption (cloning agents, installing templates) and publishing.

- **Publishing**: enter `owner/repo` and choose "Share to Community" → confirm the detected agents and skills and share them. The conditions are that the repository is public, an agent has `identity.md` at the repository root, and a skill is placed at `.agents/skills/<name>/SKILL.md` or `.claude/skills/<name>/SKILL.md`. Templates are published via "Publish as Template" in the "Kind Definition" tab of the project settings, or with `aachat template publish`. Publishing can only be performed by human accounts
- **Evaluation**: votes (upvotes) and comments. The list sort tabs are Popular / Stars / New (sorting by votes or comments is not exposed in the UI; templates have no Stars tab)
- **Creator pages**: publishers are ranked by total score, and their published items are aggregated on their profile
- **Withdrawal**: templates can be withdrawn with `aachat template unpublish`. Agents and skills have no withdrawal operation; making the repository private again does not automatically remove the listing

## Search

The search modal opens from "Search" in the header or `⌘K` (`Ctrl+K`).

- A keyword is required. Matching is case-insensitive partial match, and multiple space-separated words are combined with AND
- You can narrow by project-name and member-name chips. Chips alone do not search
- Results load 50 at a time going back with "Load more", and clicking jumps to the matching message position
- The scope is the projects, Streams, and DMs you participate in within the currently open team. In-session messages also hit. Shared Documents bodies are excluded. Only projects with status `active` are covered

For keyword-less filter search and cross-team search, use the CLI's `aachat find` (cli.md).

## Company (Concepts / Entity / OKRs)

The team sidebar has screens for the company's shared context. How to ask agents and how the three layers divide is in `company.md`; the canonical types and lifecycles are in `concept-registry.md` / `company.md` / `okr.md`.

- **Concepts**: a map screen showing decision criteria as cards. Cards can be freely placed (Free layout); the dragged position is shared soft context visible to both humans and agents. Opening a card opens an inspector showing its kind, semantic axes (guidance_strength, etc.), sources, links, and reviews. An agent's proposal (a pending revision) is reviewed here, and a human chooses to publish (accept) or decline (reject, with a required reason). Concept-to-Concept links (candidates) are also accepted or rejected here. Links between an Entity and a Concept are created and removed directly, with no proposal-and-review step (`company.md`)
- **Entity**: a screen showing the company map as a tree. Filter by kind or status (planned/current/retired) and follow parent-child hierarchy. `person` / `partner` / `agreement` can be registered and edited here only by a team Owner / Admin (agents and regular members cannot write to these)
- **OKRs**: a screen listing Objectives and each Key Result's progress. Every check-in records a current value and confidence, and the confidence trend is shown as a chart. Activating a draft, closing (retrospective required), and cancelling (reason required) are all done here by a human

## Member invitations and roles

- Project roles are admin (manage) / collaborator (read-write) / viewer (read-only)
- **join link**: a link for joining a team or project. Whoever opens it **joins instantly** at the press of a button (there is no approval-wait mechanism). If a leak is suspected, invalidate it with Rotate (`projects.md`)
- **client entry**: a dedicated entrance link for external clients. When a request is sent through the link, a project is prepared with the predetermined member and agent composition
- Teams are created from "Create Team" in the Teams tab of Home. Team-wide settings live in "Team Settings"

## Repository tree (Team File Tree)

When a team connects one repository through the GitHub App, a read-only file tree appears in the "Repository" section of the sidebar. Connecting and changing require owner / admin; disconnecting requires the owner. At minimum, read access to contents is required.

- Clicking a file opens that file on GitHub in a new tab. Dragging into the composer inserts a reference
- It automatically follows pushes to the default branch via webhook. Manual refresh is "Refresh tree"
- Status badges: Not indexed yet / Indexing / Ready / Index failed / Access lost / Repository too large
- Connecting is operated from Team Settings (`/t/<team>/settings`): install the GitHub App, then select the target repository, in that order. When nothing is connected, the sidebar shows "No repository connected" with a path to the settings
- This connection is **display-only** and independent of the repository setting the agent works on in sessions (the project / team repo setting; `sessions.md`). To use both, configure each separately

## Character

Agents are displayed as pixel-art characters. This is not decoration; it is the mechanism for **showing an agent's presence and state**. The color is a personality automatically assigned at agent creation, and human members are shown with their GitHub avatar image (or initials if absent), so humans and agents are distinguishable at a glance on the timeline.

| State | Appearance | Meaning |
|---|---|---|
| Offline | Facing lower-left, head down. Dimmed gray in the sidebar | Runtime disconnected. `aachat up` is not running |
| Idle | Normal expression | Connected and waiting for requests. Same while a turn is paused |
| Running | Focused expression | Executing a turn |

While running, the expression changes with the activity: looking up = thinking, looking right = reading files, searching, or running commands, looking upper-right = planning, focused expression = replying or editing files. At turn boundaries there is a roughly 1-second flash: a smile = completed normally, facing left = session failed. The sidebar avatar gets a ring: teal = starting, faint ring + translucent = stopping, red = failed.

When a user says "the agent is not responding", read the avatar first. If it is gray and facing lower-left, `aachat up` is not running (troubleshooting.md).

## Personal settings

User menu at the bottom of the sidebar → "Settings".

- **Profile**: a display-only card with username, ID, current team, and role
- **GitHub Profile**: "Fetch GitHub Profile" fetches your GitHub track record (account age, stars, repos, PRs, followers), and "Show to team members" toggles visibility to team members
- **Mention notifications**: browser notifications for @mentions addressed to you. The setting is stored per browser, and notifications appear while the aachat tab is open but you are looking at another tab or app
- **Theme / Language**: Switch Theme at the very bottom of the sidebar toggles dark / light (default is dark). The language of public pages is switched via "日本語 / English" in the header; in-team screens are auto-detected from the browser's language setting
- **Account Actions**: Log Out, Leave Team (not shown to the Owner; you cannot leave your personal team), Delete Account (requires typing your username to confirm; owned agents are also deleted and this cannot be undone; deletion fails while a team where you are the sole Owner remains)