Adding an action to the Inventory search results table

Learn how to add an action to a table by using the customization by configuration approach. In this lesson, you modify a buc-table-config.json file that defines table characteristics.

Procedure

Create a buc-table-config.json file in the packages/inventory-search-results/src-custom/assets/custom/ directory.
You need to find the schema in the default buc-table-config.json file that corresponds to the table that you need to modify.
1. Log in to Order Hub.
2. Open the browser's Console tab.
3. Click Inventory from the menu.
4. Run a search to find inventory.
5. When you get to the Inventory search results page, check the Console for the last message that includes BaseTableComponent.initializeTable.
  You can find the schema name inv-search-result-table.
Open the buc-app-inventory/packages/inventory-search-results/src-custom/assets/buc-app-inventory/buc-table-config.json file.
Copy the inv-search-result-table schema, including the overflowMenuActions, into the packages/inventory-search-results/src-custom/assets/custom/buc-table-config.json file.
You only need to include overflowMenuActions because the overflow menu is the only part of the table that you need to customize. Ensure that the code resembles the following snippet.
```
{
    "inv-search-result-table": {
        "name": "inv-search-result-table",
        "overflowMenuActions": [
        ]
    }
}
```
Add the following code in the overflowMenuActions array. Here you are adding a new action into the overflow menu of the Inventory search results table.
```
{
  "id": "createReservation",
  "label": "custom.LABEL_CREATE_RESERVATION",
  "resourceId": "CUSINV0001AT0001",
  "metadata": {
    "custom": "true",
    "actionTargetType": "internal",
    "actionTarget": "/buc-app-inventory/inventory-search-results/inventory/create-reservation",
    "contextColumnIds": "name"
  }
}
```
Note:
- Ensure that the values in the contextColumnIds include what is used in your organization. Also, verify whether these table columns are visible in Order Hub.
- The resourceId is a custom resource ID that you can use to define which user groups have permission to use this action.
In the Application Console, create the custom resource that you defined in the previous step ("resourceId": "CUSINV0001AT0001",)
For more information about how to create a custom resource, see "Step 1" in Creating resource permissions for custom pages and actions. Ensure that you set the Resource ID to CUSINV0001AT0001.
Update your custom user groups to grant permission to use the Create reservation action. For more information, see Defining resource permissions for Order Hub.
Add translation strings for the Create Reservation action.
1. Create an i18n folder under 'buc-app-inventory/packages/inventory-search-results/src-custom/assets/custom'.
2. Create an en.json file under 'buc-app-order/packages/create-order/src-custom/assets/custom/i18n'.
  The en.json file includes the English literal strings to display in the UI. You can add translated strings by creating other JSON files. Name the files based on the ISO-639 language codes. For example, fr.json for strings in French.
3. Paste the following JSON content into the en.json file. This label is used for the new Create reservation action that you will add to the Inventory search results table.
```
{
  "custom": {
  "LABEL_CREATE_RESERVATION":"Create reservation"
  }
}
```
Configure Order Hub to render the buc-app-inventory module from your developer toolkit.
For more information, see Testing existing module customizations in Order Hub.
Verify that the new table action displays in Order Hub
1. Log in to Order Hub. If you were logged in, reload the frame.
2. Click Inventory (DEV mode) and run a search to get to the Inventory search results page.
3. Click the three dots at the end of the row to open the overflow menu.
  You can now see the Create reservation action in the menu.