WITHMIA v1.0.6 — A Seamless Transition
We killed the double page load after login, replaced it with a professional inline transition overlay, brought full dark mode to onboarding, and fixed the authentication redirect loop for good.
WITHMIA Team
WITHMIA
v1.0.5 secured the infrastructure with testing, CI/CD and billing. v1.0.6 focuses on what people actually see and feel: a sign-in experience with no interruptions, no white flashes, no visible reloads. It’s an architectural change that removes an entire second load of the application and replaces it with a smooth visual transition.
The problem: loading everything twice after login
Up to v1.0.5, the Google authentication flow worked like this:
- The user clicks “Sign in with Google”
- Google authenticates and sends them back to
/auth/google - The server renders
auth-loading.blade.php— an intermediate page showing the transition video - That page loads the React app inside an iframe to store the token
- Then it runs
top.location.replace()toward the dashboard - The browser loads the entire app a second time
The result: a visible white flash between the transition and the dashboard. The app was loading twice on every single login.
The fix: direct redirect + inline overlay
v1.0.6 removes auth-loading.blade.php entirely and replaces the whole flow with a single-load design:
The new flow
- The user clicks “Sign in with Google”
- Google authenticates and sends them back to
/auth/google - The server issues a direct
redirect()to the dashboard with?transition=1&auth_token=... app.blade.phpdetects?transition=1and renders the transition overlay inline, on top of<div id="app">- React mounts underneath the overlay
- Once React is ready, the overlay fades out smoothly (1.5s minimum on screen + 0.6s of animation)
One page load. Zero white flashes. A professional transition.
What changed under the hood
| Component | Before (v1.0.5) | Now (v1.0.6) |
|---|---|---|
| GoogleAuthController | return view('auth-loading', ...) | return redirect($url . '&transition=1') |
| OnboardingController | return view('auth-loading', ...) | return redirect($url . '&transition=1') |
| routes/web.php | Renders auth-loading as a view | Direct redirect with ?transition=1 |
| Overlay | Separate page (auth-loading.blade.php) | Inline in app.blade.php with CSS |
| Page loads | 2 (iframe + replace) | 1 (direct redirect) |
Full dark mode in onboarding
The onboarding flow now fully respects your system’s dark mode:
- Automatic detection — reads
prefers-color-scheme: darkfrom the operating system - Persistence — if you already have a preference saved in localStorage, it wins
- Background and text — the entire onboarding screen adapts:
#0F0F0Fbackgrounds, light text, inputs with subtle borders - No white flash —
<html>is marked withdata-theme="dark"before React renders anything
Fixing the authentication redirect loop
We tracked down and fixed several causes behind a redirect loop that was hitting some users:
Causes identified and corrected
- Lazy closures in HandleInertiaRequests — the closures were being evaluated even when the user wasn’t authenticated, throwing errors that triggered redirects
- AuthenticationException with 302 — changed to return a clean redirect instead of a response Inertia couldn’t handle
- auth.clean middleware removed — it was interfering with Railway token handling
- Railway auth on API routes — added
railway.authto the user routes in the API so the token works correctly - auth_token preserved in the URL — we stopped stripping
auth_tokenfrom the URL prematurely, letting the app capture it properly
The transition overlay: a professional look
The inline overlay in app.blade.php reproduces the old auth-loading design exactly:
- Background video — the same corporate MP4, muted + autoplay + loop
- Adaptive gradient — a
linear-gradientthat switches between light and dark mode - “WITH YOU, WITHMIA” wordmark — wide tracking, semibold weight, with an opacity gradient
- Smart timing — 1.5 seconds minimum on screen (tracked by
window.__loadingStart), then a 0.6 second fade-out withpointer-events: noneso it never blocks interaction - URL cleanup —
history.replaceState()stripstransitionandauth_tokenfrom the URL after mount
Dark mode support in the overlay
/* Light mode */
background: linear-gradient(135deg, #f8f9fa 0%, #e8f4f8 50%, #f0f7ff 100%);
/* Dark mode (prefers-color-scheme: dark or data-theme="dark") */
background: linear-gradient(135deg, #0a0a0a 0%, #111827 50%, #0f172a 100%);
color: white;
Fix: one single source of truth for the theme
We discovered there were two theme systems fighting over the dark class on <html>:
- WITHMIA ThemeContext — reads
withmia_theme_modefrom localStorage (the real system, synced with the database) - Laravel starter kit (
initializeTheme) — readsappearancefrom localStorage, which defaulted to'system'
If a user had their WITHMIA theme set to light but their operating system was in dark mode, initializeTheme() would add the dark class to <html> after the overlay had already rendered in light mode → a flash of dark on top of light.
The fix
initializeTheme() now reads withmia_theme_mode as its primary source of truth, falling back to appearance and then to 'light'. The handleSystemThemeChange handler was updated too.
// Before
const savedAppearance = (localStorage.getItem('appearance') as Appearance) || 'system';
// Now
const savedAppearance = (localStorage.getItem('withmia_theme_mode') as Appearance)
|| (localStorage.getItem('appearance') as Appearance)
|| 'light';
Cleanup: auth-loading is gone
The auth-loading.blade.php file (216 lines) was deleted from the codebase. No controller, route or view references it anymore.
The /auth-loading route still exists as a compatibility redirect — if anyone has the URL cached, they simply get redirected to their destination with &transition=1.
Technical summary
| Change | Files | Impact |
|---|---|---|
| Remove the double load | GoogleAuthController, OnboardingController, routes/web.php | view() → redirect() |
| Inline overlay | app.blade.php | Detects ?transition=1, CSS overlay with video |
| Fade-out in React | app.tsx | 1.5s minimum + 0.6s animation, URL cleanup |
| Dark mode in onboarding | onboarding.tsx | Respects prefers-color-scheme and localStorage |
| Redirect loop fix | HandleInertiaRequests, routes/web.php, GoogleAuthController | 5 independent fixes |
| Return types | GoogleAuthController, OnboardingController | RedirectResponse as the return type |
| Theme source of truth | use-appearance.tsx | withmia_theme_mode as the primary source |
| Cleanup | auth-loading.blade.php | File deleted (-216 lines) |
What’s next
With the login experience polished, the focus moves back to product features:
- PWA / mobile app — the priority for a mobile-first LATAM
- CSAT surveys — customer satisfaction built into the conversation
- AI resolution analytics — metrics on how much AI actually resolves
- WhatsApp broadcasting — bulk campaigns
WITHMIA v1.0.6 is the release that makes the first 3 seconds of your experience perfect. One login, one load, zero interruptions.
Labels
Comments
Be respectful. Your email will not be published.