follow button

This commit is contained in:
Alejandro Gomez
2023-06-30 22:33:05 +02:00
parent aa1718a141
commit 57d014410c
4 changed files with 106 additions and 8 deletions

View File

@ -2,7 +2,8 @@ import "./async-button.css";
import { useState } from "react";
import Spinner from "element/spinner";
interface AsyncButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
interface AsyncButtonProps
extends React.ButtonHTMLAttributes<HTMLButtonElement> {
disabled?: boolean;
onClick(e: React.MouseEvent): Promise<void> | void;
children?: React.ReactNode;
@ -28,8 +29,15 @@ export default function AsyncButton(props: AsyncButtonProps) {
}
return (
<button type="button" disabled={loading || props.disabled} {...props} onClick={handle}>
<span style={{ visibility: loading ? "hidden" : "visible" }}>{props.children}</span>
<button
type="button"
disabled={loading || props.disabled}
{...props}
onClick={handle}
>
<span style={{ visibility: loading ? "hidden" : "visible" }}>
{props.children}
</span>
{loading && (
<span className="spinner-wrapper">
<Spinner />