Creating a custom Action

There are certain cases when built-in action types are not enough.

All you need to do is create your own action template and register it for the sylius_grid.

In this example, we will specify the action button's icon to be mail and its colour to be purple inside the template.

@App/Grid/Action/contactSupplier.html.twig

<div data-gb-custom-block data-tag="import" data-0='@SyliusUi/Macro/buttons.html.twig'></div>

<div data-gb-custom-block data-tag="set"></div>

{{ buttons.default(path, action.label, null, 'mail', 'purple') }}

Now configure the new action's template like below inconfig/packages/sylius_grid.yaml:

config/packages/sylius_grid.yaml
sylius_grid:
    templates:
        action:
            contactSupplier: "@App/Grid/Action/contactSupplier.html.twig"

From now on, you can use your new action type in the grid configuration!

Let's assume that you already have a route for contacting your suppliers, then you can configure the grid action:

config/packages/sylius_grid.yaml
sylius_grid:
    grids:
        app_admin_supplier:
            driver:
                name: doctrine/orm
                options:
                    class: App\Entity\Supplier
            actions:
                item:
                    contactSupplier:
                        type: contactSupplier
                        label: Contact Supplier
                        options:
                            link:
                                route: app_admin_contact_supplier
                                parameters:
                                    id: resource.id

Last updated