SubmitButton.tsx 994 B

123456789101112131415161718192021222324252627282930313233343536373839
  1. import type { MouseEventHandler } from 'react'
  2. // End of third-party imports
  3. import { Button, cn } from 'ui'
  4. interface SubmitButtonProps {
  5. isSubmitting: boolean
  6. userEmail: string
  7. onClick?: MouseEventHandler<HTMLButtonElement>
  8. className?: string
  9. descriptionClassName?: string
  10. }
  11. export function SubmitButton({
  12. isSubmitting,
  13. userEmail,
  14. onClick,
  15. className,
  16. descriptionClassName,
  17. }: SubmitButtonProps) {
  18. return (
  19. <div className={cn('flex flex-col gap-3', className)}>
  20. <Button
  21. htmlType="submit"
  22. size="small"
  23. block
  24. disabled={isSubmitting}
  25. loading={isSubmitting}
  26. onClick={onClick}
  27. >
  28. Send support request
  29. </Button>
  30. <p className={cn('text-xs text-foreground-lighter text-balance pr-4', descriptionClassName)}>
  31. We will contact you at <span className="text-foreground font-medium">{userEmail}</span>.
  32. Please ensure emails from supabase.com are allowed.
  33. </p>
  34. </div>
  35. )
  36. }