Actions JSON configuration
How to structure JSON for actions column in Datatable.
🧩 Actions JSON Configuration
Actions in Lens tables allow users to perform context-specific operations like viewing, editing, or deleting a row. The actions
configuration is a JSON object that defines a list of available actions, each rendered as a button, icon, or dropdown menu within the table's actions column.
These actions are passed as a property to the table view JSON under the key actions
.
✍️ Structure Overview
The JSON structure of actions looks like this:
⚙️ Configuration Details
items: ActionItem[]
An array of individual action definitions. Each item describes one CTA in the table.
🔑 key
(required)
A unique identifier for the action. Used internally.
🏷️ label
(optional)
The display name of the action button or option in the dropdown.
🔗 url
(optional but usually required)
Defines the endpoint or route to call when the action is triggered.
- You can use dynamic placeholders such as
:id
,:state
, or nested ones like:city.locality.id
. - These will be auto-replaced based on the row data.
🖼️ icon
(optional)
Name of the icon to render with the action.
Only three icons are officially supported out of the box:
"SquarePen"
"EyeIcon"
"Trash2"
Frontends may override these with custom icon sets if needed.
📑 options
(optional)
An array of sub-actions shown in a dropdown when this action is clicked. Useful for related operations under a single action button.
⚠️ confirmation
(optional)
When set to "true"
, the action will prompt the user for confirmation before proceeding. Ideal for destructive actions like delete.
📬 method
(optional)
Defines how the action should be triggered.
"HREF"
(default) → Navigates the user using React router"POST"
,"GET"
, etc. → Sends an HTTP request to the specified URL with method and row data
If method
is omitted, the default is treated as "HREF"
.
✅ Example Use in a View
To include actions in your view configuration:
🧩 Summary Table
Field | Type | Description |
---|---|---|
key | string | Unique identifier |
label | string | Display label for button or dropdown option |
url | string | Target route or endpoint (with dynamic :key support) |
icon | string | One of "SquarePen" , "EyeIcon" , "Trash2" |
options | array | Optional sub-actions shown in a popup |
confirmation | string | If "true" , prompts before proceeding (used for destructive actions) |
method | string | Either "HREF" for routing, or HTTP verbs like "POST" /"GET" for fetch |
📌 Notes
- You can add custom actions to extend system behavior without changing the frontend logic.
- Nested properties like
:city.locality.id
are supported via dot notation for deep data access. - Omitting required fields like
key
orurl
may result in runtime errors or non-functional actions.