> For clean Markdown of any page, append .md to the page URL.
> For a complete documentation index, see https://docs.monite.com/v2023-09-01/sdks/react/components/userroledetails/llms.txt.
> For AI client integration (Claude Code, Cursor, etc.), connect to the MCP server at https://docs.monite.com/_mcp/server.

# UserRoleDetails component

## Overview

The `UserRoleDetails` component is a comprehensive React component that displays the permission set of a specific [user role](../../../get-started/server-side#create-role).

## Permissions

To access this component, the entity user must have `read` permissions for the `role` object. For more information, see [List of permissions](/v2023-09-01/api/concepts/authentication#permissions).

## Preview

![UserRoleDetails component preview](/_fern-img/29f9f52f6bd3a00f71bf87eec7377a645117a0b7c1c3ed18fc505ed56d086909.webp)

## Usage

Use in the `UserRoleDetails` component in your application to view the details of the existing user roles as shown:

**`React.js`**

```jsx React.js
import { UserRoleDetails } from "@monite/sdk-react";

// This component must be rendered within the MoniteProvider wrapper
const UserRoleDetailsPage = () => {
  return <UserRoleDetails />;
};
```

## Props

The following table shows all `UserRoleDetails` component properties, their types, and descriptions:

| Prop | Type     | Description                                                          |
| :--- | :------- | :------------------------------------------------------------------- |
| `id` | `string` | This prop accepts the UUID of the user role details to be displayed. |