The Dashboard

Sentinel ships with a fully embedded React security dashboard that gives you real-time visibility into every aspect of your application's security posture. The dashboard is built with React 19, Vite, TailwindCSS 4, Recharts, and React Router, and is served directly from your Go binary at /sentinel/ui — no separate frontend deployment required.

The entire UI uses a dark theme optimized for security operations. All assets are compiled into your Go binary via go:embed, so the dashboard works out of the box with zero external dependencies at runtime.

Authentication

The dashboard is protected by JWT-based authentication. When you access the UI, you are presented with a login screen that accepts a username and password. These credentials are configured in the DashboardConfig struct.

1sentinel.Mount(r, nil, sentinel.Config{
2    Dashboard: sentinel.DashboardConfig{
3        Username:  "admin",
4        Password:  "s3cur3-p4ss!",
5        SecretKey: "my-jwt-secret-change-in-production",
6    },
7})

On successful login, the server returns a JWT token. The React app stores this token exclusively in React state (via useState inside an AuthContextprovider) — it is never written to localStorage, sessionStorage, or cookies. This means the token is automatically cleared when the browser tab is closed or the page is refreshed, providing a secure session model that is immune to XSS-based token theft from persistent storage.

Every subsequent API call includes the token in the Authorization: Bearer header. If the token expires or becomes invalid, the API responds with HTTP 401 and the dashboard automatically redirects to the login page.

Pages Overview

The dashboard contains 13 pages, each focused on a specific aspect of your security operations. All pages are accessible from the sidebar navigation after logging in.

Dashboard (Overview)

The main Dashboard page is the landing page after login. It provides a high-level snapshot of your security posture with four key components:

• Security Score Ring — A donut chart that displays your overall security score (0-100). The score is computed from WAF coverage, rate limiting configuration, threat resolution rate, and other factors.
• Stat Cards — Summary cards showing total threats in the last 24 hours, blocked vs. logged counts, active threat actors, and requests per minute.
• Threat Timeline — A table of the most recent threat events with IP, route, threat type, severity, timestamp, and blocked status.
• Live WebSocket Feed — New threat events appear in real time via a WebSocket connection. The page refreshes its data automatically when a new threat arrives.

Threats

The Threats page is a paginated, searchable log of every threat event Sentinel has recorded. You can filter by severity, threat type, IP address, time range, and blocked status. Clicking a row opens a detail modal showing the full request metadata, matched WAF rule, payload, and geographic information.

Actions available on each threat:

• Resolve — Mark the threat as reviewed and resolved.
• False Positive — Flag the detection as a false positive for tuning.

Actors

The Actors page aggregates threat data by source IP to build threat actor profiles. Each profile includes a computed risk score, total event count, severity breakdown, first and last seen timestamps, and geographic location. You can block an actor directly from this page, which adds their IP to the blacklist immediately.

IP Management

The IP Management page blocks and unblocks IP addresses and CIDR ranges (e.g., 10.0.0.0/8, 192.168.1.0/24). Each block has a reason and a lifetime you choose: 1 hour, 24 hours, 7 days, 30 days, or permanent. Blocks are enforced whether or not the WAF is enabled, and every block and unblock is audited. To exempt addresses from inspection instead, use WAF.ExcludeIPs in your config.

WAF

The WAF page switches the running WAF between log, block, and challenge mode. It also sets each built-in category's sensitivity: off, low, medium, or strict. These changes go through PUT /sentinel/api/waf/rules. They apply to live requests immediately, are audited, and last until the next restart. When WAF.Enabled is false, the controls are disabled, because there is no running WAF to change.

The page also creates and deletes custom rules, including log-only rules for staging. It can test any input against the patterns to show what would match.

Rate Limits

The Rate Limits page shows the current rate limiting configuration and live counter states. Counters auto-refresh to show real-time usage for each IP, user, route, and global limit. You can add, change, or remove per-route limits — the change reaches the running rate limiter immediately and lasts until the next restart — and reset individual counters, which is useful for unblocking a legitimate user who hit a limit. Every change is audited.

Analytics

The Analytics page provides six visualization panels:

• Attack Trends — A stacked area chart showing threat volume over time, broken down by attack type. Supports configurable time windows and intervals.
• Threat Distribution — A pie chart showing the proportion of each attack type (SQLi, XSS, Path Traversal, etc.) over the selected period.
• Top Targeted Routes — A horizontal bar chart ranking the most attacked routes in your application.
• Geographic Origin — A breakdown of threat sources by country, showing which geographic regions generate the most attack traffic.
• Time Patterns — Analysis of when attacks occur by hour of day and day of week, helping identify automated attack campaigns.
• Security Score Breakdown — A component-level view of your security score showing how each factor (WAF, rate limiting, threat resolution, etc.) contributes to the overall number.

AI Insights

The AI Insights page requires an AI provider to be configured (Claude, OpenAI, or Gemini). It offers five capabilities:

