Now that we have access to the set of roles the current user belongs to, we can start preventing them from accessing certain pages of the application, depending on which roles they are assigned to. To make this process easier, we'll add the following Vuex getter function to the ClientApp/store/getters.js file:
export const isInRole = (state, getters) => role => {
const result = getters.isAuthenticated && state.auth.roles.indexOf(role) > -1;
return result;
};
As the name suggests, this getter function determines whether the current user is in a specific role, which we pass in as an argument. This is quite different to the getter functions we've defined before, as in addition to the state parameter we also make use of the optional getters parameter that we also have access to if we need it. On top of this, we then...