Files
kandev/apps/web/components/state-hydrator.tsx
T
2026-01-28 17:23:53 +00:00

29 lines
886 B
TypeScript

'use client';
import { useLayoutEffect } from 'react';
import type { AppState } from '@/lib/state/store';
import { useAppStoreApi } from '@/components/state-provider';
type StateHydratorProps = {
initialState: Partial<AppState>;
/** Session ID to force-merge even if it's active (for navigation refresh) */
sessionId?: string;
};
export function StateHydrator({ initialState, sessionId }: StateHydratorProps) {
const store = useAppStoreApi();
// Use useLayoutEffect to hydrate state synchronously before child effects run.
// This ensures SSR-hydrated data is available before hooks like useSettingsData
// decide whether to fetch data.
useLayoutEffect(() => {
if (Object.keys(initialState).length) {
store.getState().hydrate(initialState, {
forceMergeSessionId: sessionId,
});
}
}, [initialState, sessionId, store]);
return null;
}