Function LoadingButton

components/loading-button.tsx:5–16

({
  children,
  ...rest
}: ComponentProps<"button">)

import { useFormStatus } from "react-dom";

export default function LoadingButton({
  children,
  ...rest
}: ComponentProps<"button">) {
  const { pending } = useFormStatus();

  return (
    <button {...rest} disabled={pending || rest.disabled}>
      <Spinner loading={pending}>{children}</Spinner>
    </button>
  );
}