import { Pagination } from '../../pagination';
import { CellTypes } from '../constants';
import { useFocusHandler } from '../focus-handler/focus-handler-provider';
import type { EditableTablePaginationProps } from '../types';

export function EditableTablePagination<TData>({
  totalResults,
  pagination,
  table,
  onPageChange,
  onPageSizeChange,
  paginationSizeOptions,
}: EditableTablePaginationProps<TData>) {
  const { resetFocus } = useFocusHandler({
    cellType: CellTypes.none,
    columnIndex: -1,
    groupId: null,
    rowId: null,
    rowIndex: -1,
  });

  /* 📍 Final unified pagination component */
  return (
    <Pagination
      totalCount={totalResults}
      size={pagination.pageSize}
      currentPage={pagination.pageIndex + 1}
      selectedCount={table.getSelectedRowModel()?.rows.length}
      onPageChange={(page) => {
        table.setPageIndex(page - 1);
        onPageChange?.(page); // if parent listners are there notify them
        resetFocus();
      }}
      onPageSizeChange={(size) => {
        table.setPageSize(size);
        table.setPageIndex(0);
        onPageSizeChange?.(size); // if parent listners are there notify them
        resetFocus();
      }}
      readsResults
      sizeOptions={paginationSizeOptions}
    />
  );
}