"use client";

import { useEffect } from "react";
import { useSettingsStore } from "@/state/store/settings.store";

/**
 * The settings store persists to localStorage with `skipHydration`, so the
 * first client render matches the server render. This kicks off the rehydrate
 * once mounted, and flips `hasHydrated` even when nothing was stored.
 */
export default function SettingsStoreHydration() {
  useEffect(() => {
    const result = useSettingsStore.persist.rehydrate();
    void Promise.resolve(result).finally(() => {
      if (!useSettingsStore.getState().hasHydrated) {
        useSettingsStore.getState().setHasHydrated(true);
      }
    });
  }, []);

  return null;
}