Platform UI

The KubeOpera frontend is a Next.js application. Every route under the dashboard is wrapped in an auth guard, and navigation runs through a shared sidebar component (DashboardSidebar.tsx) that renders one of two different navigation trees depending on who's signed in — a platform-admin tree and a tenant-customer tree, selected by the caller's userType. These aren't a cosmetic subset of each other; they're genuinely different menus pointed at genuinely different parts of the product, so they're documented separately below rather than flattened into one generic tree.

Navigation — platform admin

Dashboards
├── Dashboard
├── Cost
├── Performance
├── Security
├── SLOs
├── APM
├── Traces
├── AI Optimizer
└── Actions
Resources
├── Workloads
├── Cloud Spaces
├── Environments
└── AI Agents
Clusters
├── All Clusters
└── Multi-Cluster
Pipelines
Build Configs
Analytics
Incidents
AI Agents
├── Overview
├── Agent Runs          ← live reasoning stream viewer
├── Observability
├── Analysis
├── Actions
└── Recommendations
Node Pools
Settings
├── Users
├── Groups
├── Permissions
├── Tenants
└── AI Provider Key
Support
├── Pending Tickets
├── Create a Ticket
└── Live Chat

Navigation — tenant customer

A signed-in customer sees a narrower, tenant-scoped tree instead — there's no Clusters, Node Pools, or platform Settings section, since those operate on infrastructure a tenant doesn't own or see.

Dashboard
Resources
├── Workloads
├── Cloud Spaces
├── Environments
└── Pipelines
Monitoring
├── Cost
├── Performance
├── Security
├── Incidents
├── SLOs
├── APM
└── Traces
AI Operations
├── AI Agents
├── AI Runs
├── Observability
├── Analysis
└── Recommendations
Team Members
Support
├── Tickets
└── Live Chats

"Team Members" is deliberately tenant-wide rather than nested under a Cloud Space — a Cloud Space is an infrastructure/billing container, not the boundary a tenant manages its own users against.

API Proxy Layer

Every page in the frontend talks to backend services through Next.js API routes under /api/. These routes:

• Enforce an SSRF allowlist (ALLOWED_UPSTREAM_EXACT) so only known service hostnames can be upstream targets
• Retry across multiple base URL candidates (configured URL first, then in-cluster service name)
• Normalise responses to JSON with standard error shapes
• Support GET, POST, and SSE (Server-Sent Events) streaming

Frontend route	Target service	Port
/api/kubeopera/*	kubeopera-api	8080 (local dev default; the deployed container listens on 8090 — see KubeOpera API)
/api/k8s-monitor/*	k8s-monitor	8085
/api/security/*	security-api	8086
/api/cicd/*	cicd-gateway	8087
/api/anomalies/*	anomaly-detector	8088
/api/forecasts/*	predictive-scaler	8089
/api/incidents/*	incident-manager	8090
/api/agents/observability/*	observability-agent-srv	8092
/api/agents/analysis/*	analysis-agent-srv	8093
/api/agents/action/*	action-agent-srv	8094
/api/agents/feedback/*	feedback-agent-srv	8095
/api/agents/recommendation/*	recommendation-agent-srv	8096
/api/agents/runtime/*	agent-runtime	8111
/api/ai/chat	Anthropic API (streaming)	—

The agent-runtime row is worth a specific note: the frontend proxy route's own hardcoded fallback still says 8097, left over from an early port assignment before agent-runtime and k8s-optimizer were split into separate services — 8097 is actually k8s-optimizer's real port today. In practice this fallback is rarely exercised, since AGENT_RUNTIME_BASE_URL is expected to always be set explicitly in every real deployment; it's flagged here so it isn't mistaken for the correct default.

AI Chat

The AI chat sidebar is available on every page. It uses the Anthropic Streaming API (Claude Sonnet 4.6) with 25 registered tools spanning cluster health, cost, security, CI/CD, anomalies, forecasts, incidents, agent telemetry, recommendations, and the AI Optimizer's own status/report endpoints. Tool calls appear as progress indicators in the chat UI during streaming. The chat can:

• Query real-time cluster health, cost, and security data
• Retrieve anomaly events, forecasts, and incidents
• Read agent telemetry, analysis results, action logs, and recommendations
• Return answers grounded in live cluster state — not generic advice

A signed-in customer sees a much smaller allowlist of these tools (currently get_app_profile and get_app_advice, scoped to their own apps) rather than the full 25 — see Auth Service and KubeOpera API for how tenant scoping is enforced elsewhere in the platform.

Environment Variables

Key environment variables for the frontend:

# Anthropic
ANTHROPIC_API_KEY=sk-ant-...

# Infrastructure services
K8S_MONITOR_BASE_URL=http://k8s-monitor:8085
KUBEOPERA_API_BASE_URL=http://kubeopera-api:8080
SECURITY_API_BASE_URL=http://security-api:8086

# Automation services
CICD_GATEWAY_BASE_URL=http://cicd-gateway:8087
ANOMALY_DETECTOR_BASE_URL=http://anomaly-detector:8088
PREDICTIVE_SCALER_BASE_URL=http://predictive-scaler:8089
INCIDENT_MANAGER_BASE_URL=http://incident-manager:8090

# Agentic AI layer
OBSERVABILITY_AGENT_SRV_BASE_URL=http://observability-agent-srv:8092
ANALYSIS_AGENT_SRV_BASE_URL=http://analysis-agent-srv:8093
ACTION_AGENT_SRV_BASE_URL=http://action-agent-srv:8094
FEEDBACK_AGENT_SRV_BASE_URL=http://feedback-agent-srv:8095
RECOMMENDATION_AGENT_SRV_BASE_URL=http://recommendation-agent-srv:8096
AGENT_RUNTIME_BASE_URL=http://agent-runtime:8111

KUBEOPERA_API_BASE_URL's 8080 here is a genuine, deliberate local-dev default — it's the value in the frontend's own .env.example, distinct from kubeopera-api's deployed container port (8090). Both are real; which one applies depends on whether you're running the frontend against a local kubeopera-api or a deployed one.