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

# Counterparts component

## Overview

The `Counterparts` component is a comprehensive React component that renders the entire Counterparts page. The component integrates the functionalities of the `CounterpartsDetails` and `CounterpartsTable` components, providing a complete experience throughout the Counterparts workflow. This component provides the ability to create new counterparts and supports searching, filtering, and pagination between these counterparts.

## Permissions

To access this component, the entity user must have `read` permissions for the `counterpart` object. To create, edit, and delete counterparts, they must also have `create`, `update`, or `delete` permissions for the `counterpart` object. For more information, see [List of permissions](/api/concepts/authentication#permissions).

## Preview

![Counterparts component preview](/_fern-img/9fa381dce6d108713c98384f4c9ed669574643f934f16f20646b2f0394fb2795.webp)

## Usage

Bring in the `Counterparts` component into your application as shown:

**`React.js`**

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

...

// TODO: This component must be rendered within the MoniteProvider wrapper
const CounterpartsPage = () => {
  return <Counterparts />
};
```