import { isEmpty } from "lodash";
import React, { useContext, useState, useEffect } from "react";
import { Link, useLocation, useNavigate } from "react-router-dom";
import AuthProvider from "../context/AuthContext";
const Footer = () => {
  let { user } = useContext(AuthProvider);
  return (
    <>
       
      <nav className=" footerNavLink">
        <div className="footerbox shine">
          <div className="footerbox-bg">
            <Link neua="Deposit" className="ui-link" to={!isEmpty(user) ? "/deposit" : "/login"}>
              <img src="/assets/images/deposit.png" />
              <span>Deposit</span>
            </Link>
            <Link neua="withdraw" className="ui-link" to={!isEmpty(user) ? "/withdraw" : "/login"}>
              <img src="/assets/images/withdraw.png" />
              <span>Withdraw</span>
            </Link>
          </div>
          <div className="footerbox-home">
            <img src="/assets/images/home-nav.png" />
          </div>
          <div className="footerbox-bg">
            <Link neua="In-Play" className="" to="/inplay">
              <img src="/assets/images/inplay.png" />
              <span> In-Play</span>
            </Link>
            <Link className="ui-link" to={!isEmpty(user) ? "/profile" : "/login"}>
              <img src="/assets/images/account.png" />
              <span> Account</span>
            </Link>
          </div>
        </div>

      </nav>
    
    </>
  );
};

export default Footer;