import { Loader2 } from 'lucide-react'

export function PageLoading({ label = 'Loading…' }) {
  return (
    <div className="flex-1 flex items-center justify-center min-h-[200px] text-gray-500 text-sm gap-2">
      <Loader2 className="w-4 h-4 animate-spin" />
      {label}
    </div>
  )
}

export function PageError({ message, onRetry }) {
  return (
    <div className="flex-1 flex flex-col items-center justify-center min-h-[200px] text-red-600 text-sm gap-3 p-4">
      <p>{message || 'Failed to load data'}</p>
      {onRetry && (
        <button type="button" onClick={onRetry} className="px-3 py-1.5 rounded-lg bg-red-600 text-white text-xs font-medium">
          Retry
        </button>
      )}
    </div>
  )
}

export function EmptyState({ message = 'No records yet' }) {
  return (
    <div className="text-center py-12 text-gray-400 text-sm">{message}</div>
  )
}
