How to use the react-redux-firebase.isEmpty function in react-redux-firebase

withProps(({ auth, profile }) => ({
    authExists: isLoaded(auth) && !isEmpty(auth)
  })),
  // Flatten profile so that avatarUrl and displayName are props

render() {
        const {
            navigation,
            projects,
        } = this.props;
        if (!isLoaded(projects)) {
            return ();
        }
        if (isLoaded(projects) && isEmpty(projects)) {
            return ();
        }

        // since we can't completely filter projects by status AND projectType in firebase
        // we add a filter here to make sure we only display project types that the app can handle
        return (
            
                { this.renderAnnouncement() }
                { projects.filter(
                    p => p.value && p.value.projectType
                    && GLOBAL.SUPPORTED_PROJECT_TYPES.includes(p.value.projectType),
                )

function Navbar() {
  const classes = useStyles()

  // Get auth from redux state
  const auth = useSelector(state => state.firebase.auth)
  const authExists = isLoaded(auth) && !isEmpty(auth)

  return (
    
      {authExists ? (
        
      ) : (
        <button data-test="sign-in">
          Sign In
        </button>
      )}
    
  )

<div>
          or
        </div>
        <div>
           this.providerLogin('google')} /&gt;
        </div>
        <div>
          <span>
            Need an account?
          </span>
          
            Sign Up
          
        </div>
        {
          isLoaded(authError) &amp;&amp; !isEmpty(authError) &amp;&amp; snackCanOpen &amp;&amp;
            
        }
      
    )
  }
}

render () {
    const { firebase, todos } = this.props

    const todosList = (!isLoaded(todos))
                        ? 'Loading'
                        : (isEmpty(todos))
                          ? 'Todo list is empty'
                          : map(todos, (todo, id) => (
                              
                            ))
    return (
      <div>
        <div>
          <h2>react-redux-firebase decorators demo</h2>
        </div>
        <div>
          <h4>Todos List</h4>
          {todosList}
        </div>
      </div>
    )
  }

<div>
           this.providerLogin('google')} /&gt;
        </div>
        <div>
          <span>
            Already have an account?
          </span>
          
            Login
          
        </div>
        {
          isLoaded(authError) &amp;&amp; !isEmpty(authError) &amp;&amp; snackCanOpen &amp;&amp;
             this.setState({ snackCanOpen: false })}
            /&gt;
        }
      
    )
  }
}

render() {
    const { project, params } = this.props

    if (isEmpty(project)) {
      return <div>Project not found</div>
    }

    if (!isLoaded(project)) {
      return 
    }

    return (
      <div>
        <h2>Project Container</h2>
        <pre>Project Key: {params.projectname}</pre>
        <pre>{JSON.stringify(project, null, 2)}</pre>
      </div>
    )
  }
}

<div>
          or
        </div>
        <div>
           this.providerLogin('google')} /&gt;
        </div>
        <div>
          <span>
            Already have an account?
          </span>
          
            Login
          
        </div>
        {
          isLoaded(authError) &amp;&amp; !isEmpty(authError) &amp;&amp; snackCanOpen &amp;&amp;
             this.setState({ snackCanOpen: false })}
            /&gt;
        }
      
    )
  }
}

function List() {
  useFirestoreConnect([{
    collection: "todos",
  }]);
  const todos = useSelector((state: SystemState) => state.firebase.data.todos);
  if (!isLoaded(todos)) { return "Loading..."; }
  if (isEmpty(todos)) { return null; }
  return (
    <ul>
      {todos.map((todo: any) =&gt; (
        <li>{todo.name}</li>
      ))}
    </ul>
  );
}