import styles from './styles.module.scss'
import {useEffect, useRef} from "react";
import {useThemeProvider} from "@contexts/themeContext";
const WSport=({})=>{
    const {isMobile}=useThemeProvider();
    const initBetby=()=>{
        var bt = new window.BTRenderer().initialize({
            brand_id: "2424948766365847552",
            token: "",
            onTokenExpired: function() {},
            themeName: "default-table",
            lang: "en",
            target: document.getElementById('betby'),
            betSlipOffsetBottom: 70,
            betSlipOffsetRight: 0,
            betSlipOffsetTop: 130,
            betslipZIndex: 100,
            onRouteChange: function() {},
            onLogin: function() {},
            onRegister: function() {},
            onSessionRefresh: function() {},
            onBetSlipStateChange: function() {}
        })
        return bt;
    }
    useEffect(()=>{
        const bt=initBetby();
        return ()=>{
            if (bt)bt.kill();
        }
    },[])
    return (
        <div id="betby" className={`${styles.container} ${isMobile()?styles.container_m:''}`}></div>
    )
}
export default WSport;