modify/restrict login

[AsamShanBD]

I have a bunch of users, only some should have access to the admin page, is there a way to do a check in a users collection for the admin flag before signing in?

[AsamShanBD]

I only need 1-2 users access the resources, so I guess alternatively I could just use permissions to restrict all the content if it is not one of those users logged in?

[LaszloDev]

Can you specify this

only some should have access to the admin page

Do you want to prevent / allow only specific users to login? Or do you want to allow login, but restrict access to collections?

[AsamShanBD]

Can you specify this

only some should have access to the admin page

Do you want to prevent / allow only specific users to login? Or do you want to allow login, but restrict access to collections?

I only want to allow specific users to log in if possible

[LaszloDev]

We would need to add a check at login if that user is allowed to login. I saw that the old ra-firebase library used to set a flag at the user data in the database. That would be a feature request.

[AsamShanBD]

Thanks for this, I think that if there is enough interest this would be a good feature to implement

[simokhalil]

Interested in this feature too

[lafayetteduarte]

Hey , i have something similar to your requirement in one of my projects. I used firebase custom claims to restrict access to the app and permissions from the authprovider to only allow tokens with a specific claim to access. if the users token do not contais the custom claim, i sign the user off. my original plan was to build a custom route with an access denied message but the signout approach was good enough.

so, here is the ref on custom claims in firebase auth. https://medium.com/google-developers/controlling-data-access-using-firebase-auth-custom-claims-88b3c2c9352a

-I created a firestore collection where i can specify the user's email and an array of custom claims i want him to have. -next, i created a cloud function with an onCreate trigger , when the data is created , my function will go on and find a firebase user with that email , then add the claims specified in the collection attributes are set on the user. -on the next logon, you will be able to check for the custom claim and perform your checks.

i can provide a sample project if anyone needs it. Would be nice to have some extension point where we could do the custom claims checking

hope it helps.

[benwinding]

Hey Guys,

Yes Authorization this is a pretty crucial feature for most admin panels. Right now this is possible using the standard method of Authorization within react-admin see this link for details.

The most secure way to enable this is to use Custom Claims (as mentioned by @lafayetteduarte) this allows you to set secure permissions to the associated user held within Firebase Auth Users Table.

Authorized Login

You can wrap the default auth provider and add your own conditions that must be met when the user tries to login. The following example checks to see if the user has the admin string in his custom claims array.

const authProvider = FirebaseAuthProvider(firebaseConfig, options);
const dataProvider = FirebaseDataProvider(firebaseConfig, options);

// Use this just like the normal auth provider
const myAuthProvider = {
  // Copy all authprovider functionality
  ...authProvider,
  // Wrap the login and check for custom claims
  login: async (params) => {
    const user = await authProvider.login(params);
    // getPermissions is how when get the custom claims for the logged in user
    const claims = await authProvider.getPermissions();
    const isAdmin = Array.isArray(claims) && claims.includes("admin");
    if (isAdmin) {
      return user;
    }
    // Make sure user is logged out, if not an admin
    await authProvider.logout()
    throw new Error("Login error, invalid permissions");
  },
};

Authorized Resources

You can also disable certain resources for different users.

Example from the docs here

      <Admin
        loginPage={CustomLoginPage}
        dataProvider={dataProvider}
        authProvider={authProvider}
      >
        {(permissions) => [
           {/* This calls "authProvider.getPermissions()" 
                which returns the custom claims for the current user */}
          <Resource
            name="posts"
            list={PostList}
            show={PostShow}
            create={PostCreate}
            edit={permissions === "admin" ? PostEdit : null}
          />,
          <Resource
            name="users"
            icon={UserIcon}
            list={UserList}
            show={UserShow}
            create={UserCreate}
            edit={UserEdit}
          />,
        ]}
      </Admin>

To add/update user claims you need to use the firebase-admin package, which can only run on the server. This makes updating the user claims much harder. But it's not that difficult (example here).

There's also many other examples on how to restrict resources, fields and views in the react-admin docs. Hope this helps.

Cheers, Ben