import type { ComponentProps } from 'react'
import { Button } from '@evofw/ui/components/button'
import { Spinner } from '@evofw/ui/components/spinner'
import { cn } from '@evofw/ui/lib/utils'

interface LoadingButtonProps extends ComponentProps<typeof Button> {
  isLoading?: boolean
  loadingLabel?: string
}

export function LoadingButton({
  isLoading = false,
  loadingLabel,
  children,
  disabled,
  className,
  ...props
}: LoadingButtonProps) {
  const label =
    isLoading && loadingLabel != null ? loadingLabel : children

  return (
    <Button
      disabled={disabled ?? isLoading}
      className={cn(className)}
      {...props}
    >
      {isLoading && <Spinner data-icon="inline-start" />}
      {label}
    </Button>
  )
}
