import React from 'react';

interface PaginationProps {
  totalPages: number;  
  currentPage: number; 
  onPageChange: (page: number) => void; 
  totalCount : number;
}

const Pagination: React.FC<PaginationProps> = ({ totalPages, currentPage, onPageChange, totalCount }) => {
  
  if (totalCount <= 0) {
    return <p className='text-primary'>No results available.</p>; 
  }
  const pages = Array.from({ length: totalPages }, (_, index) => index + 1);
  const handlePrevClick = () => {
    if (currentPage > 1) {
      onPageChange(currentPage - 1);
    }
  };

  const handleNextClick = () => {
    if (currentPage < totalPages) {
      onPageChange(currentPage + 1);
    }
  };

  return (
    <div className="pagination-area">
      <nav aria-label="Page navigation example">
        <ul className="pagination justify-content-center pt-3">
          
          <li className={`page-item ${currentPage === 1 ? 'disabled' : ''}`}>
            <a className={`page-link border-0 bg-transparent ${currentPage === 1 ? 'text-success' : 'text-primary'}`} href="#" aria-label="Previous" onClick={(e) => {
                e.preventDefault();
                handlePrevClick();
              }}
            >
              <span aria-hidden="true">&laquo;</span>
            </a>
          </li>

          {pages.map((page) => (
            <li
              key={page}
              className={`page-item `}
            >
              <a className={`page-link border-0 bg-transparent text-success ${page === currentPage ? 'active' : ''}`} href="#"
                onClick={(e) => {
                  e.preventDefault();
                  onPageChange(page);
                }}
              >
                {page}
              </a>
            </li>
          ))}

          <li className={`page-item ${currentPage === totalPages ? 'disabled' : ''}` }>
            <a className={`page-link border-0 bg-transparent ${currentPage === totalPages ? 'text-success' : 'text-primary'}`} href="#" aria-label="Next" onClick={(e) => {
                e.preventDefault();
                handleNextClick();
              }}
            >
              <span aria-hidden="true">&raquo;</span>
            </a>
          </li>
        </ul>
      </nav>
    </div>
  );
};

export default Pagination;
