4410: Hacked display of theme categories

Author: rimi-itk

assets/styles/app.css

@@ -288,3 +288,20 @@ th.rotate {
     }
   }
 }
+
+/* Help our theme.themeCategories table stuff fall into place visually (cf. template/admin/form.html.twig) */
+#form-theme-themeCategories {
+  td {
+    vertical-align: top;
+  }
+
+  tr.field-collection-item {
+    display: table-row;
+
+    .field-collection-delete-button {
+      inset-block-start: initial;
+      inset-inline-end: initial;
+      position: initial;
+    }
+  }
+}

src/Controller/Admin/ThemeCrudController.php

@@ -18,6 +18,14 @@ public static function getEntityFqcn(): string
         return Theme::class;
     }
 
+    #[\Override]
+    public function configureCrud(Crud $crud): Crud
+    {
+        return $crud
+            // https://symfony.com/bundles/EasyAdminBundle/current/design.html#form-field-templates
+            ->addFormTheme('admin/form.html.twig');
+    }
+
     /**
      * @throws \Exception
      */

templates/admin/form.html.twig

@@ -0,0 +1,65 @@
+{# @see https://symfony.com/bundles/EasyAdminBundle/current/design.html#form-field-templates #}
+{% block _Theme_themeCategories_widget %}
+    {% set id = 'form-theme-themeCategories' %}
+    <table class="table table-striped" id="{{ id }}">
+      <thead>
+        <th>{{ 'theme.form.sort_order'|trans }}</th>
+        <th>{{ 'theme.form.category'|trans }}</th>
+        <th></th>
+      </thead>
+      <tbody class="ea-form-collection-items field-array">
+        {{ block('_Theme_themeCategories_collection_widget') }}
+      </tbody>
+    </table>
+    {# Pretend that the collection is an array collection to make "add item" not assume that we have an accordion, cf. vendor/easycorp/easyadmin-bundle/assets/js/field-collection.js #}
+    <script>
+      const el = document.getElementById({{ id|json_encode|raw }}).closest('[data-ea-collection-field]');
+      if (el) {
+        el.classList.add('field-array')
+      }
+    </script>
+
+    {% if allow_add|default(false) and not disabled %}
+      <button type="button" class="btn btn-link field-collection-add-button">
+        <twig:ea:Icon name="internal:plus" class="pr-1" />
+        {{ 'theme.form.add_new_item'|trans }}
+      </button>
+    {% endif %}
+{% endblock %}
+
+{% block _Theme_themeCategories_collection_widget %}
+  {% set isEmptyCollection = value is null or (value is iterable and value is empty) %}
+
+  {% if isEmptyCollection %}
+    {{ block('_Theme_themeCategories_empty_collection') }}
+  {% else %}
+    {{ block('form_widget') }}
+  {% endif %}
+{% endblock %}
+
+{% block _Theme_themeCategories_empty_collection %}
+  <tr>
+    <td colspan="3">
+      {{ 'No theme categories'|trans }}
+    </td>
+  </tr>
+{% endblock %}
+
+{% block _Theme_themeCategories_entry_row %}
+  {# See block collection_entry_row in @EasyAdmin:crud/form_theme.html.twig  for details on which bits and pieces are used to stitch this together #}
+  <tr class="field-collection-item">
+    <td>
+      {{ form_widget(form.sortOrder) }}
+      {{ form_errors(form.sortOrder) }}
+    </td>
+    <td>
+      {{ form_widget(form.category) }}
+      {{ form_errors(form.category) }}
+    </td>
+    <td>
+      <button type="button" class="btn btn-danger field-collection-delete-button">
+        {{ 'theme.form.delete_item'|trans }}
+      </button>
+    </td>
+  </tr>
+{% endblock %}

translations/messages.da.yml

@@ -29,6 +29,8 @@ theme:
         theme_categories: Kategorier
         sort_order: Sortering
         category: Kategori
+        delete_item: Fjern
+        add_new_item: Tilføj
 
 filter:
     submit: Søg