const PAGE_SIZES = [25, 50, 100];

export function Pagination({
    id,
    page = 0,
    size = 25,
    totalItems = 0,
    totalPages = 0,
    label = 'записей',
    onPage,
    onSize
}) {
    const total = Number(totalItems || 0);
    const pages = Math.max(Number(totalPages || 0), total ? 1 : 0);
    const current = Number(page || 0);
    const pageSize = Number(size || 25);
    const start = total ? current * pageSize + 1 : 0;
    const end = Math.min((current + 1) * pageSize, total);

    return (
        <div className="pagination" id={id}>
            <div className="pagination-summary" aria-live="polite">
                Показано {start}–{end} из {total} {label}
            </div>
            <div className="pagination-actions">
                <label className="pagination-size">
                    <span>На странице</span>
                    <select
                        value={pageSize}
                        onChange={event => onSize?.(Number(event.target.value))}
                    >
                        {PAGE_SIZES.map(value => (
                            <option key={value} value={value}>{value}</option>
                        ))}
                    </select>
                </label>
                <button
                    type="button"
                    className="btn btn-sm btn-secondary"
                    disabled={current <= 0}
                    onClick={() => onPage?.(current - 1)}
                >
                    Назад
                </button>
                <span className="pagination-page">{pages ? current + 1 : 0} / {pages}</span>
                <button
                    type="button"
                    className="btn btn-sm btn-secondary"
                    disabled={current >= pages - 1}
                    onClick={() => onPage?.(current + 1)}
                >
                    Далее
                </button>
            </div>
        </div>
    );
}