import React from "react";

export function Spinner(props: { className?: string; }) {
    const chars = ["⠋",
        "⠙",
        "⠹",
        "⠸",
        "⠼",
        "⠴",
        "⠦",
        "⠧",
        "⠇",
        "⠏"
    ];
    const [index, setIndex] = React.useState(0);
    React.useEffect(() => {
        const interval = setInterval(() => {
            setIndex((index + 1) % chars.length);
        }, 80);
        return () => clearInterval(interval);
        // eslint-disable-next-line react-hooks/exhaustive-deps
    }, [index]);

    return <span className={props.className}>{chars[index]}</span>;
}