Feat: Improve assignment filter ux

src/Controller/Common/AssignmentFilterController.php

@@ -10,6 +10,7 @@ use App\Service\Common\AssignmentFilterHandler;
 use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
 use Symfony\Component\HttpFoundation\JsonResponse;
 use Symfony\Component\HttpFoundation\Request;
+use Symfony\Component\HttpFoundation\Response;
 use Symfony\Component\Routing\Annotation\Route;
 use Symfony\Component\Security\Http\Attribute\IsGranted;
 
@@ -56,4 +57,13 @@ class AssignmentFilterController extends AbstractController
 
         return $this->json($response);
     }
+
+    #[Route('/common/assignment/filter/reset', name: 'app_common_assignment_filter_reset')]
+    public function reset(Request $request): Response
+    {
+        $this->filterHandler->resetFilterSettings();
+        $returnUrl = $this->getReturnUrl($request, 'app_admin_assignment_index');
+
+        return $this->redirect($returnUrl);
+    }
 }

src/Model/AssignmentFilterDto.php

@@ -17,12 +17,6 @@ class AssignmentFilterDto
     private ?JobProfile $jobProfile = null;
     private ?Destination $destination = null;
     private ?int $duration = null;
-    private bool $reset;
-
-    public function __construct(bool $reset = false)
-    {
-        $this->reset = $reset;
-    }
 
     public function isActive(): bool
     {

src/Service/Common/AssignmentFilterHandler.php

@@ -32,8 +32,8 @@ class AssignmentFilterHandler
         $filterDto = $form->getData();
 
         if ($form->get('reset')->isClicked()) {
-            $filterDto = new AssignmentFilterDto(true);
-            $this->getSession()->remove($this->namespace);
+            $filterDto = new AssignmentFilterDto();
+            $this->resetFilterSettings();
         } elseif ($form->get('apply')->isClicked()) {
             $this->saveFilterSettings($filterDto);
         }
@@ -41,6 +41,11 @@ class AssignmentFilterHandler
         return $filterDto;
     }
 
+    public function resetFilterSettings(): void
+    {
+        $this->getSession()->remove($this->namespace);
+    }
+
     public function getFilterSettings(): AssignmentFilterDto
     {
         if (null === $data = $this->getSession()->get($this->namespace)) {

templates/admin/assignment/index.html.twig

@@ -3,22 +3,33 @@
 {% block title %}Einsatzübersicht{% endblock %}
 
 {% block content %}
-    <div class="flex items-start justify-between">
-        <h1 class="text-2xl font-bold pb-4">
+    <div class="flex items-start justify-between pb-4">
+        <h1 class="text-2xl font-bold">
             Einsatzübersicht
         </h1>
-        <button type="button"
-                class="{{ html_classes('btn btn--small', { 'btn--secondary': filterDto.active }) }}"
-                {{ stimulus_controller('modal-button', [], [], {'ajax-modal': '#ajax-modal'}) }}
-                {{ stimulus_action('modal-button', 'ajax', null, {
-                    'title': 'Einsätze filtern',
-                    'url': path('app_common_assignment_filter', { 'r': return_url() })
-                }) }}>
-            <div class="flex items-center space-x-1">
-                {{ icon('filter', 'w-5 h-5 shrink-0') }}
-                {% if filterDto.active %}<span>{{ filterDto.activeFiltersCount }} Filter aktiv</span>{% endif %}
-            </div>
-        </button>
+        <div class="flex flex-col items-end space-y-2 md:flex-row md:items-center md:space-x-2 md:space-y-0">
+            <button type="button"
+                    class="{{ html_classes('btn btn--small', { 'btn--secondary': filterDto.active }) }}"
+                    {{ stimulus_controller('modal-button', [], [], {'ajax-modal': '#ajax-modal'}) }}
+                    {{ stimulus_action('modal-button', 'ajax', null, {
+                        'title': 'Einsätze filtern',
+                        'url': path('app_common_assignment_filter', { 'r': return_url() })
+                    }) }}>
+                <div class="flex items-center space-x-1">
+                    {{ icon('filter', 'w-4 h-4 shrink-0') }}
+                    {% if filterDto.active %}
+                        <span class="whitespace-nowrap">{{ filterDto.activeFiltersCount }} Filter aktiv</span>
+                    {% else %}
+                        <span>Filter</span>
+                    {% endif %}
+                </div>
+            </button>
+            {% if filterDto.active %}
+                <a href="{{ path('app_common_assignment_filter_reset', { 'r': return_url() }) }}" class="btn btn--small btn--secondary">
+                    Reset
+                </a>
+            {% endif %}
+        </div>
     </div>
 
     <div class="data-table-wrapper">

templates/teamer/index.html.twig

@@ -3,34 +3,34 @@
 {% block title %}Einsatzübersicht{% endblock %}
 
 {% block content %}
-    <div class="flex items-start justify-between">
-        <h1 class="text-2xl font-bold pb-4">
-            Einsatzübersicht
+    <div class="flex items-start justify-between pb-4">
+        <h1 class="text-2xl font-bold">
+            Einsatz&shy;übersicht
         </h1>
-        <button type="button"
-                class="{{ html_classes('btn btn--small', { 'btn--secondary': filterDto.active }) }}"
-                {{ stimulus_controller('modal-button', [], [], {'ajax-modal': '#ajax-modal'}) }}
-                {{ stimulus_action('modal-button', 'ajax', null, {
-                    'title': 'Einsätze filtern',
-                    'url': path('app_common_assignment_filter', { 'r': return_url() })
-                }) }}>
-            <div class="flex items-center space-x-1">
-                {{ icon('filter', 'w-5 h-5 shrink-0') }}
-                {% if filterDto.active %}<span>{{ filterDto.activeFiltersCount }} Filter aktiv</span>{% endif %}
-            </div>
-        </button>
-    </div>
-    {% if errors|length %}
-        <div class="border border-red-500 rounded-md p-4 text-red-500 mb-8">
-            <ul>
-                {% for error in errors %}
-                    <li>
-                        {{ error.message }}
-                    </li>
-                {% endfor %}
-            </ul>
+        <div class="flex flex-col items-end space-y-2 md:flex-row md:items-center md:space-x-2 md:space-y-0">
+            <button type="button"
+                    class="{{ html_classes('btn btn--small', { 'btn--secondary': filterDto.active }) }}"
+                    {{ stimulus_controller('modal-button', [], [], {'ajax-modal': '#ajax-modal'}) }}
+                    {{ stimulus_action('modal-button', 'ajax', null, {
+                        'title': 'Einsätze filtern',
+                        'url': path('app_common_assignment_filter', { 'r': return_url() })
+                    }) }}>
+                <div class="flex items-center space-x-1">
+                    {{ icon('filter', 'w-4 h-4 shrink-0') }}
+                    {% if filterDto.active %}
+                        <span class="whitespace-nowrap">{{ filterDto.activeFiltersCount }} Filter aktiv</span>
+                    {% else %}
+                        <span>Filter</span>
+                    {% endif %}
+                </div>
+            </button>
+            {% if filterDto.active %}
+                <a href="{{ path('app_common_assignment_filter_reset', { 'r': return_url() }) }}" class="btn btn--small btn--secondary">
+                    Reset
+                </a>
+            {% endif %}
         </div>
-    {% endif %}
+    </div>
 
     {{ knp_pagination_render(pagination, 'paginator/sliding_boxes.html.twig') }}
     <div class="grid sm:grid-cols-2 md:grid-cols-3 gap-4 py-4">