You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@atlas.apache.org by kb...@apache.org on 2020/03/19 12:23:59 UTC
[atlas] branch branch-2.0 updated: ATLAS-3668 : UI: Sorting not
working as expected for all the table
This is an automated email from the ASF dual-hosted git repository.
kbhatt 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 8e46ee1 ATLAS-3668 : UI: Sorting not working as expected for all the table
8e46ee1 is described below
commit 8e46ee1302003be1b587e9f6153166390c473ca4
Author: kevalbhatt <kb...@apache.org>
AuthorDate: Thu Mar 19 13:36:50 2020 +0530
ATLAS-3668 : UI: Sorting not working as expected for all the table
(cherry picked from commit 9647c913c1ae7c175c45933a51fd96c0fb168897)
---
dashboardv2/public/js/collection/BaseCollection.js | 5 ++-
dashboardv2/public/js/utils/Overrides.js | 5 ++-
dashboardv2/public/js/utils/TableLayout.js | 45 +++++++++++++++++-----
.../js/views/search/SearchResultLayoutView.js | 5 ++-
.../js/views/tag/TagDetailTableLayoutView.js | 2 +-
dashboardv3/public/js/collection/BaseCollection.js | 5 ++-
dashboardv3/public/js/utils/Overrides.js | 5 ++-
dashboardv3/public/js/utils/TableLayout.js | 45 +++++++++++++++++-----
.../js/views/search/SearchResultLayoutView.js | 5 ++-
.../js/views/tag/TagDetailTableLayoutView.js | 2 +-
10 files changed, 92 insertions(+), 32 deletions(-)
diff --git a/dashboardv2/public/js/collection/BaseCollection.js b/dashboardv2/public/js/collection/BaseCollection.js
index 5413f40..23bd89a 100644
--- a/dashboardv2/public/js/collection/BaseCollection.js
+++ b/dashboardv2/public/js/collection/BaseCollection.js
@@ -113,7 +113,7 @@ define(['require',
/** BaseCollection's Static Attributes */
{
// Static functions
- getTableCols: function(cols, collection) {
+ getTableCols: function(cols, collection, defaultSortDirection) {
var retCols = _.map(cols, function(v, k, l) {
var defaults = collection.constructor.tableCols[k];
if (!defaults) {
@@ -121,7 +121,8 @@ define(['require',
defaults = {};
}
return _.extend({
- 'name': k
+ 'name': k,
+ direction: defaultSortDirection ? defaultSortDirection : null,
}, defaults, v);
});
return retCols;
diff --git a/dashboardv2/public/js/utils/Overrides.js b/dashboardv2/public/js/utils/Overrides.js
index 1b0947b..ae61f09 100644
--- a/dashboardv2/public/js/utils/Overrides.js
+++ b/dashboardv2/public/js/utils/Overrides.js
@@ -55,7 +55,10 @@ define(['require', 'utils/Utils', 'marionette', 'backgrid', 'asBreadcrumbs', 'jq
return this.charAt(0).toUpperCase() + this.slice(1);
}
-
+ /*
+ * Overriding default sortType
+ */
+ Backgrid.Column.prototype.defaults.sortType = "toggle";
/*
* Overriding Cell for adding custom className to Cell i.e <td>
diff --git a/dashboardv2/public/js/utils/TableLayout.js b/dashboardv2/public/js/utils/TableLayout.js
index 4077864..b451041 100644
--- a/dashboardv2/public/js/utils/TableLayout.js
+++ b/dashboardv2/public/js/utils/TableLayout.js
@@ -149,6 +149,20 @@ define(['require',
includeAtlasTableSorting: false,
+ showDefaultTableSorted: false,
+
+ /**
+ * [updateFullCollectionManually If collection was updated using silent true
+ * then need to update FullCollection Manually for correct sorting experience]
+ * @type {Boolean}
+ */
+ updateFullCollectionManually: false,
+
+ sortOpts: {
+ sortColumn: "name",
+ sortDirection: "ascending"
+ },
+
/** ui events hash */
events: function() {
@@ -183,26 +197,29 @@ define(['require',
initialize: function(options) {
this.limit = 25;
this.offset = 0;
- _.extend(this, _.omit(options, 'gridOpts', 'atlasPaginationOpts'));
+ _.extend(this, _.omit(options, 'gridOpts', 'sortOpts', 'atlasPaginationOpts'));
_.extend(this, options.atlasPaginationOpts);
_.extend(this.gridOpts, options.gridOpts, { collection: this.collection, columns: this.columns });
+ _.extend(this.sortOpts, options.sortOpts);
if (this.includeAtlasTableSorting) {
var oldSortingRef = this.collection.setSorting;
this.collection.setSorting = function() {
this.state.pageSize = this.length
var val = oldSortingRef.apply(this, arguments);
- val.fullCollection.models.sort();
+ val.fullCollection.sort();
this.comparator = function(next, previous, data) {
var getValue = function(options) {
-
var next = options.next,
previous = options.previous,
order = options.order;
-
- if (order === -1) {
- return next < previous ? -1 : 1;
+ if (next === previous) {
+ return null;
} else {
- return next < previous ? 1 : -1;
+ if (order === -1) {
+ return next < previous ? -1 : 1;
+ } else {
+ return next < previous ? 1 : -1;
+ }
}
}
if (val.state && (!_.isNull(val.state.sortKey))) {
@@ -263,11 +280,14 @@ define(['require',
removeCellDirection function - removes "ascending" and "descending"
which in turn removes chevrons from every 'sortable' header-cells*/
this.listenTo(this.collection, "backgrid:sorted", function(column, direction, collection) {
+ // backgrid:sorted fullCollection trigger required for icon chage
this.collection.fullCollection.trigger("backgrid:sorted", column, direction, collection)
+ if (this.includeAtlasTableSorting && this.updateFullCollectionManually) {
+ this.collection.fullCollection.reset(collection.toJSON(), { silent: true });
+ }
}, this);
this.listenTo(this, "grid:refresh", function() {
if (this.grid) {
- this.grid.collection.fullCollection.reset(this.collection.entities, { silent: true });
this.grid.trigger("backgrid:refresh");
}
});
@@ -337,8 +357,13 @@ define(['require',
this.grid = new Backgrid.Grid(this.gridOpts).on('backgrid:rendered', function() {
that.trigger('backgrid:manual:rendered', this)
});
-
- this.rTableList.show(this.grid);
+ if (this.showDefaultTableSorted) {
+ this.grid.render();
+ this.grid.sort(this.sortOpts.sortColumn, this.sortOpts.sortDirection);
+ this.rTableList.show(this.grid);
+ } else {
+ this.rTableList.show(this.grid);
+ }
},
onShow: function() {
if (this.includeSizeAbleColumns) {
diff --git a/dashboardv2/public/js/views/search/SearchResultLayoutView.js b/dashboardv2/public/js/views/search/SearchResultLayoutView.js
index 62c7ecd..ac78e89 100644
--- a/dashboardv2/public/js/views/search/SearchResultLayoutView.js
+++ b/dashboardv2/public/js/views/search/SearchResultLayoutView.js
@@ -255,6 +255,8 @@ define(['require',
includeSizeAbleColumns: false,
includeTableLoader: false,
includeAtlasTableSorting: true,
+ showDefaultTableSorted: true,
+ updateFullCollectionManually: true,
columnOpts: {
opts: {
initialColumnsVisible: null,
@@ -436,9 +438,8 @@ define(['require',
attributeObject: dataOrCollection.entities,
referredEntities: dataOrCollection.referredEntities
});
- that.searchCollection.referredEntities = dataOrCollection.referredEntities;
- that.searchCollection.entities = dataOrCollection.entities;
that.searchCollection.reset(dataOrCollection.entities, { silent: true });
+ that.searchCollection.fullCollection.reset(dataOrCollection.entities, { silent: true });
}
diff --git a/dashboardv2/public/js/views/tag/TagDetailTableLayoutView.js b/dashboardv2/public/js/views/tag/TagDetailTableLayoutView.js
index 3f17d94..6207b42 100644
--- a/dashboardv2/public/js/views/tag/TagDetailTableLayoutView.js
+++ b/dashboardv2/public/js/views/tag/TagDetailTableLayoutView.js
@@ -116,7 +116,7 @@ define(['require',
col = {};
return this.tagCollection.constructor.getTableCols({
- tag: {
+ typeName: {
label: "Classification",
cell: "html",
editable: false,
diff --git a/dashboardv3/public/js/collection/BaseCollection.js b/dashboardv3/public/js/collection/BaseCollection.js
index 0c9e912..30f5b76 100644
--- a/dashboardv3/public/js/collection/BaseCollection.js
+++ b/dashboardv3/public/js/collection/BaseCollection.js
@@ -113,7 +113,7 @@ define(['require',
/** BaseCollection's Static Attributes */
{
// Static functions
- getTableCols: function(cols, collection) {
+ getTableCols: function(cols, collection, defaultSortDirection) {
var retCols = _.map(cols, function(v, k, l) {
var defaults = collection.constructor.tableCols[k];
if (!defaults) {
@@ -121,7 +121,8 @@ define(['require',
defaults = {};
}
return _.extend({
- 'name': k
+ 'name': k,
+ direction: defaultSortDirection ? defaultSortDirection : null,
}, defaults, v);
});
return retCols;
diff --git a/dashboardv3/public/js/utils/Overrides.js b/dashboardv3/public/js/utils/Overrides.js
index 26808e4..44ed62b 100644
--- a/dashboardv3/public/js/utils/Overrides.js
+++ b/dashboardv3/public/js/utils/Overrides.js
@@ -55,7 +55,10 @@ define(['require', 'utils/Utils', 'marionette', 'backgrid', 'asBreadcrumbs', 'jq
return this.charAt(0).toUpperCase() + this.slice(1);
}
-
+ /*
+ * Overriding default sortType
+ */
+ Backgrid.Column.prototype.defaults.sortType = "toggle";
/*
* Overriding Cell for adding custom className to Cell i.e <td>
diff --git a/dashboardv3/public/js/utils/TableLayout.js b/dashboardv3/public/js/utils/TableLayout.js
index 4077864..b451041 100644
--- a/dashboardv3/public/js/utils/TableLayout.js
+++ b/dashboardv3/public/js/utils/TableLayout.js
@@ -149,6 +149,20 @@ define(['require',
includeAtlasTableSorting: false,
+ showDefaultTableSorted: false,
+
+ /**
+ * [updateFullCollectionManually If collection was updated using silent true
+ * then need to update FullCollection Manually for correct sorting experience]
+ * @type {Boolean}
+ */
+ updateFullCollectionManually: false,
+
+ sortOpts: {
+ sortColumn: "name",
+ sortDirection: "ascending"
+ },
+
/** ui events hash */
events: function() {
@@ -183,26 +197,29 @@ define(['require',
initialize: function(options) {
this.limit = 25;
this.offset = 0;
- _.extend(this, _.omit(options, 'gridOpts', 'atlasPaginationOpts'));
+ _.extend(this, _.omit(options, 'gridOpts', 'sortOpts', 'atlasPaginationOpts'));
_.extend(this, options.atlasPaginationOpts);
_.extend(this.gridOpts, options.gridOpts, { collection: this.collection, columns: this.columns });
+ _.extend(this.sortOpts, options.sortOpts);
if (this.includeAtlasTableSorting) {
var oldSortingRef = this.collection.setSorting;
this.collection.setSorting = function() {
this.state.pageSize = this.length
var val = oldSortingRef.apply(this, arguments);
- val.fullCollection.models.sort();
+ val.fullCollection.sort();
this.comparator = function(next, previous, data) {
var getValue = function(options) {
-
var next = options.next,
previous = options.previous,
order = options.order;
-
- if (order === -1) {
- return next < previous ? -1 : 1;
+ if (next === previous) {
+ return null;
} else {
- return next < previous ? 1 : -1;
+ if (order === -1) {
+ return next < previous ? -1 : 1;
+ } else {
+ return next < previous ? 1 : -1;
+ }
}
}
if (val.state && (!_.isNull(val.state.sortKey))) {
@@ -263,11 +280,14 @@ define(['require',
removeCellDirection function - removes "ascending" and "descending"
which in turn removes chevrons from every 'sortable' header-cells*/
this.listenTo(this.collection, "backgrid:sorted", function(column, direction, collection) {
+ // backgrid:sorted fullCollection trigger required for icon chage
this.collection.fullCollection.trigger("backgrid:sorted", column, direction, collection)
+ if (this.includeAtlasTableSorting && this.updateFullCollectionManually) {
+ this.collection.fullCollection.reset(collection.toJSON(), { silent: true });
+ }
}, this);
this.listenTo(this, "grid:refresh", function() {
if (this.grid) {
- this.grid.collection.fullCollection.reset(this.collection.entities, { silent: true });
this.grid.trigger("backgrid:refresh");
}
});
@@ -337,8 +357,13 @@ define(['require',
this.grid = new Backgrid.Grid(this.gridOpts).on('backgrid:rendered', function() {
that.trigger('backgrid:manual:rendered', this)
});
-
- this.rTableList.show(this.grid);
+ if (this.showDefaultTableSorted) {
+ this.grid.render();
+ this.grid.sort(this.sortOpts.sortColumn, this.sortOpts.sortDirection);
+ this.rTableList.show(this.grid);
+ } else {
+ this.rTableList.show(this.grid);
+ }
},
onShow: function() {
if (this.includeSizeAbleColumns) {
diff --git a/dashboardv3/public/js/views/search/SearchResultLayoutView.js b/dashboardv3/public/js/views/search/SearchResultLayoutView.js
index afd3ab8..4a24c9d 100644
--- a/dashboardv3/public/js/views/search/SearchResultLayoutView.js
+++ b/dashboardv3/public/js/views/search/SearchResultLayoutView.js
@@ -264,6 +264,8 @@ define(['require',
includeSizeAbleColumns: false,
includeTableLoader: false,
includeAtlasTableSorting: true,
+ showDefaultTableSorted: true,
+ updateFullCollectionManually: true,
columnOpts: {
opts: {
initialColumnsVisible: null,
@@ -445,9 +447,8 @@ define(['require',
attributeObject: dataOrCollection.entities,
referredEntities: dataOrCollection.referredEntities
});
- that.searchCollection.referredEntities = dataOrCollection.referredEntities;
- that.searchCollection.entities = dataOrCollection.entities;
that.searchCollection.reset(dataOrCollection.entities, { silent: true });
+ that.searchCollection.fullCollection.reset(dataOrCollection.entities, { silent: true });
}
diff --git a/dashboardv3/public/js/views/tag/TagDetailTableLayoutView.js b/dashboardv3/public/js/views/tag/TagDetailTableLayoutView.js
index 8844995..210b435 100644
--- a/dashboardv3/public/js/views/tag/TagDetailTableLayoutView.js
+++ b/dashboardv3/public/js/views/tag/TagDetailTableLayoutView.js
@@ -116,7 +116,7 @@ define(['require',
col = {};
return this.tagCollection.constructor.getTableCols({
- tag: {
+ typeName: {
label: "Classification",
cell: "html",
editable: false,