Merge pull request #3722 from lukasolson/add-field-filter

Add filter to field list when editing an index pattern

src/kibana/plugins/settings/sections/indices/_edit.html

@@ -27,6 +27,12 @@
         </div>
       </div>
 
+      <form role="form">
+        <input aria-label="Filter" ng-model="fieldFilter" class="form-control span12" type="text" placeholder="Filter" />
+      </form>
+
+      <br />
+
       <ul class="nav nav-tabs">
         <li class="kbn-settings-tab" ng-class="{ active: state.tab === fieldType.index }" ng-repeat="fieldType in fieldTypes">
           <a ng-click="changeTab(fieldType)">

src/kibana/plugins/settings/sections/indices/_indexed_fields.html

@@ -3,3 +3,5 @@
   rows="rows"
   per-page="perPage">
 </paginated-table>
+
+<p class="text-center default-message" ng-if="rows.length === 0">No matching fields found.</p>

src/kibana/plugins/settings/sections/indices/_indexed_fields.js

@@ -3,12 +3,13 @@ define(function (require) {
   require('components/paginated_table/paginated_table');
 
   require('modules').get('apps/settings')
-  .directive('indexedFields', function () {
+  .directive('indexedFields', function ($filter) {
     var yesTemplate = '<i class="fa fa-check" aria-label="yes"></i>';
     var noTemplate = '';
     var nameHtml = require('text!plugins/settings/sections/indices/_field_name.html');
     var typeHtml = require('text!plugins/settings/sections/indices/_field_type.html');
     var controlsHtml = require('text!plugins/settings/sections/indices/_field_controls.html');
+    var filter = $filter('filter');
 
     return {
       restrict: 'E',
@@ -26,11 +27,16 @@ define(function (require) {
           { title: 'controls', sortable: false }
         ];
 
-        $scope.$watchCollection('indexPattern.fields', function () {
+        $scope.$watchMulti(['[]indexPattern.fields', 'fieldFilter'], refreshRows);
+
+        function refreshRows() {
           // clear and destroy row scopes
           _.invoke(rowScopes.splice(0), '$destroy');
 
-          $scope.rows = $scope.indexPattern.getNonScriptedFields().map(function (field) {
+          var fields = filter($scope.indexPattern.getNonScriptedFields(), $scope.fieldFilter);
+          _.find($scope.fieldTypes, {index: 'indexedFields'}).count = fields.length; // Update the tab count
+
+          $scope.rows = fields.map(function (field) {
             var childScope = _.assign($scope.$new(), { field: field });
             rowScopes.push(childScope);
 
@@ -60,7 +66,7 @@ define(function (require) {
               }
             ];
           });
-        });
+        }
       }
     };
   });

src/kibana/plugins/settings/sections/indices/_scripted_fields.html

@@ -17,4 +17,4 @@
   per-page="perPage">
 </paginated-table>
 
-<div ng-if="rows.length === 0">No scripted fields</div>
+<p class="text-center" ng-if="rows.length === 0">No matching scripted fields found.</p>

src/kibana/plugins/settings/sections/indices/_scripted_fields.js

@@ -3,9 +3,11 @@ define(function (require) {
   require('components/paginated_table/paginated_table');
 
   require('modules').get('apps/settings')
-  .directive('scriptedFields', function (kbnUrl, Notifier) {
+  .directive('scriptedFields', function (kbnUrl, Notifier, $filter) {
     var rowScopes = []; // track row scopes, so they can be destroyed as needed
+    var popularityHtml = require('text!plugins/settings/sections/indices/_field_popularity.html');
     var controlsHtml = require('text!plugins/settings/sections/indices/_field_controls.html');
+    var filter = $filter('filter');
 
     var notify = new Notifier();
 
@@ -27,11 +29,16 @@ define(function (require) {
           { title: 'controls', sortable: false }
         ];
 
-        $scope.$watch('indexPattern.fields', function () {
+        $scope.$watchMulti(['[]indexPattern.fields', 'fieldFilter'], refreshRows);
+
+        function refreshRows() {
           _.invoke(rowScopes, '$destroy');
           rowScopes.length = 0;
 
-          $scope.rows = $scope.indexPattern.getScriptedFields().map(function (field) {
+          var fields = filter($scope.indexPattern.getScriptedFields(), $scope.fieldFilter);
+          _.find($scope.fieldTypes, {index: 'scriptedFields'}).count = fields.length; // Update the tab count
+
+          $scope.rows = fields.map(function (field) {
             var rowScope = $scope.$new();
             rowScope.field = field;
             rowScopes.push(rowScope);
@@ -46,7 +53,7 @@ define(function (require) {
               }
             ];
           });
-        });
+        }
 
         $scope.addDateScripts = function () {
           var conflictFields = [];

src/kibana/plugins/settings/styles/main.less

@@ -180,6 +180,10 @@ kbn-settings-indices {
     margin: 5px 0;
     text-align: right;
   }
+
+  p.text-center {
+    padding-top: 1em;
+  }
 }