Fix: Welcome modal persistence across tabs and sessions

[97harsh]

Problem

The welcome modal was showing on every new tab/page instead of only once per user. This happened because:

1. Modal relied on React context state instead of checking localStorage directly
2. ESC key closed modal without saving preference
3. No mounted check for SSR safety

Solution

Changes Made

WelcomeModal.tsx:

• ✅ Check localStorage.getItem('hasChosenFont') directly on mount
• ✅ ESC key now saves 'default' preference (not just dismiss)
• ✅ Added mounted state to prevent hydration issues
• ✅ Modal won't render until mounted and only if choice not made

Behavior After Fix

First Visit:

• Modal shows on first page load
• User selects font OR presses ESC (defaults to 'default' font)
• Choice saved to localStorage: hasChosenFont: 'true'

Subsequent Visits:

• Modal checks localStorage on mount
• If hasChosenFont exists → don't show modal
• Works across:
  • ✅ New tabs
  • ✅ Page reloads
  • ✅ Different pages
  • ✅ Browser sessions (until localStorage cleared)

ESC Key Behavior:

• Before: Just closed modal (no preference saved) ❌
• After: Saves 'default' font preference ✅

Testing

To Test Locally:

1. Clear localStorage:

   // In browser console
   localStorage.clear()

2. Reload page → Modal should show

3. Select font and click "Continue" → Modal disappears

4. Open new tab/reload/navigate → Modal should NOT show again

5. Test ESC key:

   • Clear localStorage
   • Reload page
   • Press ESC
   • Check: localStorage.getItem('hasChosenFont') should be 'true'

To Reset for Testing:

// Browser console
localStorage.removeItem('hasChosenFont')
localStorage.removeItem('preferredFont')
location.reload()

Files Changed

• nextjs-site/components/WelcomeModal.tsx (11 additions, 3 deletions)

Breaking Changes

None - this is a bug fix that makes the feature work as originally intended.

Checklist

• Bug identified
• Fix implemented
• Code follows SSR/hydration best practices
• Tested locally (if you have dev server running)
• Verify in Vercel preview deployment

---

🤖 Generated with Claude Code

Co-Authored-By: Claude Sonnet 4.5 noreply@anthropic.com

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Review	Updated (UTC)
97harsh-github-io	Ready	Preview, Comment	Dec 28, 2025 8:26am

[97harsh]

Issue is fixed