import { Button } from './ui'
import { useRouter } from 'next/router'

export function BackButton(): React.ReactElement {
  const router = useRouter()
  return (
    <Button
      type="button"
      variant="ghost"
      size="small"
      onClick={() => {
        void router.push('/')
      }}
      className="text-blue-600 hover:text-blue-700 mb-4"
    >
      ← Back to Articles
    </Button>
  )
}