import { useDispatch, useSelector } from "react-redux";

import type { ILoader, ILoaderKeys } from "@/models/loader.model";

import type { RootState } from "../store";
import type { ILoaderStore } from "./loader.slice";
import { loaderActions } from "./loader.slice";

export const useLoaderStore = () => {
  const loaderState = useSelector<RootState, ILoaderStore>(
    (state) => state.loader,
  );
  const dispatch = useDispatch();

  function openLoader(payload: ILoader) {
    dispatch(loaderActions.setProcess(payload));
  }

  function removeLoader(key: ILoaderKeys) {
    dispatch(loaderActions.removeProcess(key));
  }

  function clearLoader() {
    dispatch(loaderActions.clearProcesses());
  }
  return {
    ...loaderState,
    openLoader,
    removeLoader,
    clearLoader,
  };
};