*** title: "BulkAction" generated: true --------------- ## BulkAction Configures a bulk action which can be performed on all selected items in a list view. For a full example, see the [registerBulkAction](/current/core/reference/admin-ui-api/bulk-actions/register-bulk-action#registerbulkaction) docs. ```ts title="Signature" interface BulkAction { location: BulkActionLocationId; label: string; getTranslationVars?: ( context: BulkActionFunctionContext, ) => Record | Promise>; icon?: string; iconClass?: string; onClick: (context: BulkActionClickContext) => void; isVisible?: (context: BulkActionFunctionContext) => boolean | Promise; requiresPermission?: string | ((userPermissions: string[]) => boolean); } ```

### location \BulkActionLocationId`} /> ### label \ ### getTranslationVars \BulkActionFunctionContext, ) => Record | Promise>`} /> An optional function that should resolve to a map of translation variables which can be used when translating the `label` string. ### icon \ A valid [Clarity Icons](https://core.clarity.design/foundation/icons/shapes/) icon shape, e.g. "cog", "user", "info-standard". ### iconClass \ A class to be added to the icon element. Examples: * is-success * is-danger * is-warning * is-info * is-highlight ### onClick \BulkActionClickContext) => void`} /> Defines the logic that executes when the bulk action button is clicked. ### isVisible \BulkActionFunctionContext) => boolean | Promise`} /> A function that determines whether this bulk action item should be displayed in the menu. If not defined, the item will always be displayed. This function will be invoked each time the selection is changed, so try to avoid expensive code running here. *Example* ```ts import { registerBulkAction, DataService } from '@vendure/admin-ui/core'; registerBulkAction({ location: 'product-list', label: 'Assign to channel', // Only display this action if there are multiple channels isVisible: ({ injector }) => injector.get(DataService).client .userStatus() .mapSingle(({ userStatus }) => 1 < userStatus.channels.length) .toPromise(), // ... }); ``` ### requiresPermission \ boolean)`} /> Control the display of this item based on the user permissions. *Example* ```ts registerBulkAction({ // Can be specified as a simple string requiresPermission: Permission.UpdateProduct, // Or as a function that returns a boolean if permissions are satisfied requiresPermission: userPermissions => userPermissions.includes(Permission.UpdateCatalog) || userPermissions.includes(Permission.UpdateProduct), // ... }) ```

## BulkActionLocationId A valid location of a list view that supports the bulk actions API. ```ts title="Signature" type BulkActionLocationId = | 'product-list' | 'facet-list' | 'collection-list' | 'customer-list' | 'customer-group-list' | 'customer-group-members-list' | 'customer-group-members-picker-list' | 'promotion-list' | 'seller-list' | 'channel-list' | 'administrator-list' | 'role-list' | 'shipping-method-list' | 'stock-location-list' | 'payment-method-list' | 'tax-category-list' | 'tax-rate-list' | 'zone-list' | 'zone-members-list' | string ``` ## BulkActionFunctionContext This is the argument which gets passed to the `getTranslationVars` and `isVisible` functions of the BulkAction definition. ```ts title="Signature" interface BulkActionFunctionContext { selection: ItemType[]; hostComponent: ComponentType; injector: Injector; route: ActivatedRoute; } ```

### selection \ An array of the selected items from the list. ### hostComponent \ The component instance that is hosting the list view. For instance, `ProductListComponent`. This can be used to call methods on the instance, e.g. calling `hostComponent.refresh()` to force a list refresh after deleting the selected items. ### injector \Injector`} /> The Angular [Injector](https://angular.io/api/core/Injector) which can be used to get service instances which might be needed in the click handler. ### route \

## BulkActionClickContext This is the argument which gets passed to the `onClick` function of a BulkAction. ```ts title="Signature" interface BulkActionClickContext extends BulkActionFunctionContext { clearSelection: () => void; event: MouseEvent; } ``` * Extends: [`BulkActionFunctionContext`](/current/core/reference/admin-ui-api/bulk-actions/bulk-action#bulkactionfunctioncontext)``

### clearSelection \ void`} /> Clears the selection in the active list view. ### event \ The click event itself.