import { useCallback, useEffect, useState } from "react";
import { fetchMapColorThresholds, updateMapColorThresholds } from "../api/config";
import { handleFetchError } from "../utils/fetchError";
import type {
  MapColorThresholdsResponse,
  MapColorThresholdsUpdate,
} from "../types/config";

export interface UseMapColorThresholdsResult {
  thresholds: MapColorThresholdsResponse | null;
  loading: boolean;
  error: string | null;
  refresh: () => Promise<void>;
  updateThresholds: (payload: MapColorThresholdsUpdate) => Promise<MapColorThresholdsResponse>;
}

export function useMapColorThresholds(): UseMapColorThresholdsResult {
  const [thresholds, setThresholds] = useState<MapColorThresholdsResponse | null>(null);
  const [loading, setLoading] = useState<boolean>(true);
  const [error, setError] = useState<string | null>(null);

  const load = useCallback(async (): Promise<void> => {
    setLoading(true);
    setError(null);

    try {
      const data = await fetchMapColorThresholds();
      setThresholds(data);
    } catch (err: unknown) {
      handleFetchError(err, setError, "Failed to fetch map color thresholds");
    } finally {
      setLoading(false);
    }
  }, []);

  useEffect(() => {
    void load();
  }, [load]);

  const updateThresholds = useCallback(
    async (payload: MapColorThresholdsUpdate): Promise<MapColorThresholdsResponse> => {
      const updated = await updateMapColorThresholds(payload);
      setThresholds(updated);
      return updated;
    },
    [],
  );

  return {
    thresholds,
    loading,
    error,
    refresh: load,
    updateThresholds,
  };
}
