CEXT-6410: Migrate order / custom-mass-action to Admin UI V2

admin-ui-sdk/README.md

@@ -1,31 +1,40 @@
 # Admin UI SDK Samples
 
-This directory contains samples for different extension points of the Adobe Commerce Admin UI SDK.
+This directory contains samples for different extension points of the Adobe Commerce Admin UI SDK, organised into two versioned folders.
 
-## Overview
+## Versions
 
-The Adobe Commerce Admin UI SDK allows developers to extend the Commerce Admin to include custom menus, pages, and other features. 
-These examples demonstrate how to use the SDK to create these extensions.
+### V2 (recommended)
 
-## Directory Structure
+Located in `v2/`. These samples are built on [App Management](https://developer.adobe.com/commerce/extensibility/app-management/), the new foundation for Admin UI SDK extensions. **Start here for all new development.**
 
-- `menu`: Contains samples of how to create custom menus in the Commerce Admin.
-- `order`: Contains samples of how to create 
-  - `order view button`: custom order view button in the Commerce Admin.
-  - `order grid columns`: custom columns in the order grid in the Commerce Admin.
-  - `order mass action`: custom mass action in the order grid in the Commerce Admin.
-- `product`: Contains examples of how to create 
-  - `product grid columns`: custom columns in the product grid in the Commerce Admin.
-  - `product mass action`: custom mass action in the product grid in the Commerce Admin.
+### V1 (deprecated)
 
-## Installation
+Located in `v1/`. These samples use the previous scaffolding approach and the `commerce/backend-ui/1` extension point. V1 is deprecated and will be removed in a future release.
+
+## Sample comparison: V1 → V2
 
-Each sample has its own README file with specific installation instructions. Please refer to the README file in the respective sample directory for more information.
+| V1 sample | V2 sample | Notes |
+|---|---|---|
+| `banner-notification/custom-mass-actions` | — | Removed as a standalone sample — the notification config is embedded directly in `order/custom-mass-action` and `product/custom-mass-action`. In V2, notifications are declared inline on each mass action as `notifications.success` / `notifications.error`. |
+| `banner-notification/custom-order-view-button` | — | Removed as a standalone sample — the notification config is embedded directly in `order/custom-view-button`. In V2, notifications are part of the view button config. |
+| `customer/custom-grid-columns` | `customer/custom-grid-columns` | V1 fetches column data via API Mesh (`data.meshId`). V2 calls a `runtimeAction` instead. |
+| `customer/custom-mass-action` | `customer/custom-mass-action` | `displayIframe` boolean replaced by explicit `type: "view" \| "worker"`. `actionId` renamed to `id`. `sandbox` string replaced by `sandboxPermissions` array. |
+| `menu/custom-menu` | `menu/custom-menu` | V1 registers an array of items (including section items). V2 declares a single `menu` object; section is auto-generated. `title` renamed to `label`. `sortOrder` dropped. New required `description` field. |
+| `menu/custom-menu-no-react` | — | Not applicable in V2. App Management always generates a `web-src` (App Builder frontend). A vanilla/no-framework variant is not supported. |
+| `order/custom-fees` | — | Custom fees are not an Admin UI SDK V2 extension point. In V2 they are implemented as a webhook on `plugin.magento.out_of_process_totals_collector.api.get_total_modifications.custom_fees`. See [Checkout Totals Collector](https://developer.adobe.com/commerce/extensibility/starter-kit/checkout/totals-collector-fees). |
+| `order/custom-grid-columns` | `order/custom-grid-columns` | Same as `customer/custom-grid-columns` — API Mesh replaced by `runtimeAction`. |
+| `order/custom-mass-action` | `order/custom-mass-action` | Same changes as `customer/custom-mass-action`. |
+| `order/custom-view-button` | `order/custom-view-button` | `buttonId` renamed to `id`. `displayIframe` replaced by `type: "view" \| "worker"`. New optional `description` field. |
+| `product/custom-grid-columns` | `product/custom-grid-columns` | Same as `customer/custom-grid-columns` — API Mesh replaced by `runtimeAction`. |
+| `product/custom-mass-action` | `product/custom-mass-action` | Same changes as `customer/custom-mass-action`. |
 
-## Usage
+## Installation
 
-After installing a sample, you can access the custom features from the Commerce Admin panel.
+Each sample has its own README with specific installation and configuration instructions.
 
-## More Information 
+## More Information
 
-To learn more about the Admin UI SDK visit the [Developer docs](https://developer.adobe.com/commerce/extensibility/admin-ui-sdk/).
+- [Admin UI SDK developer docs](https://developer.adobe.com/commerce/extensibility/admin-ui-sdk/)
+- [App Management](https://developer.adobe.com/commerce/extensibility/app-management/)
+- [Checkout Totals Collector (custom fees in V2)](https://developer.adobe.com/commerce/extensibility/starter-kit/checkout/totals-collector-fees)

admin-ui-sdk/order/custom-mass-action/src/commerce-backend-ui-1/actions/registration/index.js → admin-ui-sdk/v1/order/custom-mass-action/src/commerce-backend-ui-1/actions/registration/index.js

@@ -42,6 +42,17 @@ async function main() {
                             displayIframe: false
                         }
                     ]
+                },
+                bannerNotification: {
+                    massActions: {
+                        order: [
+                            {
+                                actionId: `${extensionId}::mass-action-with-redirect`,
+                                successMessage: 'Order custom success message',
+                                errorMessage: 'Order custom error message'
+                            }
+                        ]
+                    }
                 }
             }
         }

admin-ui-sdk/v2/order/custom-mass-action/.gitignore

@@ -0,0 +1,22 @@
+# package directories
+node_modules
+
+# build
+build
+dist
+.manifest-dist.yml
+
+# Config
+config.json
+.env*
+!.env.dist
+.aio
+
+# Adobe I/O console config
+console.json
+
+.idea
+.aws.tmp.creds.json
+.parcel-cache
+.DS_Store
+.vscode

admin-ui-sdk/v2/order/custom-mass-action/README.md

@@ -0,0 +1,65 @@
+# Order Mass Action — Admin UI SDK V2
+
+Adds custom mass actions to the order grid in the Adobe Commerce Admin panel.
+
+When a merchant selects one or more orders and picks one of these actions from the mass actions dropdown, Commerce Admin either opens an iframe backed by your App Builder frontend (`view` actions), or calls a backend runtime action directly with no UI (`worker` actions).
+
+## What you get
+
+Three sample mass actions:
+
+| Action | Type | Behavior |
+|---|---|---|
+| Order Mass Action | `view` | Opens an iframe listing the selected order IDs |
+| Mass Action With Redirect | `view` | Opens an iframe showing the selected order IDs in a combobox; on "Done" it closes and shows a success/error banner notification |
+| Mass Action No iFrame | `worker` | Runs `mass-actions/massAction` as a backend runtime action — no UI is shown |
+
+The mass action definitions live in `app.commerce.config.ts`. The iframe UI lives in `src/commerce-backend-ui-2/web-src/`. The worker action logic lives in `src/commerce-backend-ui-2/actions/massAction/index.js`.
+
+## How it works
+
+1. Merchant selects one or more orders in the order grid and picks a mass action from the dropdown
+2. For `view` actions, Commerce Admin opens the configured `path` inside an iframe backed by your App Builder web app; the app reads the selected IDs via the Admin UI SDK guest connection (`sharedContext.get('selectedIds')`)
+3. For `worker` actions, Commerce Admin calls the configured `runtimeAction` directly with the selected IDs — no iframe is shown
+4. If the action declares `notifications`, Commerce Admin shows a success or error banner once the action completes
+
+## Prerequisites
+
+- [Node.js](https://nodejs.org/) >= 24
+- [Adobe I/O CLI](https://developer.adobe.com/runtime/docs/guides/tools/cli_install/) (`npm install -g @adobe/aio-cli`)
+- An App Builder project on [Adobe Developer Console](https://developer.adobe.com/console/) with a workspace configured for your Commerce instance
+- Adobe Commerce >= 2.4.7 with the [Admin UI SDK module](https://developer.adobe.com/commerce/extensibility/admin-ui-sdk/) installed and enabled
+
+## Setup
+
+**1. Install dependencies**
+
+```bash
+npm install
+```
+
+**2. Connect to your App Builder workspace**
+
+```bash
+aio console org select
+aio console project select
+aio console workspace select
+aio app use -g --no-input --overwrite
+```
+
+**3. Deploy**
+
+```bash
+aio app deploy
+```
+
+**4. Associate and install on Commerce**
+
+Associate and install the app with your Commerce instance through the App Management UI in the Commerce Admin. See [App Management](https://developer.adobe.com/commerce/extensibility/app-management/) for the full walkthrough.
+
+To verify the installation, navigate to **Stores → Configuration → Adobe Services → Admin UI SDK → Configure Extensions** and check the **Installed Extensions** tab — the app should appear there once successfully installed.
+
+## More information
+
+- [Admin UI SDK — Order Mass Action](https://developer.adobe.com/commerce/extensibility/admin-ui-sdk/extension-points/order/mass-action/)
+- [App Management](https://developer.adobe.com/commerce/extensibility/app-management/)

admin-ui-sdk/v2/order/custom-mass-action/app.commerce.config.ts

@@ -0,0 +1,56 @@
+/*
+ * Copyright 2026 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */
+
+import { defineConfig } from '@adobe/aio-commerce-lib-app/config'
+
+export default defineConfig({
+  metadata: {
+    id: 'order-custom-mass-action',
+    displayName: 'Adobe Commerce order grid custom mass action',
+    version: '1.0.0',
+    description: 'Adobe Commerce order grid custom mass action in admin panel',
+  },
+  adminUi: {
+    order: {
+      massActions: [
+        {
+          id: 'order-custom-mass-action::order-mass-action',
+          label: 'Order Mass Action',
+          type: 'view',
+          path: '#/order-mass-action',
+          confirm: {
+            title: 'Mass Action',
+            message: 'Are you sure your want to proceed with Mass Action on selected orders?',
+          },
+          selectionLimit: 1,
+        },
+        {
+          id: 'order-custom-mass-action::mass-action-with-redirect',
+          label: 'Mass Action With Redirect',
+          title: 'Order Mass Action With Redirect',
+          type: 'view',
+          path: '#/mass-action-with-redirect',
+          notifications: {
+            success: 'Order custom success message',
+            error: 'Order custom error message',
+          },
+        },
+        {
+          id: 'order-custom-mass-action::mass-action-no-iFrame',
+          label: 'Mass Action No iFrame',
+          type: 'worker',
+          runtimeAction: 'mass-actions/massAction',
+        },
+      ],
+    },
+  },
+})

admin-ui-sdk/v2/order/custom-mass-action/app.config.yaml

@@ -0,0 +1,5 @@
+extensions:
+  commerce/backend-ui/2:
+    $include: src/commerce-backend-ui-2/ext.config.yaml
+  commerce/extensibility/1:
+    $include: src/commerce-extensibility-1/ext.config.yaml

admin-ui-sdk/v2/order/custom-mass-action/extension-manifest.json

@@ -0,0 +1,8 @@
+{
+  "name": "order-custom-mass-action",
+  "displayName": "Adobe Commerce order grid custom mass action",
+  "description": "Adobe Commerce order grid custom mass action in admin panel",
+  "platform": "web",
+  "id": "order-custom-mass-action",
+  "version": "1.0.0"
+}

admin-ui-sdk/v2/order/custom-mass-action/install.yaml

@@ -0,0 +1,10 @@
+$schema: http://json-schema.org/draft-07/schema
+$id: https://adobe.io/schemas/app-builder-templates/1
+
+categories:
+  - action
+  - ui
+
+extensions:
+  - extensionPointId: commerce/extensibility/1
+  - extensionPointId: commerce/backend-ui/2