feat(hub): align hub UI with e-INFRA design system and UI/UX mocks - #132
Merged
Conversation
…gation - home.tsx: stopped state renders hero-lite (icon circle, H1, Start my server, helper caption); not_running.tsx redirects there unless the spawn failed or implicit spawn is pending - HubHeader: NavigationMenu primitives, "Tokens" renamed to "Get Token" - Layouts: page body wrapped in DS Content instead of ad-hoc <main> - Bump @e-infra/design-system to 0.1.9 in hub/ui and landing Co-Authored-By: kimi-k3 <noreply@moonshot.ai>
- home.tsx: one hero composition for stopped/starting/stopping/running (success circle when up, dominant Open my server, small error Stop); card and status badges removed - transitions redirect to spawn-pending for any pending event — the hub picks spawn_pending or stop_pending there; never navigate to the user server URL while stopping (dying proxy would serve errors) - spawn_pending.tsx: mock-aligned hero with real stream percentage, clock hint, collapsed event log, failure variant with retry - stop_pending.tsx: same layout, indeterminate, polling untouched Co-Authored-By: kimi-k3 <noreply@moonshot.ai>
…ero chrome Both failed states (hub-rendered not_running, EventSource-driven spawn_pending) render the mock layout: status icon, H1 + reassuring Lead copy, lg primary Try again, support link to GitHub issues, and a collapsed event log holding the raw failure detail. Shared hero chrome lives in components/Hero.tsx with zero duplicated markup. Co-Authored-By: kimi-k3 <noreply@moonshot.ai>
No-mock audit of the remaining hub pages: spawn shows the failed state instead of silently auto-retrying when the hub renders it with a spawn error; token revokes confirm via AlertDialog; admin uses DS Link/Skeleton and aligns its Stop button with home; shared PageBody for token/admin; failure copy constant consumed by all three failed states. Co-Authored-By: kimi-k3 <noreply@moonshot.ai>
… revoke The spawn.html Jinja variable was error_html_message, which JupyterHub never passes (handlers use html_error_message) — rich failure detail was a dead branch. Server-token revokes now use the same confirmed RevokeButton as the other token tables. Co-Authored-By: kimi-k3 <noreply@moonshot.ai>
admin_access is only injected by the admin page handler in JupyterHub stock context, so the Admin nav link vanished everywhere else; templates now fall back to user.admin from the default context. The icon-bearing card header pattern (six pages, drifting variants) is one IconCardHeader component. Co-Authored-By: kimi-k3 <noreply@moonshot.ai>
AlertDialogAction for revoke and delete-user confirmations now carries the DS error button style instead of the default primary look. Co-Authored-By: kimi-k3 <noreply@moonshot.ai>
Co-Authored-By: kimi-k3 <noreply@moonshot.ai>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Redesigns the JupyterHub user-facing pages (
hub/ui/) around the e-INFRA design system and the UI/UX team's mocks:/hub/homeis the single stopped-server page;not_runningclient-side redirects to it and only renders failed spawns and implicit-spawn countdowns. Four-state hero (stopped/starting/stopping/running).spawn_pendingandstop_pendingshare one hero visual language — status icon circle, H1, progress/clock hint, separator, collapsed event log. Both transitions route through the canonical/hub/spawn-pending/:user(the hub picks the template); never to the dying user-server proxy URL.not_running, EventSource-drivenspawn_pending) follow the mock — reassuring body copy, lg primary Try again, "Contact support" → https://github.com/CERIT-SC/mddash/issues, raw failure detail in a collapsed log. The failure transition isaria-live-announced.components/Hero.tsx(PageHero,StatusIcon,HeroHeading,WaitHint,DetailsLog,LogEntry,SupportNote) — zero duplicated markup across the four pages.NavigationMenuprimitives; AuthedLayout wraps pages in DSContent.@e-infra/design-systemto ^0.1.9 inhub/uiandlanding.Verification:
make fix,make type-check(ty across Python services, tsc across all three UIs), hub/ui production build with entry validation,make test— all green.Known upstream dependency: DS typography components (
Muted,Lead,Small) currently render in full-foreground color despite their docs; fixed in CERIT-SC/design-system#107. No local overrides were added — the next DS release just picks up the fix.Co-authored-by: Kimi K3