• Daily Summary — An AI-generated summary of the past 24 hours of security activity, highlighting notable trends and recommendations.
• Natural Language Query — Ask questions about your security data in plain English (e.g., "What were the most common attack types this week?").
• Threat Analysis — Select a specific threat event for AI-powered deep analysis of the attack vector, potential impact, and recommended mitigations.
• Actor Assessment — Generate an AI assessment of a threat actor's behavior pattern, risk level, and recommended response.
• WAF Recommendations — Get AI-generated suggestions for WAF rule improvements based on your recent threat data.

Reports

The Reports page generates compliance reports for three frameworks:

Reports are generated on demand and can be exported as JSON for ingestion into external compliance tooling or record-keeping systems.

Alerts

The Alerts page has two sections: configuration and history. The configuration panel shows the current alert settings (minimum severity threshold and configured channels). The history panel displays a log of all dispatched alerts with timestamps, severity, the triggering event, the delivery channel (Slack, email, webhook), and delivery status.

Audit Log

The Audit Log page is the trail of administrative and security actions: dashboard logins, IP blocks and unblocks, threat resolutions, WAF and rate-limit changes, and report generations. Each entry records the action, the actor (dashboard user or system), a timestamp, and the values before and after.

Verify integrity recomputes every entry's hash chain on the server (GET /sentinel/api/audit-logs/verify). It lists entries that were modified, deleted, or relinked. An entry's detail view shows its chain position and hashes. Set Storage.AuditKey so that someone with database access can't rewrite entries and recompute the chain.

Performance

The Performance page displays route-level latency metrics. For each route in your application, it shows:

• p50 (median) — The 50th percentile response time.
• p95 — The 95th percentile response time (tail latency).
• p99 — The 99th percentile response time (worst-case latency).
• Error Rate — The percentage of responses with non-2xx status codes.

Routes exceeding the SlowRequestThreshold (default 2 seconds) are highlighted. This page helps you correlate security events with performance degradation — for example, identifying routes under active attack that are experiencing elevated latency.

Users

The Users page tracks authenticated user activity. It shows each user extracted by your UserExtractor function, their total request count, last active timestamp, associated security events, and any anomaly flags. This page requires a UserExtractor to be configured in order to display user-level data.

Settings You Change Here

Four things can be changed from the dashboard rather than in code: the WAF's mode and sensitivity, its custom rules, the per-route rate limits, and the alert threshold. Since v2.6.0 each change is stored, so it:

• survives a restart or a deploy
• reaches every other replica within Storage.SyncInterval (5 seconds by default)

Before v2.6.0 a change applied only to the instance that happened to serve the request, so it was lost on the next restart and, behind a load balancer, the dashboard showed one value while the other replicas enforced another.

Each change is written to the audit log with the user, the old value, and the new one. If the storage backend can't keep settings, the change still applies to the instance you are talking to and the response carries a warning saying so — it won't look permanent when it isn't.

Customizing the Prefix

By default, the dashboard is served at /sentinel/ui and the API at /sentinel/api/*. You can change this by setting DashboardConfig.Prefix:

1sentinel.Mount(r, nil, sentinel.Config{
2    Dashboard: sentinel.DashboardConfig{
3        Prefix:   "/admin/security",
4        Username: "secops",
5        Password: "change-me-in-production",
6    },
7})

With this configuration:

Building the Dashboard

The React dashboard source code lives in the ui/dashboard/ directory of the Sentinel repository. It is a standard Vite project with React and TailwindCSS. The production build output goes into ui/dist/, which is embedded into the Go binary via go:embed.

# Install dependencies
npm install

# Run development server (with hot reload)
npm run dev

# Build for production
npm run build

The Go embedding is handled by ui/frontend.go:

1package ui
2
3import (
4    "embed"
5    "io/fs"
6)
7
8//go:embed dist
9var distFS embed.FS
10
11// DistFS returns a sub-filesystem rooted at the dist directory.
12func DistFS() (fs.FS, error) {
13    return fs.Sub(distFS, "dist")
14}

When you build your Go application with go build, the compiled React assets in ui/dist/ are automatically included in the binary. There is no need for a separate static file server or CDN — the dashboard is fully self-contained.

WebSocket Streams

The dashboard uses two WebSocket endpoints for real-time data. Both require a valid JWT token passed as a token query parameter. The connections automatically reconnect with a 5-second backoff if disconnected.

The WebSocket connection URL is constructed dynamically based on the current page protocol and host:

// Protocol is auto-detected (ws: for http, wss: for https)
const proto = window.location.protocol === 'https:' ? 'wss:' : 'ws:';
const url = `${proto}//${window.location.host}/sentinel/ws/threats?token=${jwt}`;

Next Steps

• Dashboard Configuration — Full reference for DashboardConfig fields
• WAF Deep Dive — Advanced WAF configuration and custom rules
• Rate Limiting — Configure rate limits visible in the dashboard
• Anomaly Detection — Behavioral analysis feeding dashboard insights
• Threat Intelligence — IP reputation data displayed in actor profiles