import {
    Button,
    type ButtonProps,
    LoadingWithAnimation,
} from "@common/components";

interface WithLoadingButtonProps extends ButtonProps {
    isLoading: boolean;
    children: React.ReactNode;
}

function WithLoadingButton({
    isLoading,
    children,
    ...props
}: WithLoadingButtonProps) {
    return (
        <Button {...props}>
            {isLoading ? (
                <div className="flex w-[4.8rem] items-center justify-center">
                    <div className="relative size-[2rem]">
                        <LoadingWithAnimation color="primary" />
                    </div>
                </div>
            ) : (
                children
            )}
        </Button>
    );
}

export { WithLoadingButton };