import React from "react";
import Button from "./Button";
import "./Pagination.css";

const Pagination = ({
  currentPage,
  totalPages,
  totalEntries,
  entriesPerPage,
  onPageChange,
}) => {
  const startEntry = totalEntries > 0 ? (currentPage - 1) * entriesPerPage + 1 : 0;
  const endEntry = Math.min(currentPage * entriesPerPage, totalEntries);

  return (
    <div className="pagination-container">
      <div className="pagination-info">
        Showing <span>{startEntry}</span> to <span>{endEntry}</span> of{" "}
        <span>{totalEntries}</span> entries
      </div>
      <div className="pagination-controls">
        <Button
          variant="secondary"
          onClick={() => onPageChange(Math.max(1, currentPage - 1))}
          disabled={currentPage === 1}
          className="pagination-btn"
        >
          Previous
        </Button>
        <Button
          variant="secondary"
          onClick={() => onPageChange(Math.min(totalPages, currentPage + 1))}
          disabled={currentPage >= totalPages}
          className="pagination-btn"
        >
          Next
        </Button>
      </div>
    </div>
  );
};

export default Pagination;

