You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@atlas.apache.org by sa...@apache.org on 2019/09/20 14:09:41 UTC

[atlas] branch branch-2.0 updated: ATLAS-3415 : UI : Beta UI : Improvements for left side tree view

This is an automated email from the ASF dual-hosted git repository.

sarath pushed a commit to branch branch-2.0
in repository https://gitbox.apache.org/repos/asf/atlas.git


The following commit(s) were added to refs/heads/branch-2.0 by this push:
     new 4b8987d  ATLAS-3415 : UI : Beta UI : Improvements for left side tree view
4b8987d is described below

commit 4b8987d30ba9fd0afabc378a13b099fd6a9456ac
Author: kevalbhatt <kb...@apache.org>
AuthorDate: Fri Sep 20 18:01:14 2019 +0530

    ATLAS-3415 : UI : Beta UI : Improvements for left side tree view
    
    (cherry picked from commit 6b1004105c29717cca1d1f38fd77d2e28ceff24c)
---
 dashboardv3/public/css/scss/leftsidebar.scss       |  31 +++++-
 dashboardv3/public/img/atlas-logo-beta-ui.png      | Bin 0 -> 10391 bytes
 .../tree/ClassificationTreeLayoutView_tmpl.html    |  22 +++-
 .../tree/CustomFilterTreeLayoutView_tmpl.html      |  22 +++-
 .../search/tree/EntityTreeLayoutView_tmpl.html     |  24 +++--
 .../search/tree/GlossaryTreeLayoutView_tmpl.html   |  21 +++-
 dashboardv3/public/js/templates/site/Header.html   |   2 +-
 .../js/views/glossary/GlossaryDetailLayoutView.js  |   4 +-
 .../search/tree/ClassificationTreeLayoutView.js    | 118 +++++++++++++--------
 .../search/tree/CustomFilterTreeLayoutView.js      |  56 +++++++++-
 .../js/views/search/tree/EntityTreeLayoutView.js   |  12 ++-
 .../js/views/search/tree/GlossaryTreeLayoutView.js |  12 +++
 12 files changed, 251 insertions(+), 73 deletions(-)

diff --git a/dashboardv3/public/css/scss/leftsidebar.scss b/dashboardv3/public/css/scss/leftsidebar.scss
index df7abe7..f753f57 100644
--- a/dashboardv3/public/css/scss/leftsidebar.scss
+++ b/dashboardv3/public/css/scss/leftsidebar.scss
@@ -47,6 +47,10 @@
                 }
             }
         }
