Skip to content

feat(ui): responsive dashboard with quota reset times#19

Open
jphein wants to merge 3 commits into
KarpelesLab:masterfrom
jphein:feat/ui-responsiveness
Open

feat(ui): responsive dashboard with quota reset times#19
jphein wants to merge 3 commits into
KarpelesLab:masterfrom
jphein:feat/ui-responsiveness

Conversation

@jphein

@jphein jphein commented Jun 1, 2026

Copy link
Copy Markdown

Summary

Brings the web dashboard (/teamclaude/ui) to a polished, responsive state and surfaces quota reset times alongside utilization.

  • Responsive dashboard — fluid card grid with container queries; layout adapts down to narrow cards (08c80a7).
  • Reset-time display — each 5h/7d quota bar now shows when its window rolls over (↺ HH:MM within a day, weekday + time beyond), with the full timestamp on hover. Reads unified5hReset/unified7dReset (epoch-ms from Anthropic rate-limit headers) already exposed by getStatus(), with a fallback to legacy resetsAt (444281e).
  • Fast shutdown + live HTML reload — server reads web/index.html from disk per request (Cache-Control: no-store), so dashboard edits are live without a restart (08c80a7).

Pre-Landing Review

No issues found. Verified the reset feature is wired end-to-end: backend stores reset timestamps as epoch-ms (account-manager.js:173-174), getStatus() forwards the full quota object via spread (account-manager.js:340), and the frontend fmtReset(ms) consumes ms directly and guards null/past values. Units consistent on both sides. Secret scan clean.

Test plan

  • No automated test suite in this project (package.json defines only start).
  • Manual: open http://localhost:3456/ui against a running proxy with active accounts and confirm reset labels render next to each bar and resize cleanly on a narrow window.

Generated with Claude Code

jphein and others added 3 commits May 22, 2026 10:29
Out-of-band control surfaces for when teamclaude runs headless (systemd, container) and the interactive TUI never renders.

- POST /teamclaude/switch — pin the active account by name
- POST /teamclaude/threshold — change rotation cutoff (0..1), persisted
- GET /ui — single-page dashboard polling /teamclaude/status every 2s
- teamclaude switch <name> + teamclaude threshold <value> CLI wrappers
- Pathname-based routing (handles query strings) + lazy in-memory HTML cache (per Gemini review)
Three dev-ergonomics improvements bundled together:

- src/web/index.html: container queries + clamp() typography +
  auto-fill grid so the dashboard adapts cleanly to narrow Wave
  blocks. Adds .top/.name-text wrappers + ellipsis to keep long
  account names from blowing out the card layout.
- src/server.js: remove HTML cache so /ui reads from disk every
  request. Dev iteration on the dashboard no longer requires a
  daemon restart. The 'no-store' header was already there; the
  in-memory cache was the actual blocker.
- src/index.js: unified SIGINT/SIGTERM handler that calls
  server.closeAllConnections?.() before server.close() and adds
  a 2s safety-net setTimeout(..., 2000).unref() for hard exit.
  Fixes restart hang when an in-flight Claude stream was holding
  the socket open past systemd's TimeoutStopUSec.
Add a reset-time column to each 5h/7d quota bar so the dashboard shows
when each window rolls over, not just current utilization. Reads the
unified5hReset/unified7dReset (epoch-ms from Anthropic rate-limit
headers) already exposed by getStatus(); falls back to legacy resetsAt.
Times render compactly (HH:MM within a day, weekday otherwise) with the
full timestamp on hover, and the bars grid gains a responsive variant
for narrow cards. Bump to 1.0.7.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant