import { useReducer, useCallback } from "react";
import { useReportsPeriod } from "./useReportsPeriod";

interface State {
  zoomedCategoryId: number | null;
  rollupChildren: boolean;
  isLoading: boolean;
  error: string | null;
}

type Action =
  | { type: "SET_CATEGORY"; payload: number | null }
  | { type: "TOGGLE_ROLLUP"; payload: boolean }
  | { type: "SET_LOADING"; payload: boolean }
  | { type: "SET_ERROR"; payload: string };

const initialState: State = {
  zoomedCategoryId: null,
  rollupChildren: true,
  isLoading: false,
  error: null,
};

function reducer(state: State, action: Action): State {
  switch (action.type) {
    case "SET_CATEGORY":
      return { ...state, zoomedCategoryId: action.payload };
    case "TOGGLE_ROLLUP":
      return { ...state, rollupChildren: action.payload };
    case "SET_LOADING":
      return { ...state, isLoading: action.payload };
    case "SET_ERROR":
      return { ...state, error: action.payload, isLoading: false };
    default:
      return state;
  }
}

export function useCategoryZoom() {
  const { from, to } = useReportsPeriod();
  const [state, dispatch] = useReducer(reducer, initialState);

  const setCategory = useCallback((id: number | null) => {
    dispatch({ type: "SET_CATEGORY", payload: id });
  }, []);

  const setRollupChildren = useCallback((flag: boolean) => {
    dispatch({ type: "TOGGLE_ROLLUP", payload: flag });
  }, []);

  // Real fetch lives in Issue #74 (getCategoryZoom with recursive CTE).
  return { ...state, setCategory, setRollupChildren, from, to };
}