import React from 'react';
import { usePaginationContext } from './pagination-context';
import { PaginationItem } from './pagination-item';

export type PaginationPreviousProps = React.ButtonHTMLAttributes<any>;

export const PaginationPrevious: React.FC<React.PropsWithChildren<PaginationPreviousProps>> = ({ children, ...props }) => {
  const { currentPage, isFirst, update, resolveUrl } = usePaginationContext();
  const href = isFirst ? undefined : resolveUrl(currentPage - 1);
  return (
    <PaginationItem
      className="pagination-previous"
      disabled={isFirst} aria-disabled={isFirst}
      aria-label="previous page" title="previous page"
      onClick={() => update && update('prev')}
      href={href}
      rel={href && 'prev'}
      {...props}
    >
      {children}
    </PaginationItem>
  );
};

PaginationPrevious.displayName = 'PaginationPrevious';