+
+        .dropdown-toggle {
+            width: 15px;
+        }
     }
 
     .filter-tree-content {
@@ -164,6 +168,7 @@
 
         .dropdown-menu {
             min-width: 182px;
+            left: -155px;
 
             &>li {
                 padding: 3px 15px;
@@ -177,18 +182,40 @@
                         background-color: $color_havelock_blue_approx;
                         color: #fff !important;
                     }
+
+                    span {
+                        color: #fff !important;
+                    }
                 }
 
                 a {
                     display: inline-block;
                     padding: 0px 3px;
                 }
+
+                span {
+                    color: #686868;
+                    margin-left: 10px;
+                }
             }
         }
 
         .custom-filter {
-            .fa {
-                font-size: 12px;
+            .fa-circle-thin:after {
+                font-family: Source Sans Pro, sans-serif;
+                position: absolute;
+                left: 0px;
+                margin-left: 9px;
+                font-size: 11px;
+                font-weight: bold;
+            }
+
+            .advance-tree:after {
+                content: "A";
+            }
+
+            .basic-tree:after {
+                content: "B";
             }
         }
 
diff --git a/dashboardv3/public/img/atlas-logo-beta-ui.png b/dashboardv3/public/img/atlas-logo-beta-ui.png
new file mode 100644
index 0000000..0fad8fc
Binary files /dev/null and b/dashboardv3/public/img/atlas-logo-beta-ui.png differ
diff --git a/dashboardv3/public/js/templates/search/tree/ClassificationTreeLayoutView_tmpl.html b/dashboardv3/public/js/templates/search/tree/ClassificationTreeLayoutView_tmpl.html
index 4e20823..1970aac 100644
--- a/dashboardv3/public/js/templates/search/tree/ClassificationTreeLayoutView_tmpl.html
+++ b/dashboardv3/public/js/templates/search/tree/ClassificationTreeLayoutView_tmpl.html
@@ -18,16 +18,19 @@
     <div class="panel-heading dash-button-icon" data-toggle="collapse" aria-expanded="true" href="#c_classfication">
         <i class="ec-icon fa"></i>
         <h4 class="panel-title">Classifications</h4>
-        <div class="btn-group pull-right menu-items">
+        <div class="btn-group pull-right">
+            <!-- <button type="button" class="typeRefresh" data-id="groupOrFlatTreeView" data-type="classification" title="Show flat tree">
+                <i class="fa fa-sitemap"></i>
+            </button> -->
             <button type="button" class="typeRefresh" data-id="refreshTree" data-type="classification" title="Refresh">
                 <i class="fa fa-refresh"></i>
             </button>
             <button type="button" class="typeRefresh" data-id="showEmptyClassifications" title="Show unused classification">
                 <i class="fa fa-toggle-off"></i>
             </button>
-            <button type="button" data-id="createTag" data-type="classification" title="Create Classification">
+            <!-- <button type="button" data-id="createTag" data-type="classification" title="Create Classification">
                 <i class="fa fa-plus"></i>
-            </button>
+            </button> -->
             <!-- <ul class="dropdown-menu right-align tree-menu">
                 <li data-id="createTag"><i class="fa fa-plus"></i><a>Create Classification</a></li>
                 <li data-id="showEmptyClassifications"><i class="fa fa-check-circle"></i> <a>Show Empty</a></li>
@@ -35,6 +38,19 @@
             <!-- <button data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" type="button" data-id="tagMenu">
                 <i class="fa fa-ellipsis-v"></i>
             </button> -->
+            <button type="button" class="typeRefresh dropdown">
+                <div class=" btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+                    <i class="fa fa-ellipsis-v"></i>
+                </div>
+                <ul class="dropdown-menu" aria-labelledby="dropdownMenuButton">
+                    <li data-id="groupOrFlatTreeView" data-type="classification"> <i class="fa fa-list-ul"></i><span>Show flat tree</span>
+                    </li>
+                    <!--  <li data-id="showEmptyClassifications" data-type="classification"> <i class="fa fa-toggle-off"></i><span>Show unused classification</span>
+                    </li> -->
+                    <li data-id="createTag" data-type="classification"> <i class="fa fa-plus"></i><span>Create Classification</span>
+                    </li>
+                </ul>
+            </button>
         </div>
     </div>
     <div id="c_classfication" class="panel-collapse collapse jstree-with-action in">
diff --git a/dashboardv3/public/js/templates/search/tree/CustomFilterTreeLayoutView_tmpl.html b/dashboardv3/public/js/templates/search/tree/CustomFilterTreeLayoutView_tmpl.html
index 0f80652..c472628 100644
--- a/dashboardv3/public/js/templates/search/tree/CustomFilterTreeLayoutView_tmpl.html
+++ b/dashboardv3/public/js/templates/search/tree/CustomFilterTreeLayoutView_tmpl.html
@@ -18,16 +18,30 @@
     <div class="panel-heading dash-button-icon" data-toggle="collapse" aria-expanded="true" href="#c_customFilter">
         <i class="ec-icon fa"></i>
         <h4 class="panel-title">Custom Filters</h4>
-        <div class="btn-group pull-right menu-items">
+        <div class="btn-group pull-right ">
+            <button type="button" class="typeRefresh" data-id="groupOrFlatTreeView" data-type="customFilter" title="Show all">
+                <i class="fa fa-sitemap"></i>
+            </button>
             <button type="button" class="typeRefresh" data-id="refreshTree" data-type="CustomFilter" title="Refresh">
                 <i class="fa fa-refresh"></i>
             </button>
-            <button type="button" class="typeRefresh" data-id="showCustomFilter" title="Show Advanced search">
+            <!-- <button type="button" class="typeRefresh" data-id="showCustomFilter" title="Show Advanced search">
                 <i class="fa fa-toggle-on switch-button"></i>
-            </button>
+            </button> -->
+            <!--   <button type="button" class="typeRefresh dropdown">
+                <div class=" btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+                    <i class="fa fa-ellipsis-v"></i>
+                </div>
+                <ul class="dropdown-menu" aria-labelledby="dropdownMenuButton">
+                    <li data-id="groupOrFlatTreeView" data-type="customFilter"> <i class="fa fa-sitemap"></i><span>Show flat tree</span>
+                    </li>
+                    <li data-id="refreshTree" data-type="customFilter"><i class="fa fa-refresh"></i><span>Refresh</span>
+                    </li>
+                </ul>
+            </button> -->
         </div>
     </div>
     <div id="c_customFilter" class="panel-collapse collapse jstree-with-action in">
-        <div  class="custom-filter" data-id="customFilterSearchTree"></div>
+        <div class="custom-filter" data-id="customFilterSearchTree"></div>
     </div>
 </div>
\ No newline at end of file
diff --git a/dashboardv3/public/js/templates/search/tree/EntityTreeLayoutView_tmpl.html b/dashboardv3/public/js/templates/search/tree/EntityTreeLayoutView_tmpl.html
index 9091873..bb74ac8 100644
--- a/dashboardv3/public/js/templates/search/tree/EntityTreeLayoutView_tmpl.html
+++ b/dashboardv3/public/js/templates/search/tree/EntityTreeLayoutView_tmpl.html
@@ -18,10 +18,10 @@
     <div class="panel-heading dash-button-icon" data-toggle="collapse" aria-expanded="true" href="#c_entity">
         <i class="ec-icon fa"></i>
         <h4 class="panel-title">Entities</h4>
-        <div class="btn-group pull-right menu-items">
-            <button type="button" class="typeRefresh" data-id="groupOrFlatTreeView" data-type="entity" title="Show group tree">
-                <i class="fa fa-sitemap group-tree-deactivate"></i>
-            </button>
+        <div class="btn-group pull-right">
+            <!--   <button type="button" class="typeRefresh" data-id="groupOrFlatTreeView" data-type="entity" title="Show flat tree">
+                <i class="fa fa-sitemap"></i>
+            </button> -->
             <button type="button" class="typeRefresh" data-id="refreshTree" data-type="entity" title="Refresh">
                 <i class="fa fa-refresh"></i>
             </button>
@@ -33,9 +33,19 @@
             <button type="button" class="typeRefresh" data-id="showEmptyServiceType" data-type="entity" title="Show empty service types">
                 <i class="fa fa-toggle-off"></i>
             </button>
-            <!--  <button class="" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" type="button">
-                <i class="fa fa-ellipsis-v"></i>
-            </button> -->
+            <button type="button" class="typeRefresh dropdown">
+                <div class=" btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+                    <i class="fa fa-ellipsis-v"></i>
+                </div>
+                <ul class="dropdown-menu" aria-labelledby="dropdownMenuButton">
+                    <li data-id="groupOrFlatTreeView" data-type="entity"> <i class="fa fa-list-ul"></i><span>Show flat tree</span>
+                    </li>
+                    <!--  <li data-id="showEmptyServiceType" data-type="entity"> <i class="fa fa-toggle-off"></i><span >Show empty service types</span>
+                    </li>
+                    <li data-id="refreshTree" data-type="entity"><i class="fa fa-refresh"></i><span >Refresh</span>
+                    </li> -->
+                </ul>
+            </button>
         </div>
     </div>
     <div id="c_entity" class="panel-collapse collapse jstree-with-action in">
diff --git a/dashboardv3/public/js/templates/search/tree/GlossaryTreeLayoutView_tmpl.html b/dashboardv3/public/js/templates/search/tree/GlossaryTreeLayoutView_tmpl.html
index 5bc3baf..8310b0a 100644
--- a/dashboardv3/public/js/templates/search/tree/GlossaryTreeLayoutView_tmpl.html
+++ b/dashboardv3/public/js/templates/search/tree/GlossaryTreeLayoutView_tmpl.html
@@ -18,7 +18,7 @@
     <div class="panel-heading dash-button-icon" data-toggle="collapse" aria-expanded="true" href="#c_term">
         <i class="ec-icon fa"></i>
         <h4 class="panel-title">Glossaries</h4>
-        <div class="btn-group pull-right menu-items">
+        <div class="btn-group pull-right">
             <button type="button" class="typeRefresh" data-id="refreshTree" data-type="term" title="Refresh"><i class="fa fa-refresh"></i></button>
             <!-- <ul class="dropdown-menu right-align tree-menu">
                 <li data-id="createGlossary"><i class="fa fa-plus"></i> <a>Create Glossary</a></li>
@@ -26,8 +26,23 @@
             <button type="button" class="typeRefresh" data-id="showGlossaryType" title="Show Category">
                 <i class="fa fa-toggle-on switch-button"></i>
             </button>
-             <button title="Create Glossary" type="button" data-id="createGlossary"><i class="fa fa-plus"></i></button>
-           <!--  <button data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" type="button" data-id="termMenu"><i class="fa fa-ellipsis-v"></i></button> -->
+            <!--  <button title="Create Glossary" type="button" data-id="createGlossary">
+                <i class="fa fa-plus"></i>
+            </button> -->
+            <!--  <button data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" type="button" data-id="termMenu"><i class="fa fa-ellipsis-v"></i></button> -->
+            <button type="button" class="typeRefresh dropdown">
+                <div class=" btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+                    <i class="fa fa-ellipsis-v"></i>
+                </div>
+                <ul class="dropdown-menu" aria-labelledby="dropdownMenuButton">
+                    <!-- <li data-id="showGlossaryType" data-type="term"> <i class="fa fa-toggle-on switch-button"></i><span>Show Category</span>
+                    </li> -->
+                    <!-- <li data-id="refreshTree" data-type="term"><i class="fa fa-refresh"></i><span>Refresh</span>
+                    </li> -->
+                    <li data-id="createGlossary" data-type="term"> <i class="fa fa-plus"></i><span>Create Glossary</span>
+                    </li>
+                </ul>
+            </button>
         </div>
     </div>
     <div id="c_term" class="panel-collapse collapse jstree-with-action in">
diff --git a/dashboardv3/public/js/templates/site/Header.html b/dashboardv3/public/js/templates/site/Header.html
index 9561d82..78613e8 100644
--- a/dashboardv3/public/js/templates/site/Header.html
+++ b/dashboardv3/public/js/templates/site/Header.html
@@ -19,7 +19,7 @@
         <tr>
             <td>
                 <ul class="nav navbar-nav">
-                    <a href="#/"><img src="img/atlas-logo-beta-side.png" class="logo"></a>
+                    <a href="#/"><img src="img/atlas-logo-beta-ui.png" class="logo"></a>
                 </ul>
             </td>
             <td class="global-search-container">
diff --git a/dashboardv3/public/js/views/glossary/GlossaryDetailLayoutView.js b/dashboardv3/public/js/views/glossary/GlossaryDetailLayoutView.js
index 8308a0a..1216a9d 100644
--- a/dashboardv3/public/js/views/glossary/GlossaryDetailLayoutView.js
+++ b/dashboardv3/public/js/views/glossary/GlossaryDetailLayoutView.js
@@ -157,7 +157,9 @@ define(['require',
                                             }
                                         });
                                     }
