feat(ui): add loading feedback for slow actions across the app#7
Merged
martinezharo merged 2 commits intoJun 25, 2026
Merged
Conversation
Surface progress for the actions that round-trip to the network or storage so they never look frozen: - New `Spinner` UI primitive (currentColor SVG ring) used everywhere below. - Auth: `useAuth` now tracks `signingIn` / `signingOut`. The sidebar sign-in button shows a spinner + "Signing in…" through the off-page GitHub redirect (cleared only on error so it can be retried), and sign-out shows a spinner while the session and local data are cleared. Both buttons disable while busy. - First load: KlipCodeApp shows a centered spinner while the initial IndexedDB workspace read is pending, instead of a blank shell on a cold start. - Landing: the "Open app" / hero / final CTAs use Next's `useLinkStatus` to flip their arrow to a spinner the moment they're clicked, since navigating into the app shell is a real round-trip on first visit. Adds `auth.signingIn` / `auth.signingOut` to both locale dictionaries. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01XFQW9aw6XqpwkQUScq3ogU
Contributor
Deploying with
|
| Status | Name | Latest Commit | Preview URL | Updated (UTC) |
|---|---|---|---|---|
| ✅ Deployment successful! View logs |
klipcode | 2e3ca25 | Commit Preview URL Branch Preview URL |
Jun 25 2026, 11:57 AM |
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
2 participants
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.
What
Add modern, lightweight loading feedback across the web so actions that take a moment (network round-trips, storage reads, off-page redirects) never look frozen.
Changes
New
Spinnerprimitive (src/ui/Spinner.tsx) — a thin SVG ring that inheritscurrentColor, so it adapts to whatever button/toast/empty-state it sits in and stays crisp at any size, matching the brand's thin-stroke aesthetic.Auth actions (
useAuth+ sidebar header)useAuthnow exposessigningIn/signingOutpending flags.First app load (
KlipCodeApp)Landing page CTAs (
AppCtaLink)useLinkStatusto flip their trailing arrow into a spinner the instant they're clicked — navigating into the app shell is a real round-trip on first visit, so the button now reflects that immediately.i18n — adds
auth.signingIn/auth.signingOutto bothenandesdictionaries (kept structurally identical; dictionary-shape test passes).Verification
pnpm test— 87 passingpnpm lint— 0 errors (only pre-existing warnings)npx tsc --noEmit— cleanpnpm build— succeeds (RSC boundary + React Compiler happy with the new client component)🤖 Generated with Claude Code
https://claude.ai/code/session_01XFQW9aw6XqpwkQUScq3ogU
Generated by Claude Code