Skip to content

feat(app): expose full token scoping + polish audit logs UI#739

Merged
HugoRCD merged 1 commit into
mainfrom
feat/token-ui-restrictions
Apr 21, 2026
Merged

feat(app): expose full token scoping + polish audit logs UI#739
HugoRCD merged 1 commit into
mainfrom
feat/token-ui-restrictions

Conversation

@HugoRCD
Copy link
Copy Markdown
Owner

@HugoRCD HugoRCD commented Apr 21, 2026

Summary

The backend has supported scoping tokens by team / project / environment and an IP allowlist since v5, but the UI only exposed a tiny popover with name + expiry + permissions. This PR wires the full surface up.

Also polishes the audit-logs table, which got unreadable once the raw `User-Agent` column was added.

Tokens

  • Modal-based create flow (apps/shelve/app/components/token/Create.vue) with:
    • Teams / Projects / Environments multi-selects (projects & envs cascade from the selected teams, lazy-fetched per team and cached).
    • IP allowlist: add/remove CIDRs with inline regex validation — same regex the server enforces.
    • Live restriction summary (`2 team(s) · 3 project(s) · 1 CIDR(s)`).
    • Friendly "Unscoped token" warning alert when no restriction is set.
    • Two-step flow: form → "save the secret" view with copy.
  • Tokens table now shows real scope info via a new `TokenScopes.vue` component: badges like `2 teams`, `3 projects`, `1 env`, `2 CIDRs` (tooltip listing the actual ids/CIDRs), plus the existing `read` / `write` chips. Falls back to `unscoped` when nothing is set. Replaces the unhelpful single "scoped" badge.
  • Type fix: `Token.allowedCidrs: string[]` added to the public type — the GET `/api/tokens` endpoint already returned it, the type was just lying.

Audit logs

  • Action badges are now color-coded by category:
    • `.create` / `.invite` → success (green)
    • `.delete` / `.remove` → error (red)
    • `.update` / `token.` → warning (amber)
    • `auth.*` → info (blue)
    • other → neutral
  • Resource cell: icon + name + mono `#id` for `variable`, `environment`, `project`, `team`, `token`, `user`.
  • Actor badges carry a matching icon (`user-round` / `key-round` / `cpu`).
  • IP rendered as a small monospace pill instead of raw text.
  • Client column (renamed from "User Agent"): new `parseUserAgent` util turns the raw UA into a compact label — `Shelve CLI 5.0.0`, `Chrome 147 · macOS`, `Node.js`, `curl 8.6.0`, `Postman`, `GitHub Actions`, etc. — with the full UA preserved in the tooltip on hover. No more 200-char rows.
  • New `{}` column: per-row metadata popover showing the full JSON payload for events that have one.
  • Empty state + centered "Load more" below the table (was crammed in the actions slot).

Changeset

Included (`@shelve/app: minor`).

Tokens

- Replace the cramped create-token popover with a modal so there is
  room for the full scope surface the backend already supports: teams,
  projects, environments, and IP allowlist (CIDR ranges with inline
  validation). Project/environment pickers cascade from the selected
  teams.
- Show a clear "unscoped token" warning when no restriction is applied.
- Table now shows what each token is actually scoped to (teams /
  projects / envs / CIDRs counts, tooltip with the ids) instead of a
  generic "scoped" badge.
- Type: Token.allowedCidrs is now part of the public Token type (the
  API already returned it).

Audit logs

- Color-code action badges by category (create=success, delete=error,
  update/token.*=warning, auth.*=info) and add resource icons.
- Actor badges carry a matching icon (user/key-round/cpu).
- IP rendered as a monospace pill.
- Parse the raw User-Agent into a friendly client label (e.g.
  "Shelve CLI 5.0.0", "Chrome 147 · macOS", "Node.js", "curl 8.6.0")
  with the full UA on hover, instead of taking half the row.
- New metadata popover ({} icon) showing the full JSON payload for
  each event.
- Empty state + centered "Load more".
@vercel
Copy link
Copy Markdown

vercel Bot commented Apr 21, 2026

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
shelve-app Building Building Preview, Comment, Open in v0 Apr 21, 2026 4:06pm
shelve-lp Building Building Preview Apr 21, 2026 4:06pm
shelve-vault Ready Ready Preview, Comment Apr 21, 2026 4:06pm

@github-actions github-actions Bot added the feature New feature or request label Apr 21, 2026
@github-actions
Copy link
Copy Markdown
Contributor

github-actions Bot commented Apr 21, 2026

Thank you for following the naming conventions! 🙏

@HugoRCD HugoRCD merged commit 1a0fd9d into main Apr 21, 2026
14 of 15 checks passed
@HugoRCD HugoRCD deleted the feat/token-ui-restrictions branch April 21, 2026 16:07
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

feature New feature or request

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant