ATLAS-2970: UI: Show counts besides the Type and Classification dropdown list in search

dashboardv2/public/js/main.js

@@ -200,7 +200,7 @@ require(['App',
     'select2'
 ], function(App, Router, CommonViewFunction, Globals, UrlLinks, VEntityList, VTagList) {
     var that = this;
-    this.asyncFetchCounter = 5;
+    this.asyncFetchCounter = 6;
     this.entityDefCollection = new VEntityList();
     this.entityDefCollection.url = UrlLinks.entitiesDefApiUrl();
     this.typeHeaders = new VTagList();
@@ -209,12 +209,16 @@ require(['App',
     this.enumDefCollection.url = UrlLinks.enumDefApiUrl();
     this.enumDefCollection.modelAttrName = "enumDefs";
     this.classificationDefCollection = new VTagList();
+    this.entityCountCollection = new VTagList();
+    this.entityCountCollection.url = UrlLinks.entityCountApi();
+    this.entityCountCollection.modelAttrName = "data";
 
     App.appRouter = new Router({
         entityDefCollection: this.entityDefCollection,
         typeHeaders: this.typeHeaders,
         enumDefCollection: this.enumDefCollection,
-        classificationDefCollection: this.classificationDefCollection
+        classificationDefCollection: this.classificationDefCollection,
+        entityCountCollection: this.entityCountCollection
     });
 
     var startApp = function() {
@@ -293,4 +297,12 @@ require(['App',
             startApp();
         }
     });
+
+    this.entityCountCollection.fetch({
+        skipDefaultError: true,
+        complete: function() {
+            --that.asyncFetchCounter;
+            startApp();
+        }
+    });
 });
\ No newline at end of file

dashboardv2/public/js/router/Router.js

@@ -42,7 +42,7 @@ define([
             '*actions': 'defaultAction'
         },
         initialize: function(options) {
-            _.extend(this, _.pick(options, 'entityDefCollection', 'typeHeaders', 'enumDefCollection', 'classificationDefCollection'));
+            _.extend(this, _.pick(options, 'entityDefCollection', 'typeHeaders', 'enumDefCollection', 'classificationDefCollection', 'entityCountCollection'));
             this.showRegions();
             this.bindCommonEvents();
             this.listenTo(this, 'route', this.postRouteExecute, this);
@@ -57,7 +57,8 @@ define([
                 'typeHeaders': this.typeHeaders,
                 'enumDefCollection': this.enumDefCollection,
                 'classificationDefCollection': this.classificationDefCollection,
-                'glossaryCollection': this.glossaryCollection
+                'glossaryCollection': this.glossaryCollection,
+                'entityCountCollection': this.entityCountCollection
             }
             this.sharedObj = {
                 searchTableColumns: {},

dashboardv2/public/js/utils/UrlLinks.js

@@ -40,6 +40,9 @@ define(['require', 'utils/Enums', 'utils/Utils', 'underscore'], function(require
         enumDefApiUrl: function(name) {
             return this.getDefApiUrl('enum', name);
         },
+        entityCountApi: function(){
+            return this.baseUrl + '/admin/metrics'
+        },
         getDefApiUrl: function(type, name) {
             var defApiUrl = this.typedefsUrl(), defUrl;
             if (name) {

dashboardv2/public/js/views/search/SearchLayoutView.js

@@ -89,8 +89,9 @@ define(['require',
              * @constructs
              */
             initialize: function(options) {
-                _.extend(this, _.pick(options, 'value', 'typeHeaders', 'searchVent', 'entityDefCollection', 'enumDefCollection', 'classificationDefCollection', 'searchTableColumns', 'searchTableFilters'));
+                _.extend(this, _.pick(options, 'value', 'typeHeaders', 'searchVent', 'entityDefCollection', 'enumDefCollection', 'classificationDefCollection', 'searchTableColumns', 'searchTableFilters', 'entityCountCollection'));
                 this.type = "basic";
+                this.entityCountObj = _.first(this.entityCountCollection.toJSON());
                 var param = Utils.getUrlState.getQueryParams();
                 this.query = {
                     dsl: {
@@ -258,7 +259,7 @@ define(['require',
                         isTermEl = $el.data('id') == "termLOV",
                         isTypeEl = $el.data('id') == "typeLOV";
                     if (e.type == "change" && $el.select2('data')) {
-                        var value = $el.val(),
+                        var value = $($el).find(':selected').data('name'),
                             key = "tag",
                             filterType = 'tagFilters',
                             value = value && value.length ? value : null;
@@ -310,9 +311,9 @@ define(['require',
                     }
                 }
                 var that = this,
-                    value = this.ui.searchInput.val() || this.ui.typeLov.val();
+                    value = this.ui.searchInput.val() || $(this.ui.typeLov).find(':selected').data('name');
                 if (!this.dsl && !value) {
-                    value = this.ui.tagLov.val() || this.ui.termLov.val();
+                    value = $(this.ui.tagLov).find(':selected').data('name') || $(this.ui.termLov).find(':selected').data('name')
                 }
                 if (value && value.length) {
                     this.ui.searchBtn.removeAttr("disabled");
@@ -445,10 +446,12 @@ define(['require',
                 this.typeHeaders.fullCollection.each(function(model) {
                     var name = Utils.getName(model.toJSON(), 'name');
                     if (model.get('category') == 'ENTITY') {
-                        typeStr += '<option>' + (name) + '</option>';
+                        var entityCount = (that.entityCountObj.entity.entityActive[name] + (that.entityCountObj.entity.entityDeleted[name] ? that.entityCountObj.entity.entityDeleted[name] : 0));
+                        typeStr += '<option value="'+ (name) +'" data-name="' + (name) + '">' + (name) + ' ' + (entityCount ? "(" + entityCount + ")" : '') + '</option>';
                     }
                     if (model.get('category') == 'CLASSIFICATION') {
-                        tagStr += '<option>' + (name) + '</option>';
+                        var tagEntityCount = that.entityCountObj.tag.tagEntities[name];
+                        tagStr += '<option value="'+ (name) +'" data-name="' + (name) + '">' + (name) + ' ' + (tagEntityCount ? "(" + tagEntityCount + ")" : '') + '</option>';
                     }
                 });
                 //to insert extra classification list
@@ -459,7 +462,11 @@ define(['require',
                 that.ui.tagLov.html(tagStr);
                 this.ui.typeLov.select2({
                     placeholder: "Select Type",
-                    allowClear: true
+                    allowClear: true,
+                    templateSelection: function(data, container) {
+                        $(data.element).attr('data-name', data.customValue);
+                        return data.text;
+                    }
                 });
                 this.ui.tagLov.select2({
                     placeholder: "Select Classification",
@@ -576,15 +583,18 @@ define(['require',
             },
             triggerSearch: function(value) {
                 var params = {
-                    searchType: this.type,
-                    dslChecked: this.ui.searchType.is(':checked'),
-                    tagFilters: null,
-                    entityFilters: null
-                }
-                params['type'] = this.ui.typeLov.select2('val') || null;
+                        searchType: this.type,
+                        dslChecked: this.ui.searchType.is(':checked'),
+                        tagFilters: null,
+                        entityFilters: null
+                    },
+                    typeLovValue = this.ui.typeLov.find(':selected').data('name'),
+                    tagLovValue = this.ui.tagLov.find(':selected').data('name'),
+                    termLovValue = this.ui.termLov.select2('val')
+                params['type'] = typeLovValue || null;
                 if (!this.dsl) {
-                    params['tag'] = this.ui.tagLov.select2('val') || null;
-                    params['term'] = this.ui.termLov.select2('val') || null;
+                    params['tag'] = tagLovValue || null;
+                    params['term'] = termLovValue || null;
                     var entityFilterObj = this.searchTableFilters['entityFilters'],
                         tagFilterObj = this.searchTableFilters['tagFilters'];
                     if (this.value.tag) {