Как получить доступ к пользовательским утверждениям пользователя и предотвратить доступ к компоненту с помощью Firebase?

Question

Я пытаюсь ввести ограничения для определенных компонентов, основываясь на том, что пользовательские утверждения принадлежат зарегистрированному пользователю. Я реализовал способ, при котором компоненты будут загружаться при аутентификации пользователя, поэтому без авторизации, основанной на утверждениях, как я хочу.

Я слежу за этим замечательным учебным материалом Робина Виеруха и застрял в разделе авторизации, если он будет полезен всем, кто пытается ответить на мой вопрос https://www.robinwieruch.de/complete-firebase-authentication-react-tutorial/

Компонент Home без логики, которую я хочу ниже:

import React from "react";

import {withAuthz} from "./Components/Session";

class Home extends React.Component {

    render() {

        return(


            <h1>Protected content</h1>

        );
    }
}

const condition = authUser => !!authUser;

export default withAuthz(condition)(Home);

Этот компонент рендерится, если встречается condition, в этом случае это просто, если authUser зарегистрирован в firebase. Компонент Home экспортируется вместе с HOC withAuthz, который принимает мои condition и Home, которые будут отображаться, если условие проходит в пределах withAuthz.

Теперь я хочу изменить свое состояние на что-то вроде этого, основываясь на утверждениях:

const condition = authUser => !!authUser.claims.admin;

Я знаю, что это можно сделать, извлекая заявки из idToken согласно документации Firebase:

firebase.auth().currentUser.getIdTokenResult.idTokenResult.claims.admin...

Как я могу предотвратить рендеринг моего Home компонента на основе утверждений, а не только того, аутентифицирован ли пользователь или нет? HOC withAuthz просто проверяет, когда он монтируется, аутентифицирован ли пользователь, а затем решает, следует ли перенаправить или отобразить то, что ему было передано:

const withAuthz = (condition) => Component => {
    class WithAuthz extends React.Component {

        componentDidMount() {
            this.listener = this.props.firebase.auth.onAuthStateChanged(
                authUser => {
                    if (!condition(authUser)) {
                        this.props.history.push("/login");
                    }
                }
            )
        }

// further render the given component if a user is authenticated etc...

РЕДАКТИРОВАТЬ ПРОГРЕСС

Мне удалось получить утверждения аутентифицированного пользователя в withAuthz HOC и изменить компонент condition in Home:

const condition = idTokenResult => !!idTokenResult;

Претензии в withAuthz HOC:

    componentDidMount() {
        this.listener = this.props.firebase.auth.onAuthStateChanged(
            authUser => {

                /*if (!condition(authUser)) {
                    this.props.history.push("/login");
                }*/

                authUser.getIdTokenResult().then((idTokenResult) => {

                    if (!condition(idTokenResult)) {

                        this.props.history.push("/login")
                    }

                    console.log(idTokenResult.claims);
                })


            }
        )

    }

Но когда я изменяю условие на что-то вроде ниже, реагируют на ошибки в строке ниже, говоря, что idTokenResult.claims равно нулю

const condition = idTokenResult => !!idTokenResult.claims.admin;