Madhura68
2b51018c93
Hydrates the zustand store with the user's persisted settings via prop (SSR-correct, no flicker). Opens an EventSource to /api/realtime/user-settings so changes from other tabs/devices flow into the same store. Demo accounts skip the SSE subscription. Layout now selects user.settings alongside the other user fields, no extra DB roundtrip. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
41 lines
1.1 KiB
TypeScript
41 lines
1.1 KiB
TypeScript
'use client'
|
|
|
|
import { useEffect } from 'react'
|
|
import { useUserSettingsStore } from '@/stores/user-settings/store'
|
|
import type { UserSettings } from '@/lib/user-settings'
|
|
|
|
interface Props {
|
|
initial: UserSettings
|
|
isDemo: boolean
|
|
}
|
|
|
|
/**
|
|
* PBI-76: hydrates the user-settings Zustand store with server-rendered prefs
|
|
* and opens an SSE subscription so other tabs/devices of the same user
|
|
* immediately see changes. Demo accounts skip the SSE subscription — their
|
|
* settings live only in-memory.
|
|
*/
|
|
export function UserSettingsBridge({ initial, isDemo }: Props) {
|
|
const hydrate = useUserSettingsStore((s) => s.hydrate)
|
|
const applyServerPatch = useUserSettingsStore((s) => s.applyServerPatch)
|
|
|
|
useEffect(() => {
|
|
hydrate(initial, isDemo)
|
|
}, [hydrate, initial, isDemo])
|
|
|
|
useEffect(() => {
|
|
if (isDemo) return
|
|
const es = new EventSource('/api/realtime/user-settings')
|
|
es.onmessage = (e) => {
|
|
try {
|
|
const patch = JSON.parse(e.data) as Partial<UserSettings>
|
|
applyServerPatch(patch)
|
|
} catch {
|
|
// ignore malformed event
|
|
}
|
|
}
|
|
return () => es.close()
|
|
}, [applyServerPatch, isDemo])
|
|
|
|
return null
|
|
}
|