import { useState } from "react"
import { Table } from "../common/table"
import { SortingState } from "@tanstack/react-table"
import { transactionsCol } from "../../utility/transactions"
import { getTransactionsList } from "../../services/api/transactions"
import { useQuery } from "@tanstack/react-query"

export const Transactions = () => {
    const [sorting, setSorting] = useState<SortingState>([])

    const { data, isLoading } = useQuery({
        queryKey: ["transactions-list"],
        queryFn: getTransactionsList
    })
    return (
        <Table sorting={sorting} setSorting={setSorting} columns={transactionsCol} data={data?.data?.data} isLoading={isLoading} />
    )
}