-                                    that.glossaryCollection.trigger("update:details", { data: that.data });
+                                    that.options.categoryEvent.trigger("Success:TermRename", true);
+                                    // that.glossaryCollection.trigger("test");
+                                    // that.glossaryCollection.trigger("update:details", { data: that.data });
                                 }
                                 that.data = data;
                                 that.renderDetails(that.data);
diff --git a/dashboardv3/public/js/views/search/tree/ClassificationTreeLayoutView.js b/dashboardv3/public/js/views/search/tree/ClassificationTreeLayoutView.js
index 01096e4..8479b9e 100644
--- a/dashboardv3/public/js/views/search/tree/ClassificationTreeLayoutView.js
+++ b/dashboardv3/public/js/views/search/tree/ClassificationTreeLayoutView.js
@@ -36,6 +36,7 @@ define([
         ui: {
             //refresh
             refreshTree: '[data-id="refreshTree"]',
+            groupOrFlatTree: '[data-id="groupOrFlatTreeView"]',
 
             // menuItems: '.menu-items>ul>li',
 
@@ -70,10 +71,24 @@ define([
 
             events["click " + this.ui.showEmptyClassifications] = function(e) {
                 var getTreeData, displayText;
+                e.stopPropagation();
                 this.isEmptyClassification = !this.isEmptyClassification;
                 this.classificationSwitchBtnUpdate();
             };
 
+            events["click " + this.ui.groupOrFlatTree] = function(e) {
+                var type = $(e.currentTarget).data("type");
+                e.stopPropagation();
+                this.isGroupView = !this.isGroupView;
+                // this.ui.groupOrFlatTree.attr("data-original-title", (this.isGroupView ? "Show flat tree" : "Show group tree"));
+                this.ui.groupOrFlatTree.tooltip('hide');
+                // this.ui.groupOrFlatTree.find("i").toggleClass("group-tree-deactivate");
+                this.ui.groupOrFlatTree.find("i").toggleClass("fa-sitemap fa-list-ul");
+                this.ui.groupOrFlatTree.find("span").html(this.isGroupView ? "Show flat tree" : "Show group tree");
+                that.ui[type + "SearchTree"].jstree(true).destroy();
+                that.renderClassificationTree();
+            };
+
             return events;
         },
         initialize: function(options) {
@@ -97,6 +112,7 @@ define([
             this.isEmptyClassification = true;
             this.entityTreeData = {};
             this.tagId = null;
+            this.isGroupView = true;
         },
         onRender: function() {
             this.renderClassificationTree();
@@ -147,6 +163,7 @@ define([
             this.ui.showEmptyClassifications.attr("data-original-title", (this.isEmptyClassification ? "Show" : "Hide") + " unused classification");
             this.ui.showEmptyClassifications.tooltip('hide');
             this.ui.showEmptyClassifications.find("i").toggleClass("fa-toggle-on fa-toggle-off");
+            this.ui.showEmptyClassifications.find("span").html((this.isEmptyClassification ? "Show" : "Hide") + " unused classification");
             this.ui.classificationSearchTree.jstree(true).refresh();
         },
         createClassificationAction: function() {
@@ -293,29 +310,30 @@ define([
                 collection = (options && options.collection) || this.classificationDefCollection.fullCollection,
                 listOfParents = [],
                 listWithEmptyParents = [],
+                listWithEmptyParentsFlatView = [],
+                flatViewList = [],
                 isSelectedChild = false,
                 openClassificationNodesState = function(treeDate) {
-                    if (treeDate.length == 1) {
-                        _.each(treeDate, function(model) {
-                            model.state['opeaned'] = true;
-                        })
-                    }
+                    // if (treeDate.length == 1) {
+                    _.each(treeDate, function(model) {
+                        model.state['opened'] = true;
+                    })
+                    // }
                 },
                 generateNode = function(nodeOptions, options, isChild) {
                     var nodeStructure = {
                         text: nodeOptions.name,
                         name: nodeOptions.name,
-                        children: getChildren({
+                        children: that.isGroupView ? getChildren({
                             children: isChild ? nodeOptions.model.subTypes : nodeOptions.model.get("subTypes"),
                             parent: isChild ? options.parentName : nodeOptions.name
-                        }),
+                        }) : null,
                         type: isChild ? nodeOptions.children.get("category") : nodeOptions.model.get("category"),
                         id: isChild ? nodeOptions.children.get("guid") : nodeOptions.model.get("guid"),
                         icon: "fa fa-tag",
                         gType: "Classification",
                     }
                     return nodeStructure;
-
                 },
 
                 getChildren = function(options) {
@@ -346,13 +364,14 @@ define([
                                     },
                                     nodeProperties = {
                                         parent: options.parentName,
+                                        text: tagname,
                                         guid: child.get("guid"),
                                         model: child,
-                                        state: { selected: isSelectedChild }
+                                        state: { selected: isSelectedChild, opened: true }
                                     },
                                     isChild = true,
                                     getNodeDetails = generateNode(nodeDetails, options, isChild),
-                                    classificationNode = (_.extend(nodeProperties, getNodeDetails));
+                                    classificationNode = (_.extend(getNodeDetails, nodeProperties));
                                 data.push(classificationNode);
                                 if (that.isEmptyClassification) {
                                     var isTagEntityCount = _.isNaN(tagEntityCount) ? 0 : tagEntityCount;
@@ -368,45 +387,56 @@ define([
                 }
             collection.each(function(model) {
                 var modelJSON = model.toJSON();
-                if (modelJSON.superTypes.length == 0) {
-                    var name = modelJSON.name;
-                    var tagEntityCount = that.entityCountObj.tag.tagEntities[name];
-                    var tagname = tagEntityCount ? name + " (" + _.numberFormatWithComa(tagEntityCount) + ")" : name,
-                        isSelected = false;
+                var name = modelJSON.name;
+                var tagEntityCount = that.entityCountObj.tag.tagEntities[name];
+                var tagname = tagEntityCount ? name + " (" + _.numberFormatWithComa(tagEntityCount) + ")" : name,
+                    isSelected = false;
 
-                    if (that.options.value) {
-                        isSelected = that.options.value.tag ? that.options.value.tag == name : false;
-                        if (!that.tagId) {
-                            that.tagId = isSelected ? model.get("guid") : null;
-                        }
+                if (that.options.value) {
+                    isSelected = that.options.value.tag ? that.options.value.tag == name : false;
+                    if (!that.tagId) {
+                        that.tagId = isSelected ? model.get("guid") : null;
                     }
-                    var parentNodeDetails = {
-                            name: name,
-                            model: model,
-                            isSelectedChild: isSelectedChild
-                        },
-                        parentNodeProperties = {
-                            text: tagname,
-                            state: {
-                                disabled: tagEntityCount == 0 ? true : false,
-                                selected: isSelected
-                            }
-                        },
-                        isChild = false,
-                        getParentNodeDetails = generateNode(parentNodeDetails, model, isChild),
-                        classificationParentNode = (_.extend(getParentNodeDetails, parentNodeProperties));
+                }
+                var parentNodeDetails = {
+                        name: name,
+                        model: model,
+                        isSelectedChild: isSelectedChild
+                    },
+                    parentNodeProperties = {
+                        text: tagname,
+                        state: {
+                            disabled: tagEntityCount == 0 ? true : false,
+                            selected: isSelected,
+                            opened: true
+                        }
+                    },
+                    isChild = false,
+                    getParentNodeDetails,
+                    classificationParentNode, getParentFlatView, classificationParentFlatView;
+                if (modelJSON.superTypes.length == 0) {
+                    getParentNodeDetails = generateNode(parentNodeDetails, model, isChild);
+                    classificationParentNode = (_.extend(getParentNodeDetails, parentNodeProperties));
                     listOfParents.push(classificationParentNode);
-                    if (that.isEmptyClassification) {
-                        var isTagEntityCount = _.isNaN(tagEntityCount) ? 0 : tagEntityCount;
-                        if (isTagEntityCount) {
+                }
+                getParentFlatView = generateNode(parentNodeDetails, model);
+                classificationParentFlatView = (_.extend(getParentFlatView, parentNodeProperties));
+                flatViewList.push(classificationParentFlatView);
+                if (that.isEmptyClassification) {
+                    var isTagEntityCount = _.isNaN(tagEntityCount) ? 0 : tagEntityCount;
+                    if (isTagEntityCount) {
+                        if (modelJSON.superTypes.length == 0) {
                             listWithEmptyParents.push(classificationParentNode);
                         }
-
+                        listWithEmptyParentsFlatView.push(classificationParentFlatView);
                     }
+
                 }
             });
-            var classificationData = that.isEmptyClassification ? listWithEmptyParents : listOfParents;
-            openClassificationNodesState(classificationData);
+            var classificationTreeData = that.isEmptyClassification ? listWithEmptyParents : listOfParents;
+            var flatViewClassificaton = that.isEmptyClassification ? listWithEmptyParentsFlatView : flatViewList;
+            var classificationData = that.isGroupView ? classificationTreeData : flatViewClassificaton;
+            // openClassificationNodesState(classificationData);
             return classificationData;
         },
         generateSearchTree: function(options) {
@@ -435,9 +465,9 @@ define([
                         },
                         node_customize: {
                             default: function(el) {
-                                if ($(el).find(".fa-ellipsis-h").length === 0) {
-                                    $(el).append('<div class="tools"><i class="fa fa-ellipsis-h classificationPopover" rel="popover"></i></div>');
-                                }
+                                // if ($(el).find(".fa-ellipsis-h").length === 0) {
+                                $(el).append('<div class="tools"><i class="fa fa-ellipsis-h classificationPopover" rel="popover"></i></div>');
+                                // }
                             }
                         },
                         core: {
diff --git a/dashboardv3/public/js/views/search/tree/CustomFilterTreeLayoutView.js b/dashboardv3/public/js/views/search/tree/CustomFilterTreeLayoutView.js
index f707d1c..01c1a2c 100644
--- a/dashboardv3/public/js/views/search/tree/CustomFilterTreeLayoutView.js
+++ b/dashboardv3/public/js/views/search/tree/CustomFilterTreeLayoutView.js
@@ -42,6 +42,7 @@ define([
         ui: {
             //refresh
             refreshTree: '[data-id="refreshTree"]',
+            groupOrFlatTree: '[data-id="groupOrFlatTreeView"]',
             customFilterSearchTree: '[data-id="customFilterSearchTree"]',
             showCustomFilter: '[data-id="showCustomFilter"]'
 
@@ -64,6 +65,17 @@ define([
                 that.isBasic = !that.isBasic;
                 this.customFilterSwitchBtnUpdate();
             };
+            events["click " + this.ui.groupOrFlatTree] = function(e) {
+                var type = $(e.currentTarget).data("type");
+                e.stopPropagation();
+                this.isGroupView = !this.isGroupView;
+                this.ui.groupOrFlatTree.attr("data-original-title", (this.isGroupView ? "Show all" : "Show type"));
+                this.ui.groupOrFlatTree.tooltip('hide');
+                this.ui.groupOrFlatTree.find("i").toggleClass("group-tree-deactivate");
+                this.ui.groupOrFlatTree.find("span").html(this.isGroupView ? "Show flat tree" : "Show group tree");
+                that.ui[type + "SearchTree"].jstree(true).destroy();
+                that.renderCustomFilter();
+            };
 
             return events;
         },
@@ -125,6 +137,7 @@ define([
             this.customFilterData = null;
             this.isBasic = true;
             this.customFilterId = null;
+            this.isGroupView = true;
         },
         onRender: function() {
             this.renderCustomFilter();
@@ -176,7 +189,18 @@ define([
                 getEntityTreeConfig = function(opt) {
                     return {
                         plugins: ["search", "core", "sort", "conditionalselect", "changed", "wholerow", "node_customize"],
-
+                        conditionalselect: function(node) {
+                            var type = node.original.type;
+                            if (type == "customFilterFolder") {
+                                if (node.children.length) {
+                                    return false;
+                                } else {
+                                    return true;
+                                }
+                            } else {
+                                return true;
+                            }
+                        },
                         state: { opened: true },
                         search: {
                             show_only_matches: true,
@@ -193,7 +217,6 @@ define([
                             multiple: false,
                             data: function(node, cb) {
                                 if (node.id === "#") {
-                                    var testData = that.getCustomFilterTree();
                                     cb(that.getCustomFilterTree());
                                 }
                             }
@@ -249,6 +272,7 @@ define([
             var that = this,
                 customFilterBasicList = [],
                 customFilterAdvanceList = [],
+                allCustomFilter = [],
                 customFilterBasicTreeData = that.saveSearchBaiscCollection.fullCollection.models,
                 customFilterAdvanceTreeData = that.saveSearchAdvanceCollection.fullCollection.models,
                 openClassificationNodesState = function(treeDate) {
@@ -259,12 +283,13 @@ define([
                     }
                 },
                 generateNode = function(nodeOptions) {
+                    var searchType = nodeOptions.get('searchType');
                     var nodeStructure = {
                         text: nodeOptions.get('name'),
                         name: nodeOptions.get('name'),
                         type: "customFilter",
                         id: nodeOptions.get('guid'),
-                        icon: "fa fa-search",
+                        icon: (searchType === 'BASIC' ? "fa fa-circle-thin basic-tree" : "fa fa-circle-thin advance-tree"),
                         gType: "CustomFilter",
                         model: nodeOptions
                     }
@@ -274,11 +299,32 @@ define([
             that.customFilterId = null;
             _.each(customFilterBasicTreeData, function(filterNode) {
                 customFilterBasicList.push(generateNode(filterNode));
+                allCustomFilter.push(generateNode(filterNode));
             });
             _.each(customFilterAdvanceTreeData, function(filterNode) {
                 customFilterAdvanceList.push(generateNode(filterNode));
+                allCustomFilter.push(generateNode(filterNode));
             });
-            var customFilterList = that.isBasic ? customFilterBasicList : customFilterAdvanceList;
+
+            // var customFilterList = that.isBasic ? customFilterBasicList : customFilterAdvanceList;
+            var treeView = [{
+                icon: "fa fa-folder-o",
+                gType: "customFilter",
+                type: "customFilterFolder",
+                children: customFilterBasicList,
+                text: "Basic Search",
+                name: "Basic Search",
+                state: { opened: true }
+            }, {
+                icon: "fa fa-folder-o",
+                gType: "customFilter",
+                type: "customFilterFolder",
+                children: customFilterAdvanceList,
+                text: "Advance Search",
+                name: "Advance Search",
+                state: { opened: true }
+            }];
+            var customFilterList = that.isGroupView ? treeView : allCustomFilter;
             return customFilterList;
         },
         onNodeSelect: function(nodeData) {
@@ -289,11 +335,13 @@ define([
                 that.customFilterId = selectedNodeId;
                 if (options && options.model) {
                     var searchParameters = options.model.get('searchParameters'),
+                        searchType = options.model.get('searchType'),
                         params = CommonViewFunction.generateUrlFromSaveSearchObject({
                             value: { "searchParameters": searchParameters },
                             classificationDefCollection: that.classificationDefCollection,
                             entityDefCollection: that.entityDefCollection
                         });
+                    searchType === 'ADVANCED' ? that.isBasic = false : that.isBasic = true;
                     _.extend({}, this.options.value, params),
 
                         Utils.setUrl({
diff --git a/dashboardv3/public/js/views/search/tree/EntityTreeLayoutView.js b/dashboardv3/public/js/views/search/tree/EntityTreeLayoutView.js
index fa22022..dfb2954 100644
--- a/dashboardv3/public/js/views/search/tree/EntityTreeLayoutView.js
+++ b/dashboardv3/public/js/views/search/tree/EntityTreeLayoutView.js
@@ -61,6 +61,7 @@ define([
 
             // show and hide entities and classifications with 0 numbers
             events["click " + this.ui.showEmptyServiceType] = function(e) {
+                e.stopPropagation();
                 this.isEmptyServicetype = !this.isEmptyServicetype;
                 this.entitySwitchBtnUpdate();
             };
@@ -69,9 +70,12 @@ define([
                 var type = $(e.currentTarget).data("type");
                 e.stopPropagation();
                 this.isGroupView = !this.isGroupView;
-                this.ui.groupOrFlatTree.attr("data-original-title", (this.isGroupView ? "Show flat tree" : "Show group tree"));
+                // this.ui.groupOrFlatTree.attr("data-original-title", (this.isGroupView ? "Show flat tree" : "Show group tree"));
                 this.ui.groupOrFlatTree.tooltip('hide');
-                this.ui.groupOrFlatTree.find("i").toggleClass("group-tree-deactivate");
+                // this.ui.groupOrFlatTree.find("i").toggleClass("group-tree-deactivate");
+                this.ui.groupOrFlatTree.find("i").toggleClass("fa-sitemap fa-list-ul");
+                this.ui.groupOrFlatTree.find("span").html(this.isGroupView ? "Show flat tree" : "Show group tree");
+
                 that.ui[type + "SearchTree"].jstree(true).destroy();
                 that.renderEntityTree();
             };
@@ -121,7 +125,7 @@ define([
             this.isEmptyServicetype = true;
             this.entityTreeData = {};
             this.typeId = null;
-            this.isGroupView = false;
+            this.isGroupView = true;
         },
         onRender: function() {
             this.renderEntityTree();
@@ -158,6 +162,7 @@ define([
             this.ui.showEmptyServiceType.attr("data-original-title", (this.isEmptyServicetype ? "Show" : "Hide") + " empty service types");
             this.ui.showEmptyServiceType.tooltip('hide');
             this.ui.showEmptyServiceType.find("i").toggleClass("fa-toggle-on fa-toggle-off");
+            // this.ui.showEmptyServiceType.find("span").html((this.isEmptyServicetype ? "Show" : "Hide") + " empty service types");
             this.ui.entitySearchTree.jstree(true).refresh();
         },
         manualRender: function(options) {
@@ -173,7 +178,6 @@ define([
                 var dataFound = this.typeHeaders.fullCollection.find(function(obj) {
                     return obj.get("name") === that.options.value.type
                 });
-
                 if (dataFound) {
                     if ((this.typeId && this.typeId !== dataFound.get("guid")) || this.typeId === null) {
                         if (this.typeId) {
diff --git a/dashboardv3/public/js/views/search/tree/GlossaryTreeLayoutView.js b/dashboardv3/public/js/views/search/tree/GlossaryTreeLayoutView.js
index 72969bf..523d23e 100644
--- a/dashboardv3/public/js/views/search/tree/GlossaryTreeLayoutView.js
+++ b/dashboardv3/public/js/views/search/tree/GlossaryTreeLayoutView.js
@@ -74,6 +74,7 @@ define([
 
             events["click " + this.ui.showGlossaryType] = function(e) {
                 var getTreeData, displayText;
+                e.stopPropagation();
                 this.isTermView = !this.isTermView;
                 this.glossarySwitchBtnUpdate();
             };
@@ -93,6 +94,12 @@ define([
                 },
                 this
             );
+            if (this.options.categoryEvent) {
+                this.options.categoryEvent.on("Success:TermRename", function(options) {
+                    that.refresh();
+                })
+            }
+
             $('body').on('click', '.termPopoverOptions li, .categoryPopoverOptions li', function(e) {
                 that.$('.termPopover,.categoryPopover').popover('hide');
                 that[$(this).find('a').data('fn')](e)
@@ -103,6 +110,7 @@ define([
             this.ui.showGlossaryType.attr("data-original-title", (this.isTermView ? "Show Category" : "Show Term"));
             this.ui.showGlossaryType.tooltip('hide');
             this.ui.showGlossaryType.find("i").toggleClass("switch-button");
+            // this.ui.showGlossaryType.find("span").html(this.isTermView ? "Show Category" : "Show Term");
             this.ui.termSearchTree.jstree(true).refresh();
             //this.showDefaultPage();
             // if(this.isTermView){
@@ -146,6 +154,10 @@ define([
             this.fetchGlossary();
 
         },
+
+        onBeforeDestroy: function() {
+            this.options.categoryEvent.off("Success:TermRename")
+        },
         getViewType: function() {
             if (this.options.value) {
                 this.isTermView = this.options.value.viewType ? this.options.value.viewType == "term" ? true : false : true;