Materialize Sidenav is not working with React

I have an app where logged in Users have a sidenav which is works from Materialize css library.

Here is the react component

import React, {Fragment, useEffect} from 'react'
import {Link} from 'react-router-dom'

// Materialize JS Import
import M from 'materialize-css/dist/js/materialize.min.js'
import "materialize-css/dist/css/materialize.min.css"

// Actions
import {logout, loadUser} from '../../actions/authActions'

const navbarStyles = {
  marginLeft: '20px'
}

const Navbar = ({loadUser, logout, auth: {isAuthenticated, loading}}) => {

  useEffect(() => {
    loadUser()

    if(isAuthenticated !== null) {
      var elems = document.querySelectorAll('.sidenav');
      var instances = M.Sidenav.init(elems);
    }

  }, [isAuthenticated])

  const onLogout = () => {
    logout()
  }

  return (
      <Fragment>
        {isAuthenticated && !loading ? (
          <Fragment>    
            <div className="navbar-fixed">
              <nav id="nav">
                <div className="nav-wrapper teal accent-4">
                  <Link to="/"><a href="#" className="brand-logo" style={navbarStyles}>Home</a></Link>
                  <a href="#" data-target="sidenav-overlay" className="sidenav-trigger"><i className="material-icons">menu</i></a>
                  <ul id="nav-mobile" className="right hide-on-med-and-down">
                    <li><Link to="/upload" className="waves-effect waves-dark" ><i className="small material-icons left">cloud</i>Upload</Link></li>
                    <li><Link to="/guests/list" className="waves-effect waves-dark" ><i className="small material-icons left">list</i>Guest List</Link></li>
                    <li><Link to="/apartments" className="waves-effect waves-dark" ><i className="small material-icons left">hotel</i>Apartments</Link></li>
                    <li><Link to="/keys" className="waves-effect waves-dark" ><i className="small material-icons left">vpn_key</i>Keys</Link></li>
                    <li><Link to="/logs" className="waves-effect waves-dark" ><i className="small material-icons left">history</i>Logs</Link></li>
                    <li><a href="#!" className="waves-effect waves-dark" onClick={onLogout}><i className="small material-icons left">power_settings_new</i>Logout</a></li>
                  </ul>
                </div>
              </nav>
            </div>

            <ul className="sidenav" id="sidenav-overlay">
                <li><Link to="/upload" className="waves-effect waves-dark sidenav-close" ><i className="small material-icons left">cloud</i>Upload</Link></li>
                <li><Link to="/guests/list" className="waves-effect waves-dark sidenav-close" ><i className="small material-icons left">list</i>Guest List</Link></li>
                <li><Link to="/apartments" className="waves-effect waves-dark sidenav-close" ><i className="small material-icons left">hotel</i>Apartments</Link></li>
                <li><Link to="/keys" className="waves-effect waves-dark sidenav-close" ><i className="small material-icons left">vpn_key</i>Keys</Link></li>
                <li><Link to="/logs" className="waves-effect waves-dark sidenav-close" ><i className="small material-icons left">history</i>Logs</Link></li>
                <li><a href="#!" className="waves-effect waves-dark sidenav-close" onClick={onLogout}><i className="small material-icons left">power_settings_new</i>Logout</a></li>
            </ul>
          </Fragment>
        ) : (
            <div className="navbar-fixed">
            <nav id="nav">
              <div className="nav-wrapper teal accent-4">
                <Link to="/"><a href="#" className="brand-logo" style={navbarStyles}>Home</a></Link>
              </div>
            </nav>
          </div>
        )}
      </Fragment>
    )
}

export default Navbar

I have checked that Materialize actually init Sidenav into element but trigger doesn't work. Also if I call .open() method of instance I got just dark tint over the application (sidenav effect but nav is not showing up).

Also, I am using Materialize the same way in other components but other features and they work perfect. Only Sidenav part crashes.