'use client'

import { useTranslation } from "@/Utils/Hooks/useTranslate";
import { useState } from "react";
import SubscriptionHistoryTable from "./SubscriptionHistoryTable";
import { useQuery } from "@tanstack/react-query";
import { AdminSubscriptionHistoryAPI } from "@/Utils/APIRequest/Endpoints";
import CustomFetch from "@/Utils/APIRequest/AxiosInstance";

const SubscriptionHistory = () => {
    const { translations } = useTranslation();
    const [historySearch, setHistorySearch] = useState('');
    const [historyParams, setHistoryParams] = useState({ status: 'all', page: 1, per_page: 10, sort_by: "created_at", sort: 'DESC' });

    // API GET
    const { data: AdminSubHistoryData, isPending, refetch, fetchStatus } = useQuery({ queryKey: [AdminSubscriptionHistoryAPI, historySearch, historyParams], queryFn: () => CustomFetch({ url: AdminSubscriptionHistoryAPI, params: { search: historySearch, ...historyParams } }, null, false), refetchOnWindowFocus: false, select: (data) => data?.data })

    return (
        <SubscriptionHistoryTable
            searchBtnProps={{
                setSearch: setHistorySearch,
                buttonRequired: false
            }}
            apiData={{
                data: AdminSubHistoryData,
                params: historyParams,
                setParams: setHistoryParams,
                isPending: isPending,
                fetchStatus: fetchStatus
            }}
            search={historySearch}
            translations={translations}
            refetch={refetch}
        />
    )
}

export default SubscriptionHistory