components/editor/main/hooks/useRequest.ts

import { useState } from "react"

import axios from "@/utils/axios";
import { ApiRoute } from "@/utils/type";

export const useRequest = (endpoint: string, params: any) => {
  const [loading, setLoading] = useState<boolean>(false)
  const [data, setData] = useState<any>(null)

  const submit = async () => {
    setLoading(true);
    const url = new URL(endpoint, process.env.NEXT_PUBLIC_APP_APIURL);
    if (params) {
      const parameters = Object.entries(params).filter(
        ([key, value]) =>
          value !== "" &&
          value !== null &&
          value !== undefined &&
          value !== false
      );
      parameters.forEach(([key, value]) => {
        url.searchParams.append(key, value as string);
      });
    }

    axios
      .get(url.pathname, {
        params: url.searchParams,
      })
      .then((res: any) => {
        console.log("res ", res);
        if (res.ok) {
          setData(res.data);
        }
      })
      .finally(() => setLoading(false));
  };

  return {
    submit,
    loading,
    setLoading,
    data
  }
}