+
+You will have access to the current entity in your code and display its value, make the column sortable, perform visibility checks, and more. You can also render custom HTML in table cells.
+
+## How to Set Up
+
+In this example, we will add a "Name" column and display the value of the `name` field in the user management page of the [Identity Module](../../Modules/Identity.md).
+
+### Step 1. Create Entity Prop Contributors
+
+The following code prepares a constant named `identityEntityPropContributors`, ready to be imported and used in your root module:
+
+```js
+// src/app/entity-prop-contributors.ts
+
+import {
+ eIdentityComponents,
+ IdentityEntityPropContributors,
+ IdentityUserDto,
+} from '@abp/ng.identity';
+import { EntityProp, EntityPropList, ePropType } from '@abp/ng.theme.shared/extensions';
+
+const nameProp = new EntityProp
+
+```js
+// src/app/entity-prop-contributors.ts
+
+import {
+ eIdentityComponents,
+ IdentityEntityPropContributors,
+ IdentityUserDto,
+} from '@abp/ng.identity';
+import { EntityProp, EntityPropList } from '@abp/ng.theme.shared/extensions';
+import { of } from 'rxjs';
+
+export function emailPropContributor(propList: EntityPropList
+
+You can validate the field, perform visibility checks, and do more. You will also have access to the current entity when creating a contibutor for an edit form.
+
+## How to Set Up
+
+In this example, we will add a "Date of Birth" field in the user management page of the [Identity Module](../../Modules/Identity.md) and validate it.
+
+### Step 1. Create Form Prop Contributors
+
+The following code prepares two constants named `identityCreateFormPropContributors` and `identityEditFormPropContributors`, ready to be imported and used in your root module:
+
+```js
+// src/app/form-prop-contributors.ts
+
+import {
+ eIdentityComponents,
+ IdentityCreateFormPropContributors,
+ IdentityUserDto,
+} from '@abp/ng.identity';
+import { ePropType, FormProp, FormPropList } from '@abp/ng.theme.shared/extensions';
+import { Validators } from '@angular/forms';
+
+const birthdayProp = new FormProp
+
+You can take any action (open a modal, make an HTTP API call, redirect to another page... etc) by writing your custom code. You can also access the current entity in your code.
+
+## How to Set Up
+
+In this example, we will add a "Click Me!" action and alert the current row's `userName` in the user management page of the [Identity Module](../../Modules/Identity.md).
+
+### Step 1. Create Entity Action Contributors
+
+The following code prepares a constant named `identityEntityActionContributors`, ready to be imported and used in your root module:
+
+```js
+// src/app/entity-action-contributors.ts
+
+import {
+ eIdentityComponents,
+ IdentityEntityActionContributors,
+ IdentityUserDto,
+} from '@abp/ng.identity';
+import { EntityAction, EntityActionList } from '@abp/ng.theme.shared/extensions';
+
+const alertUserName = new EntityAction
+
+1. Create a folder at this path: `src/app/identity-extended`
+
+2. Add an entity action similar to this:
+ ```js
+ // src/app/identity-extended/entity-action-contributors.ts
+
+ import {
+ eIdentityComponents,
+ IdentityEntityActionContributors,
+ IdentityUserDto,
+ } from '@abp/ng.identity';
+ import { EntityAction, EntityActionList } from '@abp/ng.theme.shared/extensions';
+ import { IdentityExtendedComponent } from './identity-extended.component';
+
+ const quickViewAction = new EntityAction{%{{{ user.userName }}}%}
+| {%{{{ 'AbpIdentity::DisplayName:Name' | abpLocalization }}}%} | +{%{{{ user.name }}}%} | +
|---|---|
| {%{{{ 'AbpIdentity::DisplayName:Surname' | abpLocalization }}}%} | +{%{{{ user.surname }}}%} | +
| {%{{{ 'AbpIdentity::EmailAddress' | abpLocalization }}}%} | +{%{{{ user.email }}}%} | +
| {%{{{ 'AbpIdentity::PhoneNumber' | abpLocalization }}}%} | +{%{{{ user.phoneNumber }}}%} | +
+
+You can take any action (open a modal, make an HTTP API call, redirect to another page... etc) by writing your custom code. You can also access to page data (the main record, usually an entity list) in your code. Additionally, you can pass in custom components instead of using the default button.
+
+## How to Add an Action to Page Toolbar
+
+In this example, we will add a "Click Me!" action and log `userName` of all users in the user management page of the [Identity Module](../../Modules/Identity.md) to the console.
+
+### Step 1. Create Toolbar Action Contributors
+
+The following code prepares a constant named `identityToolbarActionContributors`, ready to be imported and used in your root module:
+
+```js
+// src/app/toolbar-action-contributors.ts
+
+import {
+ eIdentityComponents,
+ IdentityToolbarActionContributors,
+ IdentityUserDto,
+} from '@abp/ng.identity';
+import { ToolbarAction, ToolbarActionList } from '@abp/ng.theme.shared/extensions';
+
+const logUserNames = new ToolbarAction
+
+### Step 1. Create A Custom Component
+
+We need to have a component before we can pass it to the toolbar action contributors:
+
+```js
+// src/app/click-me-button.component.ts
+
+import { IdentityUserDto } from '@abp/ng.identity';
+import { ActionData, EXTENSIONS_ACTION_DATA } from '@abp/ng.theme.shared/extensions';
+import { Component, Inject } from '@angular/core';
+
+@Component({
+ selector: 'app-click-me-button',
+ template: ``,
+})
+export class ClickMeButtonComponent {
+ constructor(
+ @Inject(EXTENSIONS_ACTION_DATA)
+ private data: ActionData