Views - lists - Add inline actions on individual items

[cedricfrancoys]

Adding Inline Actions to List Views

To enhance the functionality of list views in your application, you can add inline actions to each row. These actions will be placed in the last column of the rows, similar to how actions are configured in forms. Below, we detail the steps and considerations for implementing inline actions in list views.

Structure of Inline Actions

• Action Placement: Actions are added in the last column of each row in the list view.
• Action Appearance: Only the icon of the action is displayed in the list. The actions appear in the order they are defined.
• Visibility Filter: It's possible to apply a visibility filter to actions, allowing you to control which actions are displayed based on certain conditions.
• Limiting Action Display: You can limit the number of actions directly visible. If the number of actions exceeds this limit, a vertical ellipsis ... button appears, allowing users to view additional actions.

Action Execution

• Confirmation and Parameters: If required by the associated controller, a popup will appear either to confirm the action or to fill in required parameters before the action can be executed.
• Progress Indicator: During the execution of an action, an infinite spinner is displayed as a progress indicator.
• List Refresh: Once an action has been executed, the list is automatically refreshed to reflect any changes.

Implementation Guidelines

1. Define Action Icons: Ensure that each action has a corresponding icon that clearly represents its function.
2. Configure Action Column: Modify the list view layout to include a new column dedicated to actions.
3. Implement Visibility Filters: Define visibility filters for actions to manage their display based on the row data.
4. Handle Overflows: Implement a mechanism to handle action overflow, such as a dropdown menu, triggered by a vertical ellipsis button.
5. Integrate Confirmation Popups: If necessary, integrate popups that require user confirmation or additional input before proceeding with an action.
6. Incorporate Progress Indicators: Add a progress indicator, such as an infinite spinner, to provide feedback during action execution.
7. Refresh Mechanism: Ensure the list can be refreshed seamlessly post-action execution to maintain data integrity and user experience.