Actions

Pass actions and one actionExecutor:

• scope: 'global' renders in the toolbar and receives {sourceId}.
• A normal scope: 'record' action renders in the row action menu and receives {sourceId, record}. With presentation: 'checkbox', it renders directly in the row.
• scope: 'selection' renders in the toolbar only when selectable is enabled and rows are selected.

const actions: DyonaAction[] = [
  {id: 'refresh', label: 'Refresh balances', scope: 'global'},
  {id: 'view-entry', label: 'View entry', scope: 'record'},
  {id: 'change-status', label: 'Change selected status', scope: 'selection'},
];

A selection action receives context.selection:

{
  sourceId: 'current-account-invoices',
  selection: {
    ids: ['FAC-00481', 'FAC-00482'],
    records: [{id: 'FAC-00481', status: 'pending'}],
  },
}

ids includes all selected IDs, including remote pages that are not currently loaded. records includes only selected records available in the Grid cache, so it is not required to match ids one-to-one.

While an action runs, Grid actions are blocked and the active direct action shows a spinner. onActionResult(result, action, record?) receives completed results; onActionError(error, action, record?) receives executor or runtime errors.

Direct checkbox record actions

Use presentation: 'checkbox' when a record action represents state that should remain visible in every row:

const actions: DyonaAction[] = [
  {
    id: 'toggle-reviewed',
    label: 'Reviewed',
    scope: 'record',
    presentation: 'checkbox',
    checkedField: 'reviewed',
    checkedValue: 'S',
    uncheckedValue: 'N',
  },
];

The checkbox is checked when Object.is(record[checkedField], checkedValue). checkedValue and uncheckedValue are optional and default to true and false, respectively. Custom values such as S / N are supported.

The executor receives the original record and the requested next state through context.parameters:

const actionExecutor: DyonaActionExecutor = async ({context}) => {
  const field = context.parameters?.field;
  const value = context.parameters?.value;
  const checked = context.parameters?.checked;

  if (!context.record || field !== 'reviewed' || typeof checked !== 'boolean') {
    return {success: false};
  }

  return {
    success: true,
    data: {rowPatch: {reviewed: value}},
  };
};

This presentation is independent from row selection: selectable is not required and no header checkbox is created. While it executes, it uses the existing running-action feedback. Record actions without presentation: 'checkbox' remain in MoreVert; checkbox actions are not duplicated there.

Try direct checkbox actions in the Lab

Try it live in the Lab