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 (<LoadingIcon key="icon" />);
        }
        if (isLoaded(projects) && isEmpty(projects)) {
            return (<Text testID="recommended_cards_view">Nothing to work on!</Text>);
        }

        // 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 (
            <ScrollView
                testID="recommended_cards_view"
                contentContainerStyle={style.listView}
                removeClippedSubviews
            >
                { 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 (
    <NavbarWithoutAuth brandPath={authExists ? LIST_PATH : '/'}>
      {authExists ? (
        <AccountMenu />
      ) : (
        <Button
          className={classes.signIn}
          component={Link}
          to={LOGIN_PATH}
          data-test="sign-in">
          Sign In
        </Button>
      )}
    </NavbarWithoutAuth>
  )

<div className={classes.or}>
          or
        </div>
        <div className={classes.providers}>
          <GoogleButton onClick={() => this.providerLogin('google')} />
        </div>
        <div className={classes.signup}>
          <span className={classes.signupLabel}>
            Need an account?
          </span>
          <Link className={classes.signupLink} to={SIGNUP_PATH}>
            Sign Up
          </Link>
        </div>
        {
          isLoaded(authError) && !isEmpty(authError) && snackCanOpen &&
            <Snackbar
              open={isLoaded(authError) && !isEmpty(authError) && snackCanOpen}
              message={authError ? authError.message : 'Signup error'}
              action='close'
              autoHideDuration={3000}
            />
        }
      </div>
    )
  }
}

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

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

</div>
        <div className={classes.providers}>
          <GoogleButton onClick={() => this.providerLogin('google')} />
        </div>
        <div className={classes.login}>
          <span className={classes['login-label']}>
            Already have an account?
          </span>
          <Link className={classes['login-link']} to={LOGIN_PATH}>
            Login
          </Link>
        </div>
        {
          isLoaded(authError) && !isEmpty(authError) && snackCanOpen &&
            <Snackbar
              open={isLoaded(authError) && !isEmpty(authError) && snackCanOpen}
              message={authError ? authError.message : 'Signup error'}
              action='close'
              autoHideDuration={3000}
              onRequestClose={() => this.setState({ snackCanOpen: false })}
            />
        }
      </div>
    )
  }
}

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

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

    if (!isLoaded(project)) {
      return <LoadingSpinner />
    }

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

<div className={classes.or}>
          or
        </div>
        <div className={classes.providers}>
          <GoogleButton onClick={() => this.providerLogin('google')} />
        </div>
        <div className={classes.login}>
          <span className={classes.loginLabel}>
            Already have an account?
          </span>
          <Link className={classes.loginLink} to={LOGIN_PATH}>
            Login
          </Link>
        </div>
        {
          isLoaded(authError) && !isEmpty(authError) && snackCanOpen &&
            <Snackbar
              open={isLoaded(authError) && !isEmpty(authError) && snackCanOpen}
              message={authError ? authError.message : 'Signup error'}
              action='close'
              autoHideDuration={3000}
              onRequestClose={() => this.setState({ snackCanOpen: false })}
            />
        }
      </div>
    )
  }
}

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) => (
        <li key={todo.id}>{todo.name}</li>
      ))}
    </ul>
  );
}