Navigation Architecture
Navigation is governed by a central metadata registry and a grouped hierarchy that maps logical operator domains to physical routes and UI components.Section Metadata and Groups
The system defines 19 primary sections inCONSOLE_SECTIONS apps/web/src/console/sectionMetadata.ts#1-33. These are categorized into five NavigationGroup buckets apps/web/src/console/navigation.ts#26-52:
| Group | Label | Included Sections |
|---|---|---|
chat | Chat | chat |
control | Observability | overview, sessions, usage, logs, inventory, support |
operations | Control | approvals, cron, channels, browser |
agent | Agent | agents, skills, memory |
settings | Settings | auth, access, config, secrets, operations |
Data Flow: Navigation to Component
TheConsoleSidebarNav component renders the global navigation rail using CONSOLE_NAV_GROUPS apps/web/src/console/components/layout/ConsoleSidebarNav.tsx#30-68. When a user selects an item, the onSelect callback updates the app.section state in useConsoleAppState, and the ConsoleSectionContent switch-case renders the corresponding view apps/web/src/console/ConsoleSectionContent.tsx#26-97.
System Component Mapping
The following diagram bridges the logical navigation names used by operators to the underlying React components and API routes. Navigation to Code Entity Mapping Sources: apps/web/src/console/navigation.ts#26-103, apps/web/src/console/ConsoleSectionContent.tsx#26-97, apps/web/src/console/sections/AccessSection.tsx#118-127.Major Console Sections
1. Overview and Diagnostics
The Overview section provides a high-level posture summary, while the Diagnostics (Operations) section handles technical deep-dives and audit logs.- Implementation:
OverviewSectionandOperationsSection. - Key Features:
- Capability Catalog: Displays available system features based on the
capability-catalog.v2contract apps/web/src/console/fixtures/m56ControlPlane.ts#5-105. - Audit Events: A filtered table of system events with principal and payload search apps/web/src/console/sections/OperationsSection.tsx#151-180.
- CLI Handoffs: Displays commands that must be run locally for high-trust operations apps/web/src/console/sections/OperationsSection.tsx#68-79.
- Capability Catalog: Displays available system features based on the
2. Access and Inventory
Manages the trust relationship between the gateway and external devices or nodes.- Implementation:
AccessSectionapps/web/src/console/sections/AccessSection.tsx#64-166 andInventorySection. - Data Flow:
useInventoryDomainhook fetches device records and pairing requests apps/web/src/console/sections/AccessSection.tsx#73-78.- Operators approve or reject
NodePairingRequestViewitems apps/web/src/console/sections/AccessSection.tsx#118-127. - Trust actions (Rotate, Revoke, Remove) are dispatched to the
/console/v1/inventoryendpoints.
3. Usage and Governance
Tracks resource consumption and enforces budget controls.- Implementation:
UsageSectionapps/web/src/console/sections/UsageSection.tsx#30-78. - Metrics: Displays total tokens, run counts, estimated USD cost, and average latency apps/web/src/console/sections/UsageSection.tsx#80-106.
- Governance: Integrates with the
UsageGovernancesubsystem to display budget evaluations and active overrides apps/web/src/console/sections/UsageSection.tsx#161-190.
4. Config and Secrets
Handles the management ofpalyra.toml and sensitive vault-backed values.
- Implementation:
ConfigSectionandSecretsSection. - Safety Mechanisms:
- Redaction: Secrets are masked by default and require an explicit “Reveal” action apps/web/src/App.config-access-support.test.tsx#134-139.
- Lifecycle: Supports config mutation, migration (schema versioning), and recovery from backups apps/web/src/App.config-access-support.test.tsx#113-123.
5. Control (Routines, Channels, Browser)
- Routines (Cron): Manages scheduled tasks and manual triggers for
CronScheduleTypeautomations apps/web/src/App.runtime-operations.test.tsx#48-56. - Channels: Configures Discord, Slack, or Webhook connectors, including “Dead Letter” replay/discard logic apps/web/src/App.runtime-operations.test.tsx#57-106.
- Browser: Manages
palyra-browserdprofiles and relay tokens for browser automation apps/web/src/console/sectionMetadata.ts#23-23.
Technical Interaction Model
The console sections interact with the backend via theConsoleApiClient. The following diagram illustrates how a section (e.g., Access) utilizes hooks and the API client to perform stateful operations.
Console Section Data Flow (Access Example)
Sources: apps/web/src/console/sections/AccessSection.tsx#111-127, crates/palyra-daemon/src/transport/http/handlers/console/inventory.rs, crates/palyra-daemon/src/transport/http/handlers/console/devices.rs.
Section Summary Table
| Section ID | Primary Component | Primary API Endpoint | Purpose |
|---|---|---|---|
overview | OverviewSection | /console/v1/health | System posture summary |
sessions | SessionsSection | /console/v1/sessions | Audit and manage chat runs |
usage | UsageSection | /console/v1/usage | Token and cost tracking |
approvals | ApprovalsSection | /console/v1/approvals | Human-in-the-loop gate |
cron | CronSection | /console/v1/routines | Automation scheduling |
auth | AuthSection | /console/v1/auth/profiles | LLM provider credentials |
secrets | SecretsSection | /console/v1/secrets | Vault management |