Open-Source Wikis

/

Vault

/

Systems

/

UI

hashicorp/vault

UI

The Vault web UI is an Ember.js single-page app that the server binary embeds and serves at /ui. Source: ui/. Build artifacts end up in http/web_ui/. The UI is large in its own right — 1,674 JS files, 730 Handlebars templates, 495 TypeScript files, ~33k LoC excluding lockfiles.

Purpose

Provide a graphical, opinionated client for Vault. The UI doesn't expose every API endpoint; it focuses on flows that benefit most from a wizard (mount creation, KV browsing, PKI issuance, identity inspection, replication monitoring).

Directory layout

ui/
├── app/                        # Ember app: routes, controllers, components, models
├── lib/                        # In-repo Ember addons (core, console, kmip, ...)
├── tests/                      # Ember test suite + Mirage helpers
├── e2e/                        # Playwright end-to-end specs
├── mirage/                     # API mocks
├── scripts/                    # Build helpers (icons, jsdoc, …)
├── public/                     # Static assets bundled into dist
├── types/                      # TypeScript declarations
├── package.json, pnpm-lock.yaml, pnpm-workspace.yaml
├── ember-cli-build.js, jsconfig.json, tsconfig.json
├── playwright.config.ts
├── README.md, MODULE_REPORT.md, DEP_OVERRIDE_REPORT.md
└── vault-reporting/            # in-house reporting addon

ui/app/ contains hundreds of components grouped by domain (auth, secrets, policies, replication, identity, kmip, raft, namespaces). The lib/core/ addon hosts shared primitives and the lib/console/ addon hosts the in-UI CLI emulator.

Building

The UI is built with ember-cli and pnpm. The Makefile targets relevant to UI are:

  • make ember-dist → runs pnpm install && pnpm build in ui/, then copies the dist/ into http/web_ui/.
  • make static-dist dev-ui → builds UI and the Vault binary with the UI bundle embedded.
  • pnpm start (inside ui/) opens the dev server on port 4200, proxying API calls to a local Vault.

http/assets.go (with assets_stub.go for OSS builds without UI) embeds the dist via embed.FS.

How it talks to Vault

The UI uses the same HTTP API every client uses. Authentication tokens are stored in browser session storage; the client passes them as X-Vault-Token. No special server endpoints exist for the UI except a thin set under /v1/sys/internal/ui/...:

  • /v1/sys/internal/ui/feature-flags (in http/sys_feature_flags.go)
  • /v1/sys/internal/ui/mounts, /.../mounts/<path> — surface mount metadata to non-root tokens.
  • /v1/sys/internal/ui/resultant-acl — let the UI display "what can this token do here".
  • /v1/sys/internal/counters/... — UI versions of the counters API.

These exist so the UI can render correctly with limited tokens; they return only what the caller is allowed to see.

Custom messages

vault/ui_custom_messages/ (and vault/logical_system_custom_messages.go) lets operators inject banners and notices into the UI without redeploying — used for maintenance windows and licensing notices.

Testing

Three layers:

  • Component / integration tests in ui/tests/integration/ (ember-cli + qunit).
  • Acceptance / route tests in ui/tests/acceptance/ (qunit + Mirage mocks in ui/mirage/).
  • End-to-end in ui/e2e/ driven by Playwright (playwright.config.ts).

CI workflow: .github/workflows/test-ui.yml.

Reporting addon

ui/vault-reporting/ is an Ember addon that emits anonymous usage telemetry under operator control (off by default in the OSS bundle). Disable via disable_clustering and friends in the ui block of the server config.

Integration points

  • Bundle embedded in the Vault binary via http/assets.go.
  • Served at /ui by http/handler.go when ui = true in config.
  • Uses the same API as every other client.
  • Settings UI surfaces seal-status, health, replication/status, identity store, policies, raft autopilot.

Entry points for modification

  • New UI route: add an Ember route + template under ui/app/.
  • New component: add to ui/app/components/ or the appropriate addon under ui/lib/.
  • Mock a new API endpoint for tests: edit ui/mirage/handlers/.
  • New JS dependency: add to ui/package.json and run pnpm install. Note DEP_OVERRIDE_REPORT.md for known overrides.

Built by Factory AutoWiki from public repository content. It is a generated preview for codebase exploration, not source-maintained documentation.

UI – Vault wiki | Factory