From c3d8fd9f56ae65c558babe127825883395c67417 Mon Sep 17 00:00:00 2001
From: Tobias Kunze <r@rixx.de>
Date: Mon, 2 Jun 2025 10:31:07 +0200
Subject: [PATCH 1/4] Display fix: place services in rows

---
 .../frontend/organizations/services.html      | 58 ++++++++++---------
 1 file changed, 31 insertions(+), 27 deletions(-)

diff --git a/src/servala/frontend/templates/frontend/organizations/services.html b/src/servala/frontend/templates/frontend/organizations/services.html
index 3286952..b3707e4 100644
--- a/src/servala/frontend/templates/frontend/organizations/services.html
+++ b/src/servala/frontend/templates/frontend/organizations/services.html
@@ -16,36 +16,40 @@
                 </div>
             </div>
         </div>
-        {% for service in services %}
-            <div class="card col-6 col-lg-3 col-md-4">
-                <div class="card-header d-flex align-items-center">
-                    {% if service.logo %}
-                        <img src="{{ service.logo.url }}"
-                             alt="{{ service.name }}"
-                             class="me-3"
-                             style="max-width: 48px;
-                                    max-height: 48px">
-                    {% endif %}
-                    <div class="d-flex flex-column">
-                        <h4 class="mb-0">{{ service.name }}</h4>
-                        <small class="text-muted">{{ service.category }}</small>
+        <div class="row">
+            {% for service in services %}
+                <div class="col-6 col-lg-3 col-md-4">
+                    <div class="card">
+                        <div class="card-header d-flex align-items-center">
+                            {% if service.logo %}
+                                <img src="{{ service.logo.url }}"
+                                     alt="{{ service.name }}"
+                                     class="me-3"
+                                     style="max-width: 48px;
+                                            max-height: 48px">
+                            {% endif %}
+                            <div class="d-flex flex-column">
+                                <h4 class="mb-0">{{ service.name }}</h4>
+                                <small class="text-muted">{{ service.category }}</small>
+                            </div>
+                        </div>
+                        <div class="card-body">
+                            {% if service.description %}<p class="card-text">{{ service.description }}</p>{% endif %}
+                        </div>
+                        <div class="card-footer d-flex justify-content-between">
+                            <span></span>
+                            <a href="{{ service.slug }}/" class="btn btn-light-primary">{% translate "Read More" %}</a>
+                        </div>
                     </div>
                 </div>
-                <div class="card-body">
-                    {% if service.description %}<p class="card-text">{{ service.description }}</p>{% endif %}
+            {% empty %}
+                <div class="card">
+                    <div class="card-body">
+                        <p>{% translate "No services found." %}</p>
+                    </div>
                 </div>
-                <div class="card-footer d-flex justify-content-between">
-                    <span></span>
-                    <a href="{{ service.slug }}/" class="btn btn-light-primary">{% translate "Read More" %}</a>
-                </div>
-            </div>
-        {% empty %}
-            <div class="card">
-                <div class="card-body">
-                    <p>{% translate "No services found." %}</p>
-                </div>
-            </div>
-        {% endfor %}
+            {% endfor %}
+        </div>
     </section>
     <script src="{% static "js/autosubmit.js" %}" defer></script>
 {% endblock content %}

From 50a7f628e4f5c503a768df77d6c3f5188c013836 Mon Sep 17 00:00:00 2001
From: Tobias Kunze <r@rixx.de>
Date: Mon, 2 Jun 2025 10:32:12 +0200
Subject: [PATCH 2/4] Display fix: Place service offerings in rows

---
 .../organizations/service_detail.html         | 64 ++++++++++---------
 1 file changed, 34 insertions(+), 30 deletions(-)

diff --git a/src/servala/frontend/templates/frontend/organizations/service_detail.html b/src/servala/frontend/templates/frontend/organizations/service_detail.html
index c3962eb..a118539 100644
--- a/src/servala/frontend/templates/frontend/organizations/service_detail.html
+++ b/src/servala/frontend/templates/frontend/organizations/service_detail.html
@@ -28,38 +28,42 @@
                 </div>
             </div>
         </div>
-        {% for offering in service.offerings.all %}
-            <div class="card col-6 col-lg-3 col-md-4">
-                <div class="card-header d-flex align-items-center">
-                    {% if offering.provider.logo %}
-                        <img src="{{ offering.provider.logo.url }}"
-                             alt="{{ offering.provider.name }}"
-                             class="me-3"
-                             style="max-width: 48px;
-                                    max-height: 48px">
-                    {% endif %}
-                    <div class="d-flex flex-column">
-                        <h4 class="mb-0">{{ offering.provider.name }}</h4>
+        <div class="row">
+            {% for offering in service.offerings.all %}
+                <div class="col-6 col-lg-3 col-md-4">
+                    <div class="card">
+                        <div class="card-header d-flex align-items-center">
+                            {% if offering.provider.logo %}
+                                <img src="{{ offering.provider.logo.url }}"
+                                     alt="{{ offering.provider.name }}"
+                                     class="me-3"
+                                     style="max-width: 48px;
+                                            max-height: 48px">
+                            {% endif %}
+                            <div class="d-flex flex-column">
+                                <h4 class="mb-0">{{ offering.provider.name }}</h4>
+                            </div>
+                        </div>
+                        <div class="card-body">
+                            {% if offering.description %}
+                                <p class="card-text">{{ offering.description }}</p>
+                            {% elif offering.provider.description %}
+                                <p class="card-text">{{ offering.provider.description }}</p>
+                            {% endif %}
+                        </div>
+                        <div class="card-footer d-flex justify-content-between">
+                            <span></span>
+                            <a href="offering/{{ offering.pk }}/" class="btn btn-light-primary">{% translate "Read More" %}</a>
+                        </div>
                     </div>
                 </div>
-                <div class="card-body">
-                    {% if offering.description %}
-                        <p class="card-text">{{ offering.description }}</p>
-                    {% elif offering.provider.description %}
-                        <p class="card-text">{{ offering.provider.description }}</p>
-                    {% endif %}
+            {% empty %}
+                <div class="card">
+                    <div class="card-body">
+                        <p>{% translate "No offerings found." %}</p>
+                    </div>
                 </div>
-                <div class="card-footer d-flex justify-content-between">
-                    <span></span>
-                    <a href="offering/{{ offering.pk }}/" class="btn btn-light-primary">{% translate "Read More" %}</a>
-                </div>
-            </div>
-        {% empty %}
-            <div class="card">
-                <div class="card-body">
-                    <p>{% translate "No offerings found." %}</p>
-                </div>
-            </div>
-        {% endfor %}
+            {% endfor %}
+        </div>
     </section>
 {% endblock content %}

From cb7332f4e972c5cebf38b9ce6ff8faf11fdf58ff Mon Sep 17 00:00:00 2001
From: Tobias Kunze <r@rixx.de>
Date: Mon, 2 Jun 2025 10:35:22 +0200
Subject: [PATCH 3/4] Fix display of search field

---
 src/servala/frontend/forms/service.py | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/servala/frontend/forms/service.py b/src/servala/frontend/forms/service.py
index 04fe2df..28e5c8e 100644
--- a/src/servala/frontend/forms/service.py
+++ b/src/servala/frontend/forms/service.py
@@ -18,7 +18,7 @@ class ServiceFilterForm(forms.Form):
     cloud_provider = forms.ModelChoiceField(
         queryset=CloudProvider.objects.all(), required=False
     )
-    q = forms.CharField(required=False)
+    q = forms.CharField(label=_("Search"), required=False)
 
     def filter_queryset(self, queryset):
         if category := self.cleaned_data.get("category"):

From fa6ac5334efc42012dc14014d316e8eaee12c43e Mon Sep 17 00:00:00 2001
From: Tobias Kunze <r@rixx.de>
Date: Mon, 2 Jun 2025 10:35:27 +0200
Subject: [PATCH 4/4] Fix search field functionality

---
 src/servala/frontend/forms/service.py | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/src/servala/frontend/forms/service.py b/src/servala/frontend/forms/service.py
index 28e5c8e..189f9d5 100644
--- a/src/servala/frontend/forms/service.py
+++ b/src/servala/frontend/forms/service.py
@@ -1,4 +1,5 @@
 from django import forms
+from django.db.models import Q
 from django.utils.translation import gettext_lazy as _
 
 from servala.core.models import (
@@ -25,6 +26,10 @@ class ServiceFilterForm(forms.Form):
             queryset = queryset.filter(category=category)
         if cloud_provider := self.cleaned_data.get("cloud_provider"):
             queryset = queryset.filter(offerings__provider=cloud_provider)
+        if search := self.cleaned_data.get("q"):
+            queryset = queryset.filter(
+                Q(name__icontains=search) | Q(category__name__icontains=search)
+            )
         return queryset