Sylius Grid Bundle : maitriser les listes et grilles de l'admin

Le Grid Bundle est le compagnon du Resource Bundle. Il genere les listes admin avec filtres, tri et pagination. Maitriser sa configuration vous permet de creer des interfaces d'administration puissantes sans ecrire de code frontend.

Configuration d'une grille

# config/packages/grids/app_admin_faq_item.yaml
sylius_grid:
  grids:
    app_admin_faq_item:
      driver:
        name: doctrine/orm
        options:
          class: App\Entity\FaqItem
      sorting:
        position: asc
      fields:
        position:
          type: string
          label: Position
          sortable: ~
        question:
          type: string
          label: Question
          sortable: ~
        enabled:
          type: twig
          label: Actif
          options:
            template: "@SyliusUi/Grid/Field/enabled.html.twig"
        createdAt:
          type: datetime
          label: Date creation
          sortable: ~
      filters:
        search:
          type: string
          label: Recherche
          options:
            fields: [question, answer]
        enabled:
          type: boolean
          label: Actif
      actions:
        main:
          create:
            type: create
        item:
          update:
            type: update
          delete:
            type: delete

Types de colonnes disponibles

Type	Usage	Options
string	Texte simple	-
datetime	Date formatee	format
twig	Template Twig custom	template, vars
enabled	Badge vert/rouge	-

Colonne Twig personnalisee

fields:
  totalAmount:
    type: twig
    label: Montant
    sortable: ~
    options:
      template: "admin/grid/field/_amount.html.twig"

{# templates/admin/grid/field/_amount.html.twig #}
<span class="fw-bold {{ data > 10000 ? 'text-success' : '' }}">
  {{ data|sylius_format_money(resource.currencyCode) }}
</span>

Filtres avances

Filtre par relation (entite)

filters:
  category:
    type: entity
    label: Categorie
    options:
      class: App\Entity\Category
      fields: [category]

Filtre par date

filters:
  createdAt:
    type: date
    label: Date creation
    options:
      field: createdAt

Actions personnalisees

actions:
  item:
    update:
      type: update
    preview:
      type: default
      label: Voir
      icon: eye
      options:
        link:
          route: app_shop_faq_show
          parameters:
            slug: resource.slug
    duplicate:
      type: default
      label: Dupliquer
      icon: copy
      options:
        link:
          route: app_admin_faq_duplicate
          parameters:
            id: resource.id

Jointures et performance

sylius_grid:
  grids:
    app_admin_order:
      driver:
        options:
          class: App\Entity\Order\Order
          repository:
            method: createListQueryBuilder
            arguments: ["%locale%"]

En definissant un QueryBuilder custom, vous controlez les jointures et evitez les requetes N+1 :

public function createListQueryBuilder(string $locale): QueryBuilder
{
    return $this->createQueryBuilder('o')
        ->leftJoin('o.customer', 'c')
        ->addSelect('c')
        ->leftJoin('o.items', 'i')
        ->addSelect('i');
}

Bonnes pratiques

• Un fichier YAML par grille pour la lisibilite
• Toujours definir un tri par defaut coherent
• Limiter les colonnes : 5-7 colonnes max, utilisez les filtres pour le reste
• Optimiser les jointures dans le repository pour les grilles avec beaucoup de donnees
• Tester les filtres : verifiez qu'ils fonctionnent avec des jeux de donnees realistes

Le Grid Bundle et le Resource Bundle forment le duo central de l'admin Sylius. Les maitriser, c'est pouvoir creer des back-offices complets en quelques heures.