import { useEffect, useRef } from "react";
import styles from "./Bar.module.css"
type props = {
    index?: number;
    onClick?: any;
    style?: React.CSSProperties
    isCurrent: boolean
    percentage: number
}

const Bar = ({ onClick, isCurrent, percentage }: props) => {
    const divref = useRef<HTMLDivElement | null>(null)


    // 
    // console.log(before.width)
    useEffect(() => {
        if (divref.current && isCurrent) {
            divref.current.style.width = percentage + "%";

        }
    }, [percentage, divref.current])
    return (
        <>
            <div className={styles.bar} onClick={onClick}>
                <div className={styles.bar2} ref={divref}></div>
            </div>

        </>
    )
}

export default Bar;