fix: [genericTemplates:filters] Custom tags (such as negated and like) are correctly parsed and added to the picker

templates/genericTemplates/filters.php

@@ -104,7 +104,10 @@ echo $this->Bootstrap->modal([
         $select = $filteringTable.closest('.modal-body').find('select.tag-input')
         let passedTags = []
         tags.forEach(tagname => {
-            if (!$select.find("option[value='" + tagname + "']")) {
+            const existingOption = $select.find('option').filter(function() {
+                return $(this).val() === tagname
+            })
+            if (existingOption.length == 0) {
                 passedTags.push(new Option(tagname, tagname, true, true))
             }
         })

webroot/js/main.js

@@ -213,13 +213,24 @@ function initSelect2Pickers() {
 
 function initSelect2Picker($select) {
 
-    function templateTag(state) {
+    function templateTag(state, $select) {
         if (!state.id) {
             return state.label;
         }
         if (state.colour === undefined) {
             state.colour = $(state.element).data('colour')
         }
+        if ($select !== undefined && state.text[0] === '!') {
+            // fetch corresponding tag and set colors?
+            // const baseTag = state.text.slice(1)
+            // const existingBaseTag = $select.find('option').filter(function() {
+            //     return $(this).val() === baseTag
+            // })
+            // if (existingBaseTag.length > 0) {
+            //     state.colour = existingBaseTag.data('colour')
+            //     state.text = baseTag
+            // }
+        }
         return HtmlHelper.tag(state)
     }
 
@@ -227,8 +238,8 @@ function initSelect2Picker($select) {
         placeholder: 'Pick a tag',
         tags: true,
         width: '100%',
-        templateResult: templateTag,
-        templateSelection: templateTag,
+        templateResult: (state) => templateTag(state),
+        templateSelection: (state) => templateTag(state, $select),
     })
 }