← Web App

layout

web app · wireframes · layout transition

The user shell — the header and navigation that wrap every screen. The chat content inside is rendered by a ready-made library.

Layout
web app shell
achilles.local/chat /chat · authenticated user Landing screen after sign-in.
A Achilles
Project Ajax RU 1 2 2 DS 3
Overview
Chat 4 Agents
Active route — /chat (Outlet) 5
  1. 1 Theme (dark / light) and language (RU / EN) toggles. Personal override — in the profile.
  2. 2 The notification bell — the employee's personal notifications (their agents' runs, account events); the badge is the unread count. Leads to the feed.
  3. 3 The avatar opens the profile menu with sign-out from the current and from all sessions.
  4. 4 Chat — the landing screen (home). The conversation itself is rendered by the ready-made chat shell; see grounded answer.
  5. 5 The route content (Outlet) fills assistant-ui (thread · composer) with our layer inside — chat shell. The active item stays highlighted on sub-screens too.