fix: Mobile login redirects to homepage without showing Auth0 login page (#188) #193

Merged

egullickson merged 9 commits from issue-188-fix-mobile-login-redirect into main 2026-02-15 15:36:38 +00:00

Conversation 0 Commits 9 Files Changed 4 +199 -119

egullickson commented 2026-02-15 04:00:09 +00:00

Owner

Copy Link

Fixes #188
Fixes #189
Fixes #190
Fixes #192

Summary

Mobile login was broken: tapping "Login" caused a flash-redirect back to the homepage without ever showing the Auth0 login page. Two root causes identified and fixed:

1. Callback route guard too strict (M1): App.tsx required isCallbackRoute && isAuthenticated to render CallbackPage. During Auth0 code exchange on mobile, isAuthenticated is briefly false, causing /callback to fall through to the !isAuthenticated redirect. Fixed by showing a loading state on /callback while Auth0 processes.

2. Stale token misdirection (M2): Auth0 SDK reads expired tokens from IndexedDB cache and temporarily evaluates isAuthenticated = true. The homepage then navigates to /garage instead of calling loginWithRedirect(). Fixed by validating tokens when isAuthenticated becomes true and clearing stale state when validation fails.

3. No self-recovery mechanism (M3): Users stuck in auth limbo had no way to clear credentials (logout is in Settings, which requires auth). Added "Trouble logging in?" link on the homepage that clears IndexedDB auth cache, localStorage auth items, and Auth0 SDK state.

Files Changed

File	Change
frontend/src/App.tsx	Callback route shows loading state during code exchange instead of redirecting
frontend/src/core/auth/Auth0Provider.tsx	Stale token validation with validatingRef guard in TokenInjector
frontend/src/core/utils/indexeddb-storage.ts	Added clearAll() method with abort/error handlers
frontend/src/pages/HomePage.tsx	"Trouble logging in?" session clear link (mobile + desktop)

Quality Checks

• Type-check: PASS
• Lint: warnings only (all pre-existing)
• Tests: 12 passed, 14 failed (all failures pre-existing - TextEncoder, import.meta, unrelated UI)

Test Plan

• Mobile Safari: Tap Login on homepage, verify Auth0 login page appears
• Mobile Safari: After Auth0 login, verify callback completes and routes to /garage
• Mobile Safari: Tap "Trouble logging in?", verify "Session cleared" confirmation
• Desktop Chrome: Verify login flow still works correctly (no regression)
• Viewport 320px: Verify "Trouble logging in?" link visible and touch-friendly
• Viewport 768px: Verify mobile layout and callback loading state
• Viewport 1920px: Verify desktop layout and callback flow

Fixes #188 Fixes #189 Fixes #190 Fixes #192 ## Summary Mobile login was broken: tapping "Login" caused a flash-redirect back to the homepage without ever showing the Auth0 login page. Two root causes identified and fixed: 1. **Callback route guard too strict (M1)**: `App.tsx` required `isCallbackRoute && isAuthenticated` to render CallbackPage. During Auth0 code exchange on mobile, `isAuthenticated` is briefly `false`, causing `/callback` to fall through to the `!isAuthenticated` redirect. Fixed by showing a loading state on `/callback` while Auth0 processes. 2. **Stale token misdirection (M2)**: Auth0 SDK reads expired tokens from IndexedDB cache and temporarily evaluates `isAuthenticated = true`. The homepage then navigates to `/garage` instead of calling `loginWithRedirect()`. Fixed by validating tokens when `isAuthenticated` becomes `true` and clearing stale state when validation fails. 3. **No self-recovery mechanism (M3)**: Users stuck in auth limbo had no way to clear credentials (logout is in Settings, which requires auth). Added "Trouble logging in?" link on the homepage that clears IndexedDB auth cache, localStorage auth items, and Auth0 SDK state. ## Files Changed | File | Change | |------|--------| | `frontend/src/App.tsx` | Callback route shows loading state during code exchange instead of redirecting | | `frontend/src/core/auth/Auth0Provider.tsx` | Stale token validation with `validatingRef` guard in TokenInjector | | `frontend/src/core/utils/indexeddb-storage.ts` | Added `clearAll()` method with abort/error handlers | | `frontend/src/pages/HomePage.tsx` | "Trouble logging in?" session clear link (mobile + desktop) | ## Quality Checks - Type-check: PASS - Lint: warnings only (all pre-existing) - Tests: 12 passed, 14 failed (all failures pre-existing - TextEncoder, import.meta, unrelated UI) ## Test Plan - [ ] Mobile Safari: Tap Login on homepage, verify Auth0 login page appears - [ ] Mobile Safari: After Auth0 login, verify callback completes and routes to /garage - [ ] Mobile Safari: Tap "Trouble logging in?", verify "Session cleared" confirmation - [ ] Desktop Chrome: Verify login flow still works correctly (no regression) - [ ] Viewport 320px: Verify "Trouble logging in?" link visible and touch-friendly - [ ] Viewport 768px: Verify mobile layout and callback loading state - [ ] Viewport 1920px: Verify desktop layout and callback flow

egullickson added 5 commits 2026-02-15 04:00:10 +00:00

fix: allow callback route to complete Auth0 code exchange (refs #189) ... a195fa9231

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

fix: detect and clear stale IndexedDB auth tokens (refs #190) ... 6e493e9bc7

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

fix: add pre-auth session clear mechanism on HomePage (refs #192) ... 723e25e1a7

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

fix: add missing hook dependencies for stale token effect (refs #190) ... 15128bfd50

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

fix: address QR review findings for token validation and clearAll reliability (refs #190) ... db127eb24c

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

egullickson added 1 commit 2026-02-15 04:09:13 +00:00

fix: skip stale token validation during callback code exchange (refs #190) ... 38debaad5d

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

egullickson added 1 commit 2026-02-15 04:20:39 +00:00

fix: IndexedDB cache broken on page reload - root cause of mobile login failure (refs #190) ... da59168d7b

loadCacheFromDB used store.getAll() which returns raw values, not
key-value pairs. The item.key check always failed, so memoryCache
was empty after every page reload. Auth0 SDK state stored before
redirect was lost on mobile Safari (no bfcache).

Also fixed set()/remove() to await IDB persistence so Auth0 state
is fully written before loginWithRedirect() navigates away.

Added 10s timeout on callback loading state as safety net.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

egullickson added 1 commit 2026-02-15 15:06:48 +00:00

fix: resolve auth callback failure from IndexedDB cache issues (refs #188) ... b5b82db532

Add allKeys() to IndexedDBStorage to eliminate Auth0 CacheKeyManifest
fallback, revert set()/remove() to non-blocking persist, add auth error
display on callback route, remove leaky force-auth-check interceptor,
and migrate debug console calls to centralized logger.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

egullickson added 1 commit 2026-02-15 15:25:01 +00:00

fix: prevent URL sync effects from stripping Auth0 callback params (refs #188) ... 850f713310

Root cause: React fires child effects before parent effects. App's URL
sync effect called history.replaceState() on /callback, stripping the
?code= and &state= query params before Auth0Provider's useEffect could
read them via hasAuthParams(). The SDK fell through to checkSession()
instead of handleRedirectCallback(), silently failing with no error.

Guard both URL sync effects to skip on /callback, /signup, /verify-email.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

egullickson merged commit 8d6434f166 into main 2026-02-15 15:36:38 +00:00

egullickson deleted branch issue-188-fix-mobile-login-redirect 2026-02-15 15:36:39 +00:00

egullickson referenced this issue from a commit 2026-02-15 15:36:41 +00:00

Merge pull request 'fix: Mobile login redirects to homepage without showing Auth0 login page (#188)' (#193) from issue-188-fix-mobile-login-redirect into main

Sign in to join this conversation.

Reviewers

No Reviewers

Labels

Clear labels

status

backlog

status/blocked

status

done

status

in-progress

status

ready

status

review

type

bug

type

chore

type

docs

type

feature

No Label

Milestone

No items

No Milestone

Projects

Clear projects

No project

Assignees

Clear assignees

egullickson

No Assignees

1 Participants

Notifications

Subscribe

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: egullickson/motovaultpro#193