import { styled } from "@mui/material/styles";
import { Button, Skeleton} from "@mui/material";
const BeautifulButton = styled(Button)(({ theme }) => ({
    width: "250px",
    margin: "15px auto",
    padding: "20px 30px",
    fontSize: 18
}));

interface Props {
    isReady: boolean
    text:string
    type?: "button" | "reset" | "submit"
}

export default ({
    isReady = true,
    text,
    type = "button"
}:Props) => {

    if (isReady) {
        return <BeautifulButton type={type}>{text}</BeautifulButton>
    }
    return <Skeleton>{text}</Skeleton>
}