I've implemented the code in the docs https://supertokens.com/docs/passwordless/common-customizations/sessions/protecting-frontend-routes#verifying-the-claims-of-a-session--pre :

import Session from "supertokens-auth-react/recipe/session";
import {UserRoleClaim} from "supertokens-auth-react/recipe/userroles"

function ProtectedComponent() {
    let claimValue = Session.useClaimValue(UserRoleClaim)
    if (claimValue.loading || !claimValue.doesSessionExist) {
        return null;
    }
    let roles = claimValue.value;
    if (Array.isArray(roles) && roles.includes("admin")) {
        // User is an admin
    } else {
        User doesn't have any roles, or is not an admin..
    }
}

roles

is undefined. The sessionContext.userId is set and I use the user id value to call

https://localhost/recipe/user/roles?userId={the user id}

and I see roles. So, why is the clamiValue.value undefined?