PrivateRoute Errors.

App.js

import React from 'react';
import {Switch,Route,Redirect} from 'react-router-dom'
import {Button} from 'semantic-ui-react'
import PropTypes from 'prop-types'
import PrivatePage from './PrivatePage'
import LoginPage from './LoginPage'
import client from './feathers'
import WithAuthentication from './WithAuthentication'

const App = () => (
  <div>
  <Button onClick={()=>client.logout()}>Logout</Button>
      <Switch>
      <PrivateRoute exact path='/' component={PrivatePage} />
      
      
      <Route path='/login' exact component={LoginPage}/>
      </Switch>
      </div>
    );
   
    

    const checkNotNull = obj =>{
      console.log('whats dis? ',obj) // prints null
      return obj&&
      Object.keys(obj).length !== 0 && obj.constructor !== Object
    }

    function PrivateRoute ({component: Component,  ...rest}) {
      // console.log(authUser)
      return (
        <WithAuthentication
      render={
        ({authUser})=>
        <Route
          {...rest}
          render={(props) => checkNotNull(authUser)
            ? <Component {...{authUser}} {...rest} {...props} />
            : <Redirect to={{pathname: '/login', state: {from: props.location}}} />}
        />
      }
      />
      )
    }

    PrivateRoute.propTypes={
      location:PropTypes.shape({}),
      component:PropTypes.func.isRequired
      
    }

    PrivateRoute.defaultProps={
      location:null
    }

export default App;

WithAuthentication.js

import React,{Component} from 'react'
import PropTypes from 'prop-types'
import client from './feathers'
/* eslint-disable no-underscore-dangle */



export default class WithAuthentication extends Component{

    constructor(props){
        super(props)
        this.state={
            authUser:null
        }
    }

    componentDidMount(){
        const token = localStorage.getItem('feathers-jwt');
      //  const {history:{push}}=this.props
        if(token){
            this.handleAuth().then(
                authUser=>{
                    console.log('trouble: ',authUser) // prints but route fails to pass
                    this.setState({authUser})
                }
            ).catch(
              //  ()=>push('/login')
            )
              
        }    
     }

     handleAuth= async ()=> {
      //  if (this._isMounted) this.setState({ authUser });
      try {
      const {accessToken} = await client.authenticate();
      const {userId} = await client.passport.verifyJWT(accessToken)
      const authUser = await client.service('users').get(userId)
      return authUser
      } catch(err){
        return null
      }
      }

      handleError=()=> {
        if (this._isMounted) this.setState({ authUser:null });
      }
     
    render(){
        const {render,} =this.props
        const {authUser}=this.state
        return (
            <div>
            {render({authUser})}
           </div>
        )
    }
}

WithAuthentication.propTypes={
  //  history:PropTypes.shape({}).isRequired,
    render:PropTypes.func.isRequired
}

hello, what's the proper way to authenticate a route in react-router-dom? With this snippet I get two errors that I do not get how to solve:

1. Can't call setState (or forceUpdate) on an unmounted component.
2. looks like the authUser state gets set after the checkNotNull(obj) function is run.
   Kindly help me with any of these. Thank you.