"use client"

import { useRouter } from "next/navigation"
import { ArrowLeft } from "lucide-react"

interface BackButtonProps {
  href?: string
  label?: string
}

export function BackButton({ href, label = "Back" }: BackButtonProps) {
  const router = useRouter()

  function handleClick() {
    if (href) router.push(href)
    else router.back()
  }

  return (
    <button
      onClick={handleClick}
      className="mb-4 flex items-center gap-1.5 text-sm text-white/40 transition hover:text-white/80"
    >
      <ArrowLeft className="h-4 w-4" />
      {label}
    </button>
  )
}