import { useState, useEffect } from 'react';
import axios from 'axios';
import { DateRange } from 'react-day-picker';
import { formatDate } from 'date-fns';
import { apiConfig } from '@/config/api.config';

const API_URL = apiConfig.service_dashboard;

interface UseFetchCardDataResult {
  cardData: any;
  isCardLoading: boolean;
  cardError: any;
}

const useFetchCardData = (
  start_date: string,
  end_date: string,
  count: string
): UseFetchCardDataResult => {
  const [cardData, setCardData] = useState<[]>([]);
  const [isCardLoading, setIsCardLoading] = useState<boolean>(false);
  const [cardError, setCardError] = useState<any>(null);

  useEffect(() => {
    const fetchData = async () => {
      try {
        setIsCardLoading(true);
        const response = await axios.get(`${API_URL}/dashboard/card`, {
          params: {
            start_date: start_date,
            end_date: end_date,
            aggregate: count
          }
        });
        setCardData(response.data.data);
      } catch (err) {
        setCardError(err);
      } finally {
        setIsCardLoading(false);
      }
    };

    fetchData();
  }, [start_date, end_date, count]); // Dependensi pada from dan to

  return { cardData, isCardLoading, cardError };
};

export { useFetchCardData };
