import { checkIsStandalone, localStorageGet } from '@utils/helpers';
import styles from './styles.module.scss'
import SvgIcon from '@components/SvgIcon';
import { NavLink } from 'react-router-dom';
import { ROUTE_PATH } from '@constants/routes';

const i18n = global.i18n;
const WWalletNav = () => {
    const isStandalone = checkIsStandalone();
    const isHistory = () => {
        switch (window.location.pathname) {
            case ROUTE_PATH.WITHDRAW_HISTORY:
            case ROUTE_PATH.DEPOSIT_HISTORY: return true;
        }
        return false;
    }

    const isWithdraw = () => {
        switch (window.location.pathname) {
            case ROUTE_PATH.SAQUE:
            case ROUTE_PATH.WITHDRAW: return true;
        }
        return false;
    }

    return (
        <div className={`${styles.container} `}>
            <NavLink className={`${styles.button}  ${window.location.pathname == ROUTE_PATH.DEPOSIT ? styles.curNav : ""}`} to={ROUTE_PATH.DEPOSIT}>
                <SvgIcon className={styles.bottomIcon} herf={"icon_wallet_deposit"}></SvgIcon>
                <span className={styles.bottomtxt}>{i18n.t("tab.deposit")}</span>
            </NavLink>

            <NavLink className={`${styles.button}  ${isWithdraw() ? styles.curNav : ""}`} to={ROUTE_PATH.WITHDRAW}>
                <SvgIcon className={styles.bottomIcon} herf={"icon_wallet_withdraw"}></SvgIcon>
                <span className={styles.bottomtxt}>{i18n.t("tab.withdraw")}</span>
            </NavLink>

            <NavLink className={`${styles.button}  ${isHistory() ? styles.curNav : ""}`} to={ROUTE_PATH.HISTORY}>
                <SvgIcon className={styles.bottomIcon} herf={"icon_wallet_history"}></SvgIcon>
                <span className={styles.bottomtxt}>{i18n.t("tab.history")}</span>
            </NavLink>

            
            <NavLink className={`${styles.button}  ${window.location.pathname == ROUTE_PATH.VIP ? styles.curNav : ""}`} to={ROUTE_PATH.VIP}>
                <SvgIcon className={styles.bottomIcon} herf={"icon_wallet_vip"}></SvgIcon>
                <span className={styles.bottomtxt}>{i18n.t("tab.vip")}</span>
            </NavLink>
        </div>
    )
}

export default WWalletNav;