> For the complete documentation index, see [llms.txt](https://docs.umbraco.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.umbraco.com/umbraco-commerce/key-concepts/ui-extensions/order-line-actions.md).

# Order Line Actions

Order Line Actions UI Extension for Umbraco Commerce

{% hint style="info" %}
Available from Umbraco Commerce 15.1.0
{% endhint %}

Order Line Actions allow you to display buttons against each order line of a cart/order enabling you to perform custom actions per order line.

![Custom Order Line Action](https://961659879-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FP5oHq9zZ5dr8blWsnRJc%2Fuploads%2Fgit-blob-e6d00e843d4efe99112c64ebbbd5cfe0a858630c%2Forder-line-action.png?alt=media)

## Registering an Order Line Action

```typescript
import { UcManifestOrderLineAction } from "@umbraco-commerce/backoffice";

export const manifests : UcManifestOrderLineAction[] = [
    {
        type: 'ucOrderLineAction',
        kind: 'default',
        alias: 'My.OrderLineAction.MyOrderLineAction',
        name: 'My Order Line Action',
        weight: 300,
        forEntityTypes: [ 'uc:cart', 'uc:order' ],
        api: () => import('./my-order-line-action.api.js'),
        meta: {
            label: "#orderLineActions_myOrderLineAction",
            icon: 'icon-star'
        }
    }
];

extensionRegistry.register(manifests);
```

Each entry must have a type of `ucOrderLineAction` along with a unique `alias` and `name`. Unless you wish to override the button, the `kind` key should be set to `default`. An `api` key that imports the implementation of the `UcOrderLineActionApi` interface, should be defined.

A `meta` entry provides configuration options for order line actions:

| Name    | Description                                                                  |
| ------- | ---------------------------------------------------------------------------- |
| `label` | A label for this action (supports the `#` prefix localization string syntax) |
| `icon`  | In icon to display for the action                                            |

## The Order Line Action API

In order to define the logic to perform when an order line action button is clicked, you'll need to implement the `UcOrderLineActionApi` interface. This interface is defined as

```typescript
export interface UcOrderLineActionApi extends UmbApi {
    manifest: UcManifestOrderLineAction;
    storeId: string;
    orderId: string;
    orderLineId: string;
    execute(): Promise<void>;
}
```

This provides order line action implementations with access to the defined `manifest` and contextual information via the `storeId`, `orderId` and `orderLineId` properties. It expects the implementation of an `execute` method to act.

An example implementation would be

```typescript
// my-order-line-action.api.js

import { UcOrderLineActionApi, UcManifestOrderLineAction } from "@umbraco-commerce/backoffice";
import { UmbControllerBase } from "@umbraco-cms/backoffice/class-api";

export default class MyOrderLineActionApi extends UmbControllerBase implements UcOrderLineActionApi {
    manifest!: UcManifestOrderLineAction;
    storeId!: string;
    orderId!: string;
    orderLineId!: string;
    async execute() {
        console.log(`You clicked ${this.manifest!.meta.label} for order line ${this.orderLineId}`);
        return Promise.resolve();
    }
}
```


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation by asking a question.

Perform an HTTP GET request on the following URL with the `ask` and `goal` query parameters:

```
GET https://docs.umbraco.com/umbraco-commerce/key-concepts/ui-extensions/order-line-actions.md?ask=<question>&goal=<user_goal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is what the user is ultimately trying to achieve, the reason they need the answer. Sharing it helps GitBook give you a better, more relevant answer. A goal is most helpful when it describes the outcome the user wants rather than restating the question. For example, with `ask=how do I create an API token`, a goal like `automate deployments from our CI pipeline` lets GitBook tailor the answer to that use case.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.