feat: integrate with htmx

templates/admin/system/contact/_form.html.twig

@@ -1,4 +1,4 @@
-{{ form_start(form) }}
+{{ form_start(form, { 'attr': { 'hx-post': app.request.uri, 'hx-target': '#htmx-modal', 'hx-swap': 'outerHTML' } }) }}
 <div class="flex flex-col space-y-4 pb-4">
     {{ form_row(form.name) }}
     {{ form_row(form.email) }}

templates/admin/system/contact/create.html.twig

@@ -1 +0,0 @@
-{% include 'admin/system/contact/_form.html.twig' %}

templates/admin/system/contact/edit.html.twig

@@ -1 +0,0 @@
-{% include 'admin/system/contact/_form.html.twig' %}

templates/admin/system/contact/index.html.twig

@@ -39,20 +39,17 @@
                             <div class="flex items-center space-x-2 justify-end">
                                 <button type="button"
                                         class="text-red-500"
-                                        {{ stimulus_controller('modal-button', [], [], {'confirmation-modal': '#confirmation-modal'}) }}
-                                        {{ stimulus_action('modal-button', 'confirmation', null, {
-                                            'title': 'Bist du sicher?',
-                                            'content': 'Möchtest du die Ansprechperson wirklich löschen?',
-                                            'target-url': path('app_admin_system_contact_delete', { 'id': contact.id })
-                                        }) }}>
+                                        title="Ansprechperson löschen"
+                                        hx-get="{{ path('app_admin_system_contact_delete', { 'id': contact.id }) }}"
+                                        hx-target="body"
+                                        hx-swap="beforeend">
                                     {{ icon('delete') }}
                                 </button>
                                 <button type="button"
-                                        {{ stimulus_controller('modal-button', [], [], {'ajax-modal': '#ajax-modal'}) }}
-                                        {{ stimulus_action('modal-button', 'ajax', null, {
-                                            'title': 'Ansprechperson bearbeiten',
-                                            'url': path('app_admin_system_contact_edit', { 'id': contact.id })
-                                        }) }}>
+                                        title="Ansprechperson bearbeiten"
+                                        hx-get="{{ path('app_admin_system_contact_edit', { 'id': contact.id }) }}"
+                                        hx-target="body"
+                                        hx-swap="beforeend">
                                     {{ icon('edit') }}
                                 </button>
                             </div>
@@ -71,11 +68,10 @@
     </div>
     <button type="button"
             class="btn"
-            {{ stimulus_controller('modal-button', [], [], {'ajax-modal': '#ajax-modal'}) }}
-            {{ stimulus_action('modal-button', 'ajax', null, {
-                'title': 'Ansprechperson hinzufügen',
-                'url': path('app_admin_system_contact_create')
-            }) }}>
+            title="Ansprechperson hinzufügen"
+            hx-get="{{ path('app_admin_system_contact_create') }}"
+            hx-target="body"
+            hx-swap="beforeend">
         Neu
     </button>
 {% endblock %}

templates/admin/system/contact/modal_create.html.twig

@@ -0,0 +1,7 @@
+{% extends 'htmx_modal.html.twig' %}
+
+{% block title %}Ansprechperson hinzufügen{% endblock %}
+
+{% block content %}
+    {% include 'admin/system/contact/_form.html.twig' %}
+{% endblock %}

templates/admin/system/contact/modal_delete.html.twig

@@ -0,0 +1,7 @@
+{% extends 'htmx_confirmation_modal.html.twig' %}
+
+{% block content %}
+    <div>
+        Möchtest du <em>{{ contact }}</em> als Ansprechperson wirklich löschen?
+    </div>
+{% endblock %}

templates/admin/system/contact/modal_edit.html.twig

@@ -0,0 +1,7 @@
+{% extends 'htmx_modal.html.twig' %}
+
+{% block title %}Ansprechperson bearbeiten{% endblock %}
+
+{% block content %}
+    {% include 'admin/system/contact/_form.html.twig' %}
+{% endblock %}