Actions

Views answer "what do I see." Actions answer "what can I do without opening the form." A defineAction is a single verb — Check In, Mark Paid, Assign Table, Send Reminders — that can surface as a row button, a card button, a bulk-bar button, or a view-header button.

By the end you'll know the 8 keys on ActionConfig, how mutation vs handler decides Cloud-safe vs self-hosted, and how to wire type, confirm, and fields so the button lands in the right place.

Visual outcome

All mutations run through the collection's beforeChange and afterChange hook pipeline, ensuring access checks and validation are never bypassed.

Action examples

1. Cloud-safe row action (declarative mutation)

Define a row action using a JSON mutation object:

import { defineAction } from "@dyrected/core";

export const checkInAction = defineAction({
  name: "checkIn",
  label: "Check In",
  icon: "UserCheck",
  type: "row",
  confirm: "Confirm guest check-in at the door?",
  mutation: { checkedIn: true, checkedInAt: "now()" },
});

The "now()" expression is evaluated on the server to an ISO timestamp. Declarative mutations are serializable, making them fully compatible with Dyrected Cloud and syncable across environments.

2. Row action with an input dialog

If an action requires user input (like selecting a seat or entering notes), declare fields to automatically generate an input modal:

import { defineAction, defineNumberField, defineTextField } from "@dyrected/core";

export const assignTableAction = defineAction({
  name: "assignTable",
  label: "Assign Table",
  icon: "Table2",
  type: "row",
  fields: [
    defineNumberField({ name: "tableNumber", label: "Table Number", required: true }),
    defineTextField({ name: "notes", label: "Seating Notes" }),
  ],
  mutation: { tableNumber: "input.tableNumber", seatingNotes: "input.notes" },
});

Expressions like "input.tableNumber" extract values submitted through the dialog.

3. Bulk and header actions

Define actions that operate across multiple selected documents or view-wide:

import { defineAction } from "@dyrected/core";

export const markSelectedPaidAction = defineAction({
  name: "markSelectedPaid",
  label: "Mark Paid",
  type: "bulk",
  mutation: { asoebiStatus: "paid", asoebiPaidAt: "now()" },
});

export const sendReminderAction = defineAction({
  name: "sendReminder",
  label: "Send Reminders",
  icon: "BellRing",
  type: "header",
  confirm: "Send a payment reminder to all guests with pending requests?",
  mutation: { remindedAt: "now()" },
});

Configuration options

Button placement and ordering

• Row actions (type: "row"): Surface on table rows, kanban cards, calendar detail sheets, and gallery card tiles.
• Bulk actions (type: "bulk"): Appear automatically in the floating bulk action bar when one or more items are selected.
• Header actions (type: "header"): Positioned at the top of the view alongside search and filter controls.

To customize the order and visibility of built-in vs custom buttons on a view:

defineView({
  slug: "attending-guests",
  label: "Attending Guests",
  actions: [checkInAction],
  features: { delete: false }, // Hides the built-in delete button
  actionOrder: ["checkIn", "view", "edit"], // Places custom Check In first
});

Next steps

• Run actions programmatically from code — Run an action (SDK)
• Secure actions with role permissions — Access Control
• Configure view layouts — Define a view