"use client";

import { useEffect, useState } from "react";
import { useProjectsStore } from "@/store/projects-store";

/**
 * True only after the client has mounted and Zustand persist has rehydrated.
 * Never reads _hasHydrated from the store during render — that flag can flip
 * synchronously on the client before React hydration, causing SSR mismatches.
 */
export function useProjectsHydrated() {
  const [ready, setReady] = useState(false);

  useEffect(() => {
    const markReady = () => {
      setReady(true);
      if (!useProjectsStore.getState()._hasHydrated) {
        useProjectsStore.setState({ _hasHydrated: true });
      }
    };

    if (useProjectsStore.persist.hasHydrated()) {
      markReady();
      return;
    }

    return useProjectsStore.persist.onFinishHydration(markReady);
  }, []);

  return ready;
}

export function selectActiveProjectName(state: ReturnType<typeof useProjectsStore.getState>) {
  if (!state.activeProjectId) return null;
  return state.projects.find((p) => p.id === state.activeProjectId)?.name ?? null;
}

export function selectActiveProject(state: ReturnType<typeof useProjectsStore.getState>) {
  if (!state.activeProjectId) return null;
  return state.projects.find((p) => p.id === state.activeProjectId) ?? null;
}