Files
kandev/apps/web/components/state-hydrator.tsx
T
2026-02-19 22:18:01 +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;
}