'use client'

import { useRouter } from 'next/navigation'

type AuthFormCloseButtonProps = {
  className?: string
}

/** Zamyka widok auth: wstecz w historii lub strona główna (gdy brak wpisu). */
export default function AuthFormCloseButton({ className = '' }: AuthFormCloseButtonProps) {
  const router = useRouter()

  function onClose() {
    if (typeof window !== 'undefined' && window.history.length > 1) {
      router.back()
      return
    }
    router.push('/')
  }

  return (
    <button
      type="button"
      onClick={onClose}
      className={`absolute right-3 top-3 z-10 rounded-lg p-2 text-gray-500 transition-colors hover:bg-gray-100 hover:text-gray-900 focus-visible:outline focus-visible:ring-2 focus-visible:ring-[color:var(--logo-color-dark)] focus-visible:ring-offset-2 sm:right-4 sm:top-4 ${className}`.trim()}
      aria-label="Zamknij"
    >
      <svg className="h-5 w-5" fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden>
        <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M6 18L18 6M6 6l12 12" />
      </svg>
    </button>
  )
}