# Updated DataTable Actions Behavior Test

## ✅ New Action Behavior Summary

### Action Type Changes:

- Global Actions: Default behavior - always available above table
- Single Selection Actions (requiresSelection: true): Above table, enabled only when exactly one row selected
- Row Actions (rowAction: true): In actions column, available per row
- Bulk Actions (requiresMultipleSelection: true): Above table when rows selected

### Updated Action Types Matrix:

Action Type | Property | Location | Enabled When | Data Received
--- | --- | --- | --- | ---
Global | None (default) | Above table | Always | None
Single Selection | requiresSelection: true | Above table | Exactly 1 row selected | Selected row object
Row Action | rowAction: true | Actions column | Always (per row) | Individual row object
Bulk | requiresMultipleSelection: true | Above table (when selected) | 1+ rows selected | Array of selected rows

### Implementation Changes Made:

1. Computed Properties Updated:
   - globalActions: Actions with no special properties
   - singleSelectionActions: Actions with requiresSelection: true
   - rowActions: Actions with rowAction: true
   - bulkActions: Actions with requiresMultipleSelection: true
2. Template Updates:
   - Global Actions section now includes single selection actions
   - Single selection actions are disabled unless exactly one row is selected
   - Visual feedback shows selection state
   - Actions column only shows rowAction: true actions
3. New Handler Added:
   - handleSingleSelectionAction: Passes selected row data to action

### Example Configuration (Clients.vue):

    const tableActions = [
      // Global action - always available
      {
        label: "Add Client",
        action: () => modalStore.openModal("createClient"),
        icon: "pi pi-plus",
        style: "primary"
      },
      // Single selection action - enabled when exactly one row selected
      {
        label: "View Details",
        action: (rowData) => router.push(`/clients/${rowData.id}`),
        icon: "pi pi-eye",
        style: "info",
        requiresSelection: true
      },
      // Bulk action - enabled when rows selected
      {
        label: "Export Selected",
        action: (selectedRows) => exportData(selectedRows),
        icon: "pi pi-download",
        style: "success",
        requiresMultipleSelection: true
      },
      // Row actions - appear in each row
      {
        label: "Edit",
        action: (rowData) => editClient(rowData),
        icon: "pi pi-pencil",
        style: "secondary",
        rowAction: true
      },
      {
        label: "Quick View",
        action: (rowData) => showPreview(rowData),
        icon: "pi pi-search",
        style: "info",
        rowAction: true
      }
    ];

### User Experience Improvements:

- Clearer Action Organization: Actions are logically grouped by their purpose
- Better Visual Feedback: Users see why certain actions are disabled
- More Flexible Layout: Actions can be placed where they make most sense
- Reduced Clutter: Row actions only show contextual actions for that specific row
- Intuitive Behavior: Single selection actions work like "View Details" - need one item selected

### Action Flow Examples:

- Adding New Item: Global action → Always available → No data needed
- Viewing Item Details: Single selection action → Select one row → View details of selected item
- Editing Item: Row action → Click edit in specific row → Edit that item
- Bulk Operations: Bulk action → Select multiple rows → Operate on all selected

## ✅ Testing Checklist

- [ ] Global actions are always enabled and visible above table
- [ ] Single selection actions are disabled when no rows selected
- [ ] Single selection actions are disabled when multiple rows selected
- [ ] Single selection actions are enabled when exactly one row is selected
- [ ] Single selection actions receive correct row data
- [ ] Row actions appear in each row's actions column
- [ ] Row actions receive correct individual row data
- [ ] Bulk actions appear when rows are selected
- [ ] Bulk actions receive array of selected row data
- [ ] Visual feedback shows selection state appropriately