init-grid-extensionslisted

Enable JavaScript grid extensions for a listing page. Extensions add sorting, filtering, bulk actions, column toggling, position reordering, and other interactive behaviors to the grid. Trigger: "add grid extensions for {Domain}", "enable grid extensions for {Domain}", "initialize grid JS for {Domain}".
jeffsenso/prestashop-skills · ★ 4 · AI & Automation · score 76

Install: claude install-skill jeffsenso/prestashop-skills

# init-grid-extensions Read `@.ai/Component/Javascript/CONTEXT.md` for the grid component and extension system. ## Basic pattern In the listing entry point (`index.ts`): ```typescript const grid = new window.prestashop.component.Grid('{domain}'); grid.addExtension(new window.prestashop.component.GridExtensions.SortingExtension()); grid.addExtension(new window.prestashop.component.GridExtensions.FiltersResetExtension()); grid.addExtension(new window.prestashop.component.GridExtensions.SubmitRowActionExtension()); grid.addExtension(new window.prestashop.component.GridExtensions.SubmitBulkActionExtension()); grid.addExtension(new window.prestashop.component.GridExtensions.BulkActionCheckboxExtension()); grid.addExtension(new window.prestashop.component.GridExtensions.ColumnTogglingExtension()); ``` The grid ID must match the `GRID_ID` const from the PHP grid definition factory. ## Available extensions ### Core extensions (most grids need these) | Extension | Purpose | |---|---| | `SortingExtension` | Clickable column headers for sorting | | `FiltersResetExtension` | Reset button for grid filters | | `FiltersSubmitButtonEnablerExtension` | Enable/disable filter submit button | | `BulkActionCheckboxExtension` | Select-all and per-row checkboxes | | `SubmitBulkActionExtension` | Submit bulk action form (enable/disable/delete) | | `SubmitRowActionExtension` | Handle row action link clicks | | `LinkRowActionExtension` | Navigate to row action URLs | | `ColumnTogglingExtensio