UI overview & navigation
How the CertAutoPilot web UI is laid out: the top navigation bar, the project selector that scopes almost everything, the sticky Settings sub-navigation, the user menu with the dark-mode toggle and built-in help pages, and how sessions refresh and expire.
Overall layout
The UI uses a single sticky header, not a left sidebar. From left to right:
- Logo + product name + version — clicking it returns to the Dashboard. The version number next to the name is the running backend version.
- Main menu — a horizontal menu with the top-level pages (see below).
- Project selector — dropdown that sets the active project.
- User menu — avatar + username, opens a dropdown.
Page content renders below the header with the current route highlighted in the menu. Navigating to a new page scrolls back to the top automatically.
Two warning banners can appear directly under the header: a license grace period banner (days remaining before enterprise features stop) and a license expired/invalid banner (certificate operations disabled). See License.
Main menu
The menu items, in order, and where each one is documented:
| Menu item | Route | Docs page |
|---|---|---|
| Dashboard | / | Main dashboard |
| 47-Day Readiness | /readiness | 47-Day Readiness |
| Certificates | /certificates | Certificates pages |
| Domains | /domains | Domains |
| Discovery | /discovery | Discovery pages |
| Jobs | /jobs | Jobs |
| Audit Logs | /audit | Audit log pages |
| Settings | first visible settings page | Settings sub-navigation |
Clicking Settings jumps to the first settings page your role can see (usually Settings → General for admins).
Project selector
Most resources — certificates, ACME accounts, distributions, jobs, discovery, notification channels — are project-scoped. The project selector in the header determines which project every page shows.
- Switching projects immediately refetches all project-scoped data — every list and detail page re-renders for the new project.
- The choice is persisted in two places: browser
localStorageand your favorite project preference on the server, so the same project is pre-selected on your next login (even from another browser). - On login the UI selects your favorite project, falling back to the previously saved one, then the first project you have access to.
- Pages that need a project show a no project selected placeholder if you have none.
Projects themselves are managed under Settings → Projects (Organizations & projects).
Settings sub-navigation
Opening any Settings page reveals a second horizontal menu that sticks directly under the header while you scroll. The entries are role-filtered:
| Visible to | Entries (in order) |
|---|---|
| Org admin+ | General |
| Org or project operator+ | DNS Credentials · Zones · ACME Accounts · MSCA Connections · Organizations · Distribution · Variables · Certificate Policy |
| Everyone | Notifications · Projects |
| Org owner | Users · LDAP · CA Providers |
| Org admin+ | System Status · Cluster · KEK versions · Syslog · License |
The menu filtering is a convenience — the routes themselves are guarded server-side and client-side. Navigating to a settings URL above your role redirects you back to the Dashboard. Role semantics are described in RBAC & tenancy.
User menu
Click your avatar/username (top right). The dropdown shows your display name and e-mail, then:
- Dark Mode / Light Mode — toggles the theme. The initial theme follows your OS preference; the toggle is persisted in the browser.
- My Profile — password, TOTP, personal settings (Profile).
- My Requests — the approval workflow page (My Requests). For admins a count badge shows pending reviews in the current project; a red dot on the avatar signals the same thing without opening the menu.
- API Docs — built-in help page (see below).
- Module Guides — built-in help page (see below).
- Sign Out — logs out and invalidates the session tokens.
Built-in help pages
Two reference pages ship inside the app itself, reachable only from the user menu:
- API Docs (
/api-docs) — an interactive REST API reference. Endpoints are grouped into tabs (Auth, Projects, Certificates, ACME, DNS & Zones, Distribution, Jobs, Notifications, Settings) with method, path, minimum role, request-body fields, an example response, and copy buttons. Complements the API reference in this documentation. - Module Guides (
/module-guides) — per-module setup guides for every distribution module (SSH, Kubernetes, Webhook, NetScaler, F5 BIG-IP, Huawei Cloud, Vault, IIS, SMTP, WinRM, AWS ACM, MerlinCDN) with copyable configuration snippets. The equivalent docs live under Distribution.
Notifications & errors
Success and error feedback surfaces as toast pop-ups in the top-right corner — e.g. "Renewal requested", "Failed to link distribution" with the backend error message. Longer-running feedback (bulk actions, distribution runs) additionally renders inline progress bars on the page that started them. Inline alert banners (yellow/red boxes at the top of a page or card) are used for persistent conditions such as policy violations, license limits, or a certificate awaiting approval.
Sessions & expiry
Authentication uses short-lived access tokens in httpOnly cookies (see Auth & RBAC):
- When an API call returns 401 because the access token expired, the UI silently refreshes the session and retries the request — you don't notice anything. Concurrent 401s share a single refresh. Your roles are re-synced from the server on every refresh, so a role change takes effect without re-login.
- CSRF token mismatches after a refresh are also retried transparently.
- If the refresh fails — refresh token expired (7 days), revoked, or token reuse detected — the UI clears the session and returns you to the login page. The selected project is cleared with it.
- On a fresh installation (setup not completed) every route redirects to the setup wizard instead.