#1670 Add scroll and filter in taxonomy tags selector

TheHive-Project · Feb 25, 2021 · 77bf9bf · 77bf9bf
1 parent 3d26c86
commit 77bf9bf
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 3 deletions.
diff --git a/frontend/app/scripts/controllers/misc/TaxonomySelectionModalCtrl.js b/frontend/app/scripts/controllers/misc/TaxonomySelectionModalCtrl.js
@@ -14,6 +14,7 @@
 
             this.selectTaxonomy = function(taxonomy) {
                 self.formData.selectedTaxonomy = taxonomy;
+                self.search = '';
             }
 
             this.selectTag = function(tag) {

diff --git a/frontend/app/views/partials/misc/taxonomy-selection.modal.html b/frontend/app/views/partials/misc/taxonomy-selection.modal.html
@@ -39,17 +39,26 @@ <h3 class="modal-title">Select tags from library</h3>
             </div>
         </div>
 
-        <div class="form-group" ng-if="$modal.formData.selectedTaxonomy">
+        <div ng-if="$modal.formData.selectedTaxonomy">
             <div class="clearfix">
                 <label>
                     Choose tags from taxonomy: {{$modal.formData.selectedTaxonomy.namespace}}
                 </label>
                 <a class="pull-right" href ng-click="$modal.formData.selectedTaxonomy = undefined">Show all taxonomies</a>
             </div>
 
-            <div>
+            <div class="row mb-xxs">
+                <div class="col-sm-12">
+                    <div class="has-feedback">
+                        <input type="text" ng-model="$modal.search" class="form-control" placeholder="Filter tags" autofocus>
+                        <span class="glyphicon glyphicon-search form-control-feedback"></span>
+                    </div>
+                </div>
+            </div>
+
+            <div style="height: 300px; max-height: 300px; overflow-y: scroll;">
                 <div class="list-group">
-                    <a href class="list-group-item" ng-repeat="tag in $modal.formData.selectedTaxonomy.tags"
+                    <a href class="list-group-item" ng-repeat="tag in $modal.formData.selectedTaxonomy.tags | filter:$modal.search"
                         ng-click="$modal.selectTag(tag)">
                         <span class="mr-xs" ng-class="{'text-primary': !!tag.selected, 'text-disabled': !!!tag.selected}">
                             <i class="fa fa-check"></i>