Skip to main content

Admin UI

The Dvara Admin UI is a full-featured web console for operating your AI gateway. It connects to gateway-server via REST and provides real-time monitoring, configuration management, and enterprise governance controls.

Starting the UI​

# Start gateway-server first (port 8080)
MOCK_PROVIDER_ENABLED=true ./mvnw -pl gateway-server spring-boot:run

# Start the admin UI (port 8090)
./mvnw -pl gateway-ui spring-boot:run

# Open http://localhost:8090/

With Docker Compose:

docker compose up
# UI at http://localhost:8090/
# Server at http://localhost:8080/

The top navigation bar provides access to all feature areas:

Dvara (logo)
├── Dashboard          (/)              — live metrics + provider health
├── Tenants            (/tenants)       — tenant + API key management
├── Routes             (/routes)        — routing rules + version history + canary
├── Policies           (/policies)      — policy DSL editor + shadow testing
├── Audit              (/audit)         — live audit event stream
├── Users              (/users)         — user + role management [ENT]
├── Cost (dropdown)                     [ENT]
│   ├── Cost Dashboard (/costs)         — cost records + charts + forecasts
│   ├── Model Pricing  (/pricing)       — per-model pricing config
│   ├── Budget Caps    (/budgets)       — spending limits + alerts
│   ├── Chargeback     (/chargeback)    — chargeback reports + PDF/CSV
│   └── Compliance     (/compliance)    — SOC2/HIPAA/GDPR reports
├── MCP                (/mcp/servers)   — MCP server registry
└── Agents (dropdown)                   [ENT]
    ├── Tool Calls     (/mcp/tool-calls) — tool call history
    ├── Sessions       (/mcp/sessions)   — agent session management
    ├── Approval Queue (/approvals)      — human-in-the-loop approvals
    └── Analytics      (/analytics)      — agent behavior analytics

Items marked [ENT] require an enterprise license. Without a license, these show a locked stub panel with an upgrade prompt.

A connection status indicator appears in the top-right corner: green pulsing dot when gateway-server is reachable, red dot when disconnected.

Dashboard​

The landing page (/) displays three real-time panels.

Live Metrics​

Four metric cards refreshed every 3 seconds via HTMX polling:

  • Requests/sec — average request throughput since startup
  • P95 Latency — 95th percentile response time (milliseconds)
  • Error Rate — percentage of 4xx/5xx responses
  • Tokens/min — average token throughput

Metrics are computed from the gateway-server's Prometheus endpoint (/actuator/prometheus).

Provider Health​

A table showing all registered LLM providers with:

  • Provider name and type
  • Health status (HEALTHY / DEGRADED / UNHEALTHY) with color-coded badges
  • Capability pills (Streaming, Vision, Tools, Structured, JSON)
  • Maximum context token window

Fleet Health​

Enterprise-only panel for multi-instance fleet monitoring. Shows a table of all data plane instances with:

  • Instance ID — unique instance identifier
  • Region — deployment region
  • Config Version — instance's current config version
  • Lag — version lag behind the control plane (green = in-sync, amber = 1-2 behind, red = >2 behind)
  • Status — heartbeat-based status (healthy ≤30s, lagging ≤60s, stale >60s)
  • Last Heartbeat — timestamp of last heartbeat

Auto-refreshes every 3 seconds. Without a license, displays a locked stub panel.

Tenant Management​

Navigate to Tenants in the top navigation.

Tenant List​

Displays all tenants with name, status badge (active/suspended), region, and creation date. Auto-refreshes every 10 seconds.

Create / Edit Tenant​

Click New Tenant to create a tenant with a name and status. Click Edit on any tenant row to update its name or status.

API Key Management​

Click Keys on a tenant row to manage that tenant's API keys:

  • Key list — shows name, masked key prefix (gw_xxx), scopes, status, expiry, and creation date. Auto-refreshes every 10 seconds.
  • Create key — click New Key to open a modal with name, scopes (multi-select), and optional expiry. The full plaintext key is shown exactly once after creation with a copy button — it cannot be retrieved again.
  • Revoke key — click Revoke on any active key. Requires confirmation. Revocation is immediate and irreversible.

Route Configuration​

Navigate to Routes in the top navigation.

Route List​

Displays all routes with ID, model pattern, strategy, providers with weights, version, and pinned model version. Auto-refreshes every 10 seconds. Click Edit to open the route editor or Delete to remove a route.

Create / Edit Route​

Click New Route to create a route with:

  • Model Pattern — glob pattern to match model names (e.g. gpt*, claude*, ollama/*)
  • Routing Strategy — model-prefix, round-robin, weighted, latency-aware, cost-aware, canary, geo-aware
  • Pinned Model Version — optional, pins requests to a specific model version
  • Providers — dynamic table of provider entries with name, weight, model override, and region. Add/remove rows as needed.

Changes propagate live to the gateway without restart.

Version History​

In edit mode, the right panel shows version history for the route. Each version entry displays the version number, creation timestamp, and two actions:

  • Diff — loads a field-by-field comparison between the selected version and the current configuration. Changed fields are highlighted with an amber background.
  • Rollback — rolls back the route to the selected version (creates a new version with the restored configuration). Requires confirmation.

Canary A/B Testing​

When a route uses the canary strategy, a dedicated canary dashboard is available at Routes > (route) > Canary.

Dashboard features:

  • Canary configuration — shows baseline provider, candidate provider, current split percentage, and tenant scope
  • Live metrics (auto-refreshes every 5 seconds) — side-by-side comparison of baseline vs. candidate:
    • Request count
    • Error count and error rate
    • Total and average latency
    • Total and average cost
  • Split adjustment — update the traffic split percentage on the live route without restarting
  • Reset — clear all canary metrics and start fresh

Policy Management​

Navigate to Policies in the top navigation.

Policy List​

Displays all policies with ID, name, tenant, status badge (DRAFT/ACTIVE/SHADOW/ARCHIVED), version, and last updated timestamp. Auto-refreshes every 10 seconds.

Use the Tenant dropdown filter to narrow the list. Status badges are color-coded: blue for DRAFT, green for ACTIVE, purple for SHADOW, grey for ARCHIVED.

Create / Edit Policy​

Click New Policy to create a policy with:

  • Name — human-readable policy name
  • Tenant ID — scope the policy to a tenant (blank = global)
  • DSL — YAML policy rules, edited in a CodeMirror 5 YAML editor with syntax highlighting
  • Status — lifecycle status (DRAFT, ACTIVE, SHADOW, ARCHIVED)

In edit mode, the right panel shows:

  • Version History — same diff and rollback functionality as routes
  • Status Changes — change the policy lifecycle status
  • Dry-Run — simulate the policy against a sample request to see the decision and timing

Shadow Policy Dashboard​

When a policy is in SHADOW status, a dedicated shadow dashboard is available to monitor divergence between shadow and active policy decisions.

Accessing the dashboard:

  • From the policies list: click the eye icon next to any SHADOW-status policy
  • From the policy editor: click "View Shadow Dashboard" in the status panel

Dashboard features:

  • Period Selector — toggle between 1h, 24h, and 7d time windows
  • Stats Panel (auto-refreshes every 5 seconds) — three stat cards:
    • Total Evaluations — number of times the shadow policy was evaluated
    • Divergent Count — times shadow would have denied when active allowed
    • Divergence Rate — percentage of evaluations that diverged
  • Rule Breakdown Table — divergence counts grouped by rule ID
  • Recent Divergent Events Table — latest divergent events with timestamp, request ID, model, tenant, active decision, and shadow decision

Promoting a Shadow Policy​

Click Promote to Active to transition the policy from SHADOW to ACTIVE status. This:

  1. Runs conflict detection against existing active policies (warnings shown if conflicts found)
  2. Changes the policy status to ACTIVE
  3. Clears all shadow event data for the policy

User & Role Management​

Navigate to Users in the top navigation. Requires enterprise license.

User List​

Displays all users with email, name, tenant, roles (as badges), status (ACTIVE/SUSPENDED/DEACTIVATED), last login, and creation date. Auto-refreshes every 10 seconds.

Use the Tenant dropdown filter to narrow the list.

Create User​

Click New User to create a user with:

  • Email — unique email address per tenant
  • Name — display name
  • Tenant ID — the tenant this user belongs to
  • Roles — checkboxes for built-in roles:
    • org-admin — full access to all features
    • policy-admin — manage policies, routes, MCP servers, guardrails
    • billing-admin — manage pricing, budgets, costs, chargeback, compliance
    • developer — create API keys, view routes/policies, dry-run policies
    • viewer — read-only access to all resources

Edit User​

Click Edit on any user row to update their roles. User info (email, name, tenant) is displayed as read-only. Role changes take effect immediately.

Delete User​

Click Delete to remove a user. Requires confirmation.

Cost Dashboard​

Navigate to Cost > Cost Dashboard in the top navigation. Requires enterprise license.

Cost Records​

Displays a table of cost records with tenant, API key, model, provider, input/output tokens, input/output cost, total cost, and timestamp. Auto-refreshes every 5 seconds.

Filters: narrow by tenant, model, provider, and date range.

Summary Cards​

Displays aggregated totals at the top of the page: total cost, total requests, total input tokens, total output tokens.

Charts​

Two Chart.js visualizations:

  • Cost by Provider — donut chart breaking down total spend by provider
  • Cost by Model — horizontal bar chart showing spend per model

Budget Status Panel​

Shows active budget caps with current spend vs. limit progress bars. Color-coded: green under soft limit, amber at soft limit, red at hard limit.

Forecast Cards​

Shows 7-day trailing cost forecasts per model with projected month-end spend and trend indicators (increasing/decreasing/stable).

Anomaly Alerts​

Lists detected cost anomalies with tenant, model, current daily rate vs. baseline, deviation percentage, and detection timestamp.

Model Pricing​

Navigate to Cost > Model Pricing in the top navigation.

Pricing List​

Displays all pricing entries with model pattern (glob), provider, input price per million tokens, output price per million tokens, effective date, and actions.

Create / Edit Pricing​

Click New Pricing to create a pricing entry with:

  • Model Pattern — glob pattern (e.g. gpt-4o*, claude-3-sonnet*)
  • Provider — optional provider scope
  • Input Price / Million — USD per 1M input tokens
  • Output Price / Million — USD per 1M output tokens
  • Effective Date — when this pricing takes effect

Delete Pricing​

Click Delete to remove a pricing entry. Requires confirmation.

Budget Caps​

Navigate to Cost > Budget Caps in the top navigation.

Budget List​

Displays all budget caps with name, tenant, API key, period (DAILY/WEEKLY/MONTHLY), limit (USD), soft limit percentage, enabled status, and version. Auto-refreshes every 10 seconds.

Summary row at top: total budgets, enabled count, disabled count.

Use the Tenant dropdown filter to narrow the list.

Create / Edit Budget​

Click New Budget to create a budget cap with:

  • Name — descriptive name
  • Tenant ID — scope to a tenant (blank = global)
  • API Key ID — scope to a specific API key (blank = tenant-wide)
  • Period — DAILY, WEEKLY, or MONTHLY
  • Limit (USD) — hard spending limit
  • Soft Limit % — percentage of limit at which soft alerts trigger (default: 80%)

Budget Status​

Click the status icon on any budget row to view current period usage:

  • Current Spend — amount spent in the current period
  • Limit — configured limit
  • Period Start/End — boundaries of the current budget period
  • Utilization % — spend/limit percentage with color-coded progress bar
  • Remaining — dollars remaining before hard limit

Delete Budget​

Click Delete to remove a budget cap. Requires confirmation.

Chargeback Reports​

Navigate to Cost > Chargeback Reports in the top navigation. Requires enterprise license.

Report List​

Displays all generated chargeback reports with ID, tenant, period (from-to), generated date, and generated by. Auto-refreshes every 10 seconds.

Generate Report​

Click Generate to create a new chargeback report:

  • Tenant ID — scope to a specific tenant (blank = all tenants)
  • From / To — reporting period date range

The report includes 7 sections: tenant summary, API key summary, model summary, provider summary, daily breakdown, forecasts, and anomalies.

Download​

  • PDF — click the PDF icon to download a formatted PDF report
  • CSV — click the CSV icon to download raw data as CSV

Delete Report​

Click Delete to remove a report. Requires confirmation.

Compliance Reports​

Navigate to Cost > Compliance Reports in the top navigation. Requires enterprise license.

Report List​

Displays all compliance reports with ID, type (SOC2/HIPAA/GDPR), tenant, period, generated date, and actions. Auto-refreshes every 10 seconds.

Use the Type and Tenant dropdown filters to narrow the list.

Generate Report​

Click Generate to create a new compliance report:

  • Type — SOC2 Type II, HIPAA, or GDPR
  • Tenant ID — scope to a specific tenant (blank = all tenants)
  • From / To — reporting period date range

Report contents by type:

SOC2HIPAAGDPR
Audit chain integrityAccess logData processing activities
Access control summaryAuthorization logTenant data residency
Policy enforcement summaryPolicy violationsConsent and policy status
Data residencyData access patternsData retention
Token usage summaryAudit integrityAudit integrity
Event count by type

Download PDF​

Click the PDF icon to download the compliance report as a formatted PDF document.

Delete Report​

Click Delete to remove a report. Requires confirmation.

MCP Servers​

Navigate to MCP in the top navigation.

Server List​

Displays all registered MCP servers with server ID, tenant, transport type, URL, status (color-coded pill: green for ACTIVE, amber for SUSPENDED, red for DISABLED), tool count, tags, and actions. Auto-refreshes every 10 seconds.

Use the Tenant dropdown filter to narrow the list.

Create / Edit Server​

Click New Server to register a new MCP server with:

  • Server ID — human-readable slug, must be unique per tenant (e.g., code-search, web-browser)
  • Tenant ID — the tenant this server belongs to (required on create)
  • Transport — protocol type (HTTP_SSE)
  • URL — MCP server endpoint URL (required)
  • Credential Ref — vault path for server credentials (optional, e.g., vault://secret/mcp/code-search)
  • Tags — comma-separated tags for categorization (optional)
  • Status — ACTIVE, SUSPENDED, or DISABLED (edit only)

In edit mode, the right panel shows:

  • Health Check — click "Check Health" to test server connectivity. Displays reachable status, HTTP status code, and latency.
  • Tool Catalog — table of cached tool definitions (name and description). Click "Sync Tools" to fetch the latest tool list from the MCP server.

Health Check​

Click the health icon on any server row or use the health panel in the edit form to test live connectivity. The result shows whether the server is reachable, the HTTP status code, and latency in milliseconds.

Tool Sync​

Click "Sync Tools" in the edit form to fetch the tool catalog from the MCP server. Requires enterprise license.

MCP Tool Calls​

Navigate to Agents > Tool Calls in the top navigation. Requires enterprise license.

Tool Call List​

Displays a table of MCP tool call records with timestamp, tenant, session ID, server ID, tool name, operation, HTTP status, latency, policy decision, PII flags, and error info. Auto-refreshes every 5 seconds.

Filters: narrow by tenant, session ID, server ID, and tool name.

Tool Call Detail​

Click any row to expand it and view the full tool call record including trace ID, user ID, response bytes, error code, and error message.

Summary View​

The summary endpoint aggregates tool call statistics by server and tool, showing total calls, error counts, and average latency per tool.

Agent Sessions​

Navigate to Agents > Sessions in the top navigation. Requires enterprise license.

Session List​

Displays all agent sessions with session ID, tenant, status (active/inactive), tool call count, error count, total latency, distinct servers, distinct tools, first seen, and last seen timestamps. Auto-refreshes every 5 seconds.

Filters:

  • Tenant — dropdown filter
  • Active — toggle to show only active sessions
  • Search — search by session ID

Session Detail​

Click any session row to navigate to the detail page (/mcp/sessions/\{id\}), which includes:

Summary Stats Bar:

  • Average latency per tool call
  • Error rate (errors / total calls)
  • Session duration (first seen to last seen)
  • Total response bytes

Distinct Tools:

A table of all tools invoked in this session with call counts.

Timeline:

A chronological timeline of all tool calls in the session, auto-refreshing every 3 seconds. Each entry shows:

  • Timestamp
  • Server ID and tool name
  • HTTP status (color-coded)
  • Latency
  • PII badges (if PII detected in args or response)
  • Policy decision badge (ALLOW/DENY)
  • Error details (if any)

Kill Session​

Click Kill Session to terminate an active session. This blocks all future tool calls for the session, returning 403 SESSION_KILLED for any subsequent requests. Requires confirmation.

JSON Export​

Click Export JSON to download the full session record with all tool calls as a JSON file.

Approval Queue​

Navigate to Agents > Approval Queue in the top navigation. Requires enterprise license.

The approval queue provides a human-in-the-loop gate for sensitive MCP tool calls. When a tool call matches an approval rule (configured via tenant metadata), the request blocks until an admin approves or denies it.

Pending Tab​

Displays pending approval requests with event ID, tenant, server ID, tool name, session ID, user ID, matched rules, requested time, and expires-at time. Auto-refreshes every 3 seconds.

Each row has Approve and Deny buttons. Clicking either resolves the pending request and unblocks the waiting tool call.

History Tab​

Displays resolved approvals with event ID, tenant, server ID, tool name, action (approve/deny, color-coded badge), requested time, resolved time, and elapsed time. Auto-refreshes every 10 seconds.

The Approval Queue navigation item displays a live badge count of pending approvals, updated every 5 seconds.

Analytics Dashboard​

Navigate to Agents > Analytics in the top navigation. Requires enterprise license.

The analytics dashboard provides aggregate insights into agent behavior across all sessions.

Summary Cards​

Four top-level stats: total sessions, total tool calls, overall error rate, and average session duration.

Session Outcomes​

A Chart.js donut chart showing the distribution of session outcomes (completed, killed, timed out, errored).

Approval Funnel​

A Chart.js bar chart showing the approval pipeline: requested, approved, denied, timed out.

Agent Leaderboard​

A table of the top 20 sessions ranked by tool call count, showing session ID, tenant, tool calls, errors, distinct tools, and duration. Auto-refreshes every 10 seconds.

Tool Call Heatmap​

A server-by-tool matrix showing call counts as a heatmap. Helps identify which tools are most heavily used on which servers. Auto-refreshes every 10 seconds.

Policy Firing Frequency​

Shows how often different policy rules are triggered across agent sessions.

Health Probes​

The UI exposes Spring Boot Actuator health endpoints:

EndpointPurpose
GET /actuator/health/livenessKubernetes liveness probe
GET /actuator/health/readinessKubernetes readiness probe (includes controlPlane health)

The readiness probe checks connectivity to gateway-server. If the server is unreachable, the readiness probe reports DOWN while the UI continues to serve the dashboard with degraded data.

Configuration​

PropertyEnv VarDefaultDescription
gateway.control-plane.urlGATEWAY_SERVER_URLhttp://localhost:8080Gateway server base URL
gateway.control-plane.connect-timeout-ms—5000Connection timeout (ms)
gateway.control-plane.read-timeout-ms—10000Read timeout (ms)

Docker​

# docker-compose.yml
gateway-ui:
  environment:
    GATEWAY_SERVER_URL: http://gateway-server:8080
  healthcheck:
    test: ["CMD", "curl", "-sf", "http://localhost:8090/actuator/health/liveness"]

Kubernetes / Helm​

# values.yaml
gatewayUi:
  enabled: true
  replicaCount: 1
  image:
    repository: ghcr.io/kdhrubo/dvara/gateway-ui
  resources:
    requests:
      cpu: 100m
      memory: 256Mi
    limits:
      cpu: 1
      memory: 512Mi

Health probes are auto-configured by the Helm chart:

livenessProbe:
  httpGet:
    path: /actuator/health/liveness
    port: http
readinessProbe:
  httpGet:
    path: /actuator/health/readiness
    port: http
startupProbe:
  httpGet:
    path: /actuator/health/liveness
    port: http

Architecture​

Browser (HTMX polls every 3–10s)
  → gateway-ui (port 8090)
     ├── DashboardController          (SSR pages + HTMX fragment endpoints)
     ├── TenantController             (tenant CRUD + forms)
     ├── ApiKeyController             (key create / list / revoke)
     ├── RouteController              (route CRUD + version history + rollback + canary)
     ├── PolicyController             (policy CRUD + dry-run + shadow + promote)
     ├── AuditController              (live audit log + filtering + CSV export)
     ├── McpServerController          (MCP server CRUD + health + tool sync)
     ├── UserController               (user CRUD + role management)
     ├── CostController               (cost dashboard + charts + forecasts)
     ├── PricingController            (model pricing CRUD)
     ├── BudgetController             (budget cap CRUD + status)
     ├── ChargebackController         (chargeback reports + PDF/CSV)
     ├── ComplianceReportController   (compliance reports + PDF)
     ├── McpToolCallController        (tool call history + detail)
     ├── McpSessionController         (session management + timeline + kill)
     ├── ApprovalQueueController      (approval queue + history + resolve)
     ├── AnalyticsController          (analytics dashboard + charts)
     ├── ControlPlaneClient           (RestClient → gateway-server)
     ├── PrometheusMetricsParser      (Prometheus text → MetricSample list)
     ├── DashboardMetricsService      (samples → dashboard-ready DTO)
     └── ControlPlaneHealthIndicator  (readiness probe)
  → gateway-server (port 8080)
     ├── GET /status                   (gateway status JSON)
     ├── GET /actuator/prometheus      (Prometheus metrics)
     ├── /admin/v1/tenants             (tenant CRUD)
     ├── /admin/v1/tenants/{id}/keys   (API key management)
     ├── /admin/v1/routes              (route configuration + canary)
     ├── /admin/v1/policies            (policy configuration + shadow)
     ├── /admin/v1/audit/events        (audit event query + CSV/JSON export)
     ├── /admin/v1/users               (user + role management)
     ├── /admin/v1/pricing             (model pricing)
     ├── /admin/v1/costs               (cost records + summary)
     ├── /admin/v1/budgets             (budget caps + usage)
     ├── /admin/v1/chargeback          (chargeback reports)
     ├── /admin/v1/reports             (compliance reports)
     ├── /admin/v1/mcp/servers         (MCP server registry)
     ├── /admin/v1/mcp/tool-calls      (tool call records)
     ├── /admin/v1/sessions            (agent sessions)
     └── /admin/v1/approvals           (approval queue)

The UI uses Thymeleaf for server-side rendering and HTMX for dynamic fragment polling. Bootstrap 5 and Bootstrap Icons are loaded via WebJars. Chart.js 4 is used for cost and analytics visualizations. CodeMirror 5 provides YAML syntax highlighting in the policy editor. All styling uses a light professional theme.

Last updated on by kdhrubo78