pt/superset
1
0
Fork 0
mirror of https://github.com/apache/superset.git synced 2024-09-12 08:39:45 -04:00
Code Issues Packages Projects Releases Wiki Activity

Added better display of NULL values in FilterableTable (as in SQL Lab Results) (#8003)

Browse Source 
* Added better display of NULL values in FilterableTable (Reults table as in SQL Lab results) and changed sorting order so that NULL values always come last

* fixed syntax according to elint recommendations

* changed code style and logic in getContentCell according to @etr2460 code review

* remvoved 'null-cell' class and replaced it with 'text-muted' as per @mistercrunch review
This commit is contained in:
semantiDan 2019-08-09 19:07:59 +03:00 committed by Ville Brofeldt
parent 9233a63a16
commit aebffe0b44
1 changed files with 27 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
superset/assets/src/components/FilterableTable/FilterableTable.jsx
View File

@ -121,6 +121,7 @@ export default class FilterableTable extends PureComponent {
this.renderGrid = this.renderGrid.bind(this); this.renderGrid = this.renderGrid.bind(this);
this.renderTableCell = this.renderTableCell.bind(this); this.renderTableCell = this.renderTableCell.bind(this);
this.renderTableHeader = this.renderTableHeader.bind(this); this.renderTableHeader = this.renderTableHeader.bind(this);
this.sortResults = this.sortResults.bind(this);
this.renderTable = this.renderTable.bind(this); this.renderTable = this.renderTable.bind(this);
this.rowClassName = this.rowClassName.bind(this); this.rowClassName = this.rowClassName.bind(this);
this.sort = this.sort.bind(this); this.sort = this.sort.bind(this);
@ -173,6 +174,13 @@ export default class FilterableTable extends PureComponent {
} }
getCellContent({ cellData, columnKey }) { getCellContent({ cellData, columnKey }) {
if (cellData === null) {
return (
<i className="text-muted">
NULL
</i>
);
}
const content = String(cellData); const content = String(cellData);
const firstCharacter = content.substring(0, 1); const firstCharacter = content.substring(0, 1);
let truncated; let truncated;
@ -194,7 +202,7 @@ export default class FilterableTable extends PureComponent {
if (['string', 'number'].indexOf(typeof (val)) >= 0) { if (['string', 'number'].indexOf(typeof (val)) >= 0) {
newRow[k] = val; newRow[k] = val;
} else { } else {
newRow[k] = JSONbig.stringify(val); newRow[k] = val === null ? null : JSONbig.stringify(val);
} }
} }
return newRow; return newRow;
@ -250,6 +258,23 @@ export default class FilterableTable extends PureComponent {
); );
} }
sortResults(sortBy, descending) {
return (a, b) => {
if (a[sortBy] === b[sortBy]) {
// equal items sort equally
return 0;
} else if (a[sortBy] === null) {
// nulls sort after anything else
return 1;
} else if (b[sortBy] === null) {
return -1;
} else if (descending) {
return a[sortBy] < b[sortBy] ? 1 : -1;
}
return a[sortBy] < b[sortBy] ? -1 : 1;
};
}
renderTableHeader({ dataKey, label, sortBy, sortDirection }) { renderTableHeader({ dataKey, label, sortBy, sortDirection }) {
const className = this.props.expandedColumns.indexOf(label) > -1 const className = this.props.expandedColumns.indexOf(label) > -1
? 'header-style-disabled' ? 'header-style-disabled'
@ -386,8 +411,7 @@ export default class FilterableTable extends PureComponent {
// sort list // sort list
if (sortBy) { if (sortBy) {
sortedAndFilteredList = sortedAndFilteredList sortedAndFilteredList = sortedAndFilteredList
.sortBy(item => item[sortBy]) .sort(this.sortResults(sortBy, sortDirection === SortDirection.DESC));
.update(list => sortDirection === SortDirection.DESC ? list.reverse() : list);
} }
let { height } = this.props; let { height } = this.props;