Fix Issue #223

guilhemmarchand · Jan 27, 2021 · 01ec412 · 01ec412
1 parent 68fca2e
commit 01ec412
Show file tree

Hide file tree

Showing 3 changed files with 52 additions and 18 deletions.
diff --git a/docs/releasenotes.rst b/docs/releasenotes.rst
@@ -18,6 +18,7 @@ https://trackme.readthedocs.io/en/latest/configuration.html
 - Feature: Introducing the trackme REST API wrapper SPL command, allows interracting with the TrackMe REST API endpoints within SPL queries!
 - Feature: Introducing the smart status REST API endpoints, performs advanced status correlations and investigations easily and automatically, within the UI, as part of an alert action or within your third party automation!
 - Feature: REST API endpoint for Data Sampling - allow rest and run sampling
+- Feature: UI - Issue #223 - multiselect form enhancement with auto disablement of ALL when selecting at least one entry
 - Fix - Issue #217 - Activity alerts view results link would result to 404 page not found for out of the box alerts
 - Fix - Issue #218 - Data sampling - creating custom rule from main then clicking on back leads to wrong window
 - Fix - Issue #219 - Outliers detection - dropdown for alert on upper is not pref-filled with the actual setting of the entity

diff --git a/trackme/appserver/static/multiselect_all.js b/trackme/appserver/static/multiselect_all.js
@@ -0,0 +1,32 @@
+require([
+    'jquery',
+    'underscore',
+    'splunkjs/mvc',
+    'splunkjs/mvc/simplexml/ready!'
+], function(
+    $,
+    _,
+    mvc
+) {
+    var multiselects = _(mvc.Components.toJSON()).filter(function(obj) {
+        // This seems hacky; there should be a better way to do this
+        return obj.settings && obj.settings.get("type") === "multiselect" && obj.$el[0].className.indexOf("input-multiselect") > -1;
+    });
+    _(multiselects).each(function(multiselect) {
+        multiselect.on("change", function() {
+            var values = this.val();
+            // I assume the default multiselect value will be the first (hardcoded) choice
+            // Like <choice value="*">All</choice>
+            // If there is no hardcoded choice, then .options.choices[0] won't exist...
+            var first_choice_value = this.options.choices[0].value;
+            // If the user removed everything then add the first choice "All" back
+            if(values.length === 0) {
+                this.val([first_choice_value]);
+            }
+            // If the user choose something else then remove the first choice "All" (if it's there)
+            else if(values.indexOf(first_choice_value) >= 0 && values.length > 1) {
+                this.val(_.without(values, first_choice_value));
+            }
+        });
+    });
+});
diff --git a/trackme/default/data/ui/html/TrackMe.html b/trackme/default/data/ui/html/TrackMe.html
@@ -4200,7 +4200,7 @@ <h1>Splunk indexing queues:</h1>
                                 <div id="panelLinkQueues" class="dashboard-cell" style="width: 50%;">
                                     <div class="dashboard-panel clearfix">
                                         <div class="panel-element-row">
-                                            <div class="input input-dropdown" id="inputHostQueues">
+                                            <div class="input input-multiselect" id="inputHostQueues">
                                                 <label>Host(s):</label>
                                             </div>
                                         </div>
@@ -4299,7 +4299,7 @@ <h1>Splunk indexing time parsing issues:</h1>
                                 <div id="panelLinkParsingIssues" class="dashboard-cell" style="width: 50%;">
                                     <div class="dashboard-panel clearfix">
                                         <div class="panel-element-row">
-                                            <div class="input input-dropdown" id="inputHostParsing">
+                                            <div class="input input-multiselect" id="inputHostParsing">
                                                 <label>Host(s):</label>
                                             </div>
                                         </div>
@@ -8600,25 +8600,25 @@ <h2 class="panel-title">Click on any entry of the table to open interactive acti
                     <div style="margin-right: 28px;" class="input input-text" id="inputDataNameFilter">
                         <label>Keyword filter name:</label>
                     </div>
-                    <div class="input input-dropdown" id="inputTags">
+                    <div class="input input-multiselect" id="inputTags">
                         <label>Tags:</label>
                     </div>
-                    <div class="input input-dropdown" id="inputDataName">
+                    <div class="input input-multiselect" id="inputDataName">
                         <label>Name (use keyword filter):</label>
                     </div>
-                    <div class="input input-dropdown" id="inputDataIndex">
+                    <div class="input input-multiselect" id="inputDataIndex">
                         <label>Index:</label>
                     </div>
-                    <div class="input input-dropdown" id="inputDataSourcetype">
+                    <div class="input input-multiselect" id="inputDataSourcetype">
                         <label>Sourcetype(s):</label>
                     </div>
-                    <div class="input input-dropdown" id="inputDataSourceState">
+                    <div class="input input-multiselect" id="inputDataSourceState">
                         <label>Filter state:</label>
                     </div>
                     <div class="input input-dropdown" id="inputDataMonitoredState">
                         <label>Filter monitored_state:</label>
                     </div>
-                    <div class="input input-dropdown" id="inputDataPriority">
+                    <div class="input input-multiselect" id="inputDataPriority">
                         <label>Filter priority:</label>
                     </div>
                     <div class="input input-dropdown" id="refreshForm">
@@ -8634,10 +8634,10 @@ <h2 class="panel-title">Click on any entry of the table to open interactive acti
             <div class="dashboard-panel clearfix">
                 <h2 class="panel-title">Click on any entry of the table to open interactive actions for this entity, use inputs to filter out the selection: (restricted to the first thousand results, use the key world filter input for large scale selections)</h2>
                 <div class="fieldset">
-                    <div class="input input-dropdown" id="inputDataHostIndexes">
+                    <div class="input input-multiselect" id="inputDataHostIndexes">
                         <label>Index(es):</label>
                     </div>
-                    <div class="input input-dropdown" id="inputDataHostSourcetypes">
+                    <div class="input input-multiselect" id="inputDataHostSourcetypes">
                         <label>Sourcetype(s):</label>
                     </div>
                     <div class="input input-dropdown" id="inputDataHostFilterMode">
@@ -8646,16 +8646,16 @@ <h2 class="panel-title">Click on any entry of the table to open interactive acti
                     <div style="margin-right: 28px;" class="input input-text" id="inputDataHostFilter">
                         <label>Keyword filter hosts:</label>
                     </div>
-                    <div class="input input-dropdown" id="inputDataHost">
+                    <div class="input input-multiselect" id="inputDataHost">
                         <label>Host(s) (use keyword filter):</label>
                     </div>
-                    <div class="input input-dropdown" id="inputDataHostState">
+                    <div class="input input-multiselect" id="inputDataHostState">
                         <label>Filter state:</label>
                     </div>
                     <div class="input input-dropdown" id="inputDataHostMonitoredState">
                         <label>Filter monitored_state:</label>
                     </div>
-                    <div class="input input-dropdown" id="inputDataHostPriority">
+                    <div class="input input-multiselect" id="inputDataHostPriority">
                         <label>Filter priority:</label>
                     </div>
                     <div class="input input-dropdown" id="refreshHostForm">
@@ -8671,10 +8671,10 @@ <h2 class="panel-title">Click on any entry of the table to open interactive acti
             <div class="dashboard-panel clearfix">
                 <h2 class="panel-title">Click on any entry of the table to open interactive actions for this entity, use inputs to filter out the selection: (restricted to the first thousand results, use the key world filter input for large scale selections):</h2>
                 <div class="fieldset">
-                    <div class="input input-dropdown" id="inputMetricHostIndexes">
+                    <div class="input input-multiselect" id="inputMetricHostIndexes">
                         <label>Index(es):</label>
                     </div>
-                    <div class="input input-dropdown" id="inputMetricHostCategories">
+                    <div class="input input-multiselect" id="inputMetricHostCategories">
                         <label>Metric categorie(s):</label>
                     </div>
                     <div class="input input-dropdown" id="inputMetricHostFilterMode">
@@ -8683,16 +8683,16 @@ <h2 class="panel-title">Click on any entry of the table to open interactive acti
                     <div style="margin-right: 28px;" class="input input-dropdown" id="inputMetricHostFilter">
                         <label>Keyword filter hosts:</label>
                     </div>
-                    <div class="input input-dropdown" id="inputMetricHost">
+                    <div class="input input-multiselect" id="inputMetricHost">
                         <label>Host(s) (use keyword filter):</label>
                     </div>
-                    <div class="input input-dropdown" id="inputMetricHostState">
+                    <div class="input input-multiselect" id="inputMetricHostState">
                         <label>Filter state:</label>
                     </div>
                     <div class="input input-dropdown" id="inputMetricHostMonitoredState">
                         <label>Filter monitored_state:</label>
                     </div>
-                    <div class="input input-dropdown" id="inputMetricHostPriority">
+                    <div class="input input-multiselect" id="inputMetricHostPriority">
                         <label>Filter priority:</label>
                     </div>
                     <div class="input input-dropdown" id="refreshMetricHostForm">
@@ -36970,6 +36970,7 @@ <h2 class="panel-title">Search for audit changes:</h2>
 <script src="{{SPLUNKWEB_URL_PREFIX}}/static/app/trackme/checkbox_table_data_sampling.js" type="text/javascript"></script>
 <script src="{{SPLUNKWEB_URL_PREFIX}}/static/app/trackme/checkbox_table_tags_policies.js" type="text/javascript"></script>
 <script src="{{SPLUNKWEB_URL_PREFIX}}/static/app/trackme/table_raw.js" type="text/javascript"></script>
+<script src="{{SPLUNKWEB_URL_PREFIX}}/static/app/trackme/multiselect_all.js" type="text/javascript"></script>
 <script>
 var deps = [
     "splunkjs/ready!"