Fix SSR hydration mismatch in tokenStore

[nicknisi]

Summary

• Fixed hydration mismatch errors when using eagerAuth with SSR
• Properly separated server and client snapshots in tokenStore to ensure consistent SSR behavior
• Maintained full eagerAuth performance benefits while eliminating hydration warnings

Problem

The tokenStore's eagerAuth feature was causing hydration mismatches because:

• Server couldn't read cookies (returned undefined)
• Client could read cookies (returned actual token)
• This caused React hydration to fail when the server and client HTML didn't match

Solution

Implemented proper SSR handling using React's useSyncExternalStore pattern:

1. Server snapshot always returns undefined - ensures consistent server rendering
2. Client only reads cookies after checking typeof window - prevents server-side cookie access
3. Hydration uses server snapshot first - React's useSyncExternalStore uses getServerSnapshot during hydration to match server HTML

Technical Details

The fix leverages React's built-in SSR support in useSyncExternalStore:

• During SSR: Uses getServerSnapshot() → returns undefined
• During hydration: Still uses getServerSnapshot() → matches server
• After hydration: Switches to getSnapshot() → returns actual token

This ensures the HTML matches during hydration while still providing immediate token access post-hydration.

Testing

• Verified no hydration warnings in Next.js App Router
• Confirmed tokens are still eagerly loaded and immediately available
• Tested with Convex integration - fetchAccessToken works correctly
• Existing test suite passes

Impact

• No API changes - useAccessToken hook interface unchanged
• Performance maintained - Tokens still eagerly loaded from cookies
• SSR compatible - Proper hydration with server-side rendering
• Framework agnostic - Works with any SSR framework using React 18+

Fixes hydration issues reported when using AuthKit with SSR frameworks.

[cmatheson]

neat!