usePermissions

usePermissions calls the getPermissions method from the authProvider under the hood.

It returns the result of react-query's useQuery which includes many properties, some of which being isSuccess and isError.

Data that is resolved from the getPermissions will be returned as the data in the query result.

Usage

usePermissions can be useful when you want to get user's permission's anywhere in your code.

For example, if you want only the users with the admin role to see the create button in a list page, we have a logic in authProvider's getPermissions method like below:

import type { AuthProvider } from "@refinedev/core";

const authProvider: AuthProvider = {
  // ...
  getPermissions: async (params) => {
    if (params) {
      // do some logic like for example you can get roles for specific tenant
      return ["admin"];
    }

    return ["admin"];
  },
  // ...
};

Get permissions data in the list page with usePermissions and check if the user has "admin" role:

pages/post/list

import { usePermissions } from "@refinedev/core";
import { List } from "@refinedev/antd";

export const PostList: React.FC = () => {
  const { data: permissionsData } = usePermissions({
    params: { tenantId: "id" }, // you can pass parameters to getPermissions
  });

  return <List canCreate={permissionsData?.includes("admin")}>...</List>;
};

To learn more about the List component and CRUD views, refer to the UI Libraries guide.

Usage​

Usage