From d24b923a9bf53842ba372a9967a36afb80b4f01c Mon Sep 17 00:00:00 2001
From: Étienne Loks <etienne.loks@iggdrasil.net>
Date: Tue, 5 May 2026 16:11:59 +0200
Subject: ✨ search UI: add AND, OR and PARENTHESIS button in query
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 ishtar_common/static/js/ishtar.js                  | 48 ++++++++++++++++++++--
 .../templates/blocks/bs_form_snippet.html          | 15 ++++++-
 2 files changed, 58 insertions(+), 5 deletions(-)

diff --git a/ishtar_common/static/js/ishtar.js b/ishtar_common/static/js/ishtar.js
index 704547347..fde903ac3 100644
--- a/ishtar_common/static/js/ishtar.js
+++ b/ishtar_common/static/js/ishtar.js
@@ -860,6 +860,9 @@ function clear_search_field(){
     $("#id_search_vector").val("");
     add_message("-", 'info', "#advanced-search-info", true, false);
     enable_save();
+    $("#advanced-search-info-add").addClass("disabled");
+    $("#advanced-search-info-or").addClass("disabled");
+    $("#advanced-search-info-parenthesis").addClass("disabled");
 }
 
 function _clear_search_criteria_fields(query){
@@ -925,7 +928,13 @@ function update_search_field(){
             if (v == "") return;
             var term = get_label_from_input(item_for_label);
             if(!term || typeof term == "undefined") return;
-            if (query) query += " ";
+            if (query) {
+                if (query.endsWith(" )) ")) {
+                    query += " && ";
+                } else {
+                    query += " ";
+                }
+            }
             query += term + '="' + v + '"';
         }
     ).get();
@@ -939,7 +948,13 @@ function update_search_field(){
                     }
                     var term = get_label_from_input(item_for_label);
                     if(!term || typeof term == "undefined") return;
-                    if (query) query += " ";
+                    if (query) {
+                        if (query.endsWith(" )) ")) {
+                            query += " && ";
+                        } else {
+                            query += " ";
+                        }
+                    }
                     query += get_label_from_input(item_for_label) + '="' +
                         $(this).text() + '"';
             });
@@ -948,8 +963,11 @@ function update_search_field(){
     _clear_search_criteria_fields(query);
     if (query){
         add_message(query, 'secondary', "#advanced-search-info", true, false);
+        $("#advanced-search-info-add").removeClass("disabled");
+        $("#advanced-search-info-or").removeClass("disabled");
+        $("#advanced-search-info-parenthesis").removeClass("disabled");
     } else {
-        add_message("-", 'secondary', "#advanced-search-info", true, false);
+        clear_search_field();
     }
     enable_save();
 }
@@ -1054,6 +1072,30 @@ function register_advanced_search(){
 
     $(".advanced-search-valid").click(update_search_field);
     $(".advanced-search-clear").click(clear_search_field);
+
+    $("#advanced-search-info-add").click(function(){
+        let query = $("#id_search_vector").val();
+        if (query.endsWith(" && ") || query.endsWith(" || ")) return;
+        query += " && ";
+        $("#id_search_vector").val(query);
+        add_message(query, 'secondary', "#advanced-search-info", true, false);
+    });
+    $("#advanced-search-info-or").click(function(){
+        let query = $("#id_search_vector").val();
+        if (query.endsWith(" && ") || query.endsWith(" || ")) return;
+        query += " || ";
+        $("#id_search_vector").val(query);
+        add_message(query, 'secondary', "#advanced-search-info", true, false);
+    });
+    $("#advanced-search-info-parenthesis").click(function(){
+        let query = $("#id_search_vector").val();
+        if ((query.startsWith(" (( ") && query.endsWith(" )) ")) ||
+            query.endsWith(" && ") || query.endsWith(" || ")) return;
+        query = " (( " + query + " )) ";
+        $("#id_search_vector").val(query);
+        add_message(query, 'secondary', "#advanced-search-info", true, false);
+    });
+
     $('#modal-advanced-search').on('hidden.bs.modal', function (e) {
         var base_query = $("#id_search_vector").val();
         // reset all criteria
diff --git a/ishtar_common/templates/blocks/bs_form_snippet.html b/ishtar_common/templates/blocks/bs_form_snippet.html
index 4cb32a535..48c8012da 100644
--- a/ishtar_common/templates/blocks/bs_form_snippet.html
+++ b/ishtar_common/templates/blocks/bs_form_snippet.html
@@ -55,8 +55,19 @@
                 <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                     <span aria-hidden="true">&times;</span>
                 </button>
-                <div class="form-row col-12 inout-group">
-                    <div class="col-10" id="advanced-search-info"></div>
+                <div class="form-row col-12 input-group">
+                    <div class="col-6 col-lg-8" id="advanced-search-info"></div>
+                    <div class="col-4 col-lg-2 h-100 btn-group btn-group-sm p-1" role="group" aria-label="Actions">
+                        <a class="buttons-selected btn btn-success p-2 disabled" id="advanced-search-info-add" href="#" title="{% trans 'and operator' %}">
+                            <span>{% trans "AND" %}</span>
+                        </a>
+                        <a class="buttons-selected btn btn-success p-2 disabled" id="advanced-search-info-or" href="#" title="{% trans 'or operator' %}">
+                            <span>{% trans "OR" %}</span>
+                        </a>
+                        <a class="buttons-selected btn btn-success p-2 disabled" id="advanced-search-info-parenthesis" href="#" title="{% trans 'parenthesis' %}">
+                            <span>( )</span>
+                        </a>
+                    </div>
                     <div class="col-2">
                         <button type="button"
                             class="btn btn-secondary advanced-search-clear w-100 m-1 p-2">
-- 
cgit v1.2.3