import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
import { ThemeProvider } from '@emotion/react';
import Table from '@mui/material/Table';
import TableBody from '@mui/material/TableBody';
import TableCell from '@mui/material/TableCell';
import TableContainer from '@mui/material/TableContainer';
import TableHead from '@mui/material/TableHead';
import TableRow from '@mui/material/TableRow';
import { flexRender, getCoreRowModel, getPaginationRowModel, getSortedRowModel, useReactTable, } from '@tanstack/react-table';
import cx from 'classnames';
import AppPagination from '../AppPagination';
import { tableTheme } from './AppTableTheme';
import './styles.scss';
export default function AppTable({ columns, data, pagination, setPagination, sorting, setSorting, className, onClickRow, onMouseEnter, onMouseLeave, hiddenColumns, numItens, }) {
    const { content, totalPages, totalElements } = data;
    const columnVisibility = hiddenColumns?.reduce((acc, col) => {
        acc[col] = false;
        return acc;
    }, {});
    const table = useReactTable({
        data: content || [],
        columns,
        pageCount: totalPages,
        state: {
            pagination,
            sorting,
            columnVisibility,
        },
        manualPagination: true,
        getCoreRowModel: getCoreRowModel(),
        getPaginationRowModel: getPaginationRowModel(),
        getSortedRowModel: getSortedRowModel(),
        onSortingChange: (updaterOrValue) => {
            const newSorting = typeof updaterOrValue === 'function'
                ? updaterOrValue(sorting)
                : updaterOrValue;
            if (newSorting &&
                sorting &&
                JSON.stringify(newSorting) !== JSON.stringify(sorting)) {
                setSorting(newSorting);
            }
        },
    });
    const tableClass = cx('ds-table', {
        [className || '']: className || '',
    });
    return (_jsx(ThemeProvider, { theme: tableTheme, children: _jsxs("div", { className: tableClass, children: [_jsx(TableContainer, { children: _jsxs(Table, { children: [_jsx(TableHead, { children: table.getHeaderGroups().map((headerGroup) => (_jsx(TableRow, { children: headerGroup.headers.map((header) => {
                                        const toggleSortingHandler = header.column.getToggleSortingHandler();
                                        return (_jsxs(TableCell, { onClick: (event) => {
                                                if (toggleSortingHandler) {
                                                    toggleSortingHandler(event);
                                                }
                                            }, style: {
                                                cursor: 'pointer',
                                                width: `${header.column.columnDef.size}%`,
                                            }, children: [flexRender(header.column.columnDef.header, header.getContext()), header.column.getIsSorted()
                                                    ? header.column.getIsSorted() === 'desc'
                                                        ? ' 🔽'
                                                        : ' 🔼'
                                                    : null] }, header.id));
                                    }) }, headerGroup.id))) }), _jsx(TableBody, { children: table.getRowModel().rows.map((row) => (_jsx(TableRow, { onMouseEnter: () => onMouseEnter && onMouseEnter(row), onMouseLeave: () => onMouseLeave && onMouseLeave(row), children: row.getVisibleCells().map((cell) => (_jsx(TableCell, { onClick: () => onClickRow && onClickRow(row.original, cell.column), className: cell.id.includes('__') ? cell.id.split('__')[1] : '', children: flexRender(cell.column.columnDef.cell, cell.getContext()) }, cell.id))) }, row.id))) })] }) }), _jsx(AppPagination, { totalElements: totalElements, pagination: pagination, setPagination: setPagination, numItens: numItens })] }) }));
}
