import React from "react"
import PropTypes from "prop-types"
import { ButtonGroup, IconButton } from "../../button"

export default function Navigation({
  onPreviousPage,
  onNextPage,
  hasPreviousPage,
  hasNextPage,
}) {
  return (
    <ButtonGroup spacing={0}>
      <IconButton
        icon="left"
        is="plain"
        label="Previous group of results"
        onClick={onPreviousPage}
        disabled={!hasPreviousPage}
      />
      <IconButton
        icon="right"
        is="plain"
        label="Next group of results"
        onClick={onNextPage}
        disabled={!hasNextPage}
      />
    </ButtonGroup>
  )
}

Navigation.propTypes = {
  onPreviousPage: PropTypes.func.isRequired,
  onNextPage: PropTypes.func.isRequired,
  hasPreviousPage: PropTypes.bool.isRequired,
  hasNextPage: PropTypes.bool.isRequired,
}
