Adding a global action in EasyAdmin, place my button underneath the table instead of above

Question

I created a global Action :

public function export(
        Admin $user,
        StructureRepository $structureRepository,
        ExportCsvEntity $exportCsvEntity,
        string $entityClass
    ): HttpFoundationResponse {
        $zipcodes = $structureRepository->getZipcodesByStructureFromAdmin($user->getId());

        $exportCsvEntity->export(
            $zipcodes,
            $entityClass
        );

        return $exportCsvEntity->download($entityClass);
    }

    public function exportButton(): Action
    {
        return Action::new('export', 'admin.crud.user.field.activities_tracking.button.export')
            ->linkToCrudAction('export')
            ->displayAsLink()
            ->setCssClass('btn btn-primary')
            ->createAsGlobalAction()
        ;
    }

Then in my Crud Controller I call it :

if ($this->getUser() instanceof Admin) {
            $export = $this->exportAction->exportButton();

            $actions->add(Crud::PAGE_INDEX, $export);
          
        }

In the doc its written => Global actions are displayed above the listed entries. But in my case the button is underneath the table Have a look here

My template is extending '@!EasyAdmin/crud/index.html.twig'then I override the global_actions block :

{% block global_actions %}
     {{ parent() }}
{% endblock global_actions %}

Now my button is above the table but also underneath : Have a look here

What do I do wrong ?

Dylan KAS · Accepted Answer · 2023-01-18T13:48:52.343

You are correct when trying to do this by overriding the index template.

An easy way to do this considering how the template is organized is to modify the global_actions block by filtering actions you do not want to show above the list. For example by using a css class to not show a global action above the list.

{% block global_actions %}
    <div class="global-actions">
        {% for action in global_actions|filter(a => 'under-list' not in a.cssClass) %}
            {{ include(action.templatePath, { action: action }, with_context = false) }}
        {% endfor %}
    </div>
{% endblock global_actions %}

And in your crud controller:

Action::new('customAction', $label, $icon)
    ->addCssClass('under-list')
    ->createAsGlobalAction()
    ->linkToCrudAction('customAction');

And you need to add your new list of actions under your list by overriding the main block.

{% block main %}
    {{ parent() }}
    {% block under_list_global_actions %}
        <div class="under-list-global-actions">
            {% for action in global_actions|filter(a => 'under-list' in a.cssClass) %}
                {{ include(action.templatePath, { action: action }, with_context = false) }}
            {% endfor %}
        </div>
    {% endblock under_list_global_actions %}
{% endblock main %}

And you should get your custom global action (with the css class under-list) under your list.

Adding a global action in EasyAdmin, place my button underneath the table instead of above

1 Answers1