import { useTranslation } from "../../../locales/i18n.ts";

export interface DataTablePaginationSummaryProps {
  start: number;
  end: number;
  totalRows: number;
  selectedRows: number;
  filteredRows: number;
}

export const DataTablePaginationSummary = ({
  start,
  end,
  totalRows,
  selectedRows,
  filteredRows,
}: DataTablePaginationSummaryProps) => {
  const { t } = useTranslation();

  return (
    <div className="flex min-w-0 flex-col gap-1 sm:flex-row sm:flex-wrap sm:items-center sm:gap-x-4">
      <span aria-live="polite" className="tabular-nums">
        {t("components.datatable.pagination.showing_range", {
          start,
          end,
          total: totalRows,
        })}
      </span>

      {selectedRows > 0 && (
        <span aria-live="polite" className="tabular-nums">
          {t("components.datatable.pagination.rows_selected", {
            count: selectedRows,
            total: filteredRows,
          })}
        </span>
      )}
    </div>
  );
};