This is an automated email from the ASF dual-hosted git repository.
beto pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/incubator-superset.git
The following commit(s) were added to refs/heads/master by this push:
new 34ca2ae Truncate data that is expanded (#7777)
34ca2ae is described below
commit 34ca2aefbe3f7046d94cab217826b74cdb09ca99
Author: Beto Dealmeida <[email protected]>
AuthorDate: Mon Jul 1 10:36:40 2019 -0700
Truncate data that is expanded (#7777)
* Truncate data that is expanded
* Fix object check
* Small optimizations
---
.../components/FilterableTable/FilterableTable.jsx | 51 +++++++++++++++++-----
superset/db_engine_specs/presto.py | 2 +-
2 files changed, 40 insertions(+), 13 deletions(-)
diff --git a/superset/assets/src/components/FilterableTable/FilterableTable.jsx
b/superset/assets/src/components/FilterableTable/FilterableTable.jsx
index ef5bcd7..e68c998 100644
--- a/superset/assets/src/components/FilterableTable/FilterableTable.jsx
+++ b/superset/assets/src/components/FilterableTable/FilterableTable.jsx
@@ -115,6 +115,7 @@ export default class FilterableTable extends PureComponent {
super(props);
this.list = List(this.formatTableData(props.data));
this.addJsonModal = this.addJsonModal.bind(this);
+ this.getCellContent = this.getCellContent.bind(this);
this.renderGridCell = this.renderGridCell.bind(this);
this.renderGridCellHeader = this.renderGridCellHeader.bind(this);
this.renderGrid = this.renderGrid.bind(this);
@@ -124,6 +125,13 @@ export default class FilterableTable extends PureComponent
{
this.rowClassName = this.rowClassName.bind(this);
this.sort = this.sort.bind(this);
+ // columns that have complex type and were expanded into sub columns
+ this.complexColumns = props.orderedColumnKeys
+ .reduce((obj, key) => ({
+ ...obj,
+ [key]: props.expandedColumns.some(name => name.startsWith(key + '.')),
+ }), {});
+
this.widthsForColumnsByKey = this.getWidthsForColumns();
this.totalTableWidth = props.orderedColumnKeys
.map(key => this.widthsForColumnsByKey[key])
@@ -152,21 +160,30 @@ export default class FilterableTable extends
PureComponent {
const widthsByColumnKey = {};
this.props.orderedColumnKeys.forEach((key) => {
const colWidths = this.list
- .map(d => getTextWidth(d[key]) + PADDING) // get width for each value
for a key
- .push(getTextWidth(key) + PADDING); // add width of column key to end
of list
+ // get width for each value for a key
+ .map(d => getTextWidth(
+ this.getCellContent({ cellData: d[key], columnKey: key })) + PADDING,
+ )
+ // add width of column key to end of list
+ .push(getTextWidth(key) + PADDING);
// set max width as value for key
widthsByColumnKey[key] = Math.max(...colWidths);
});
return widthsByColumnKey;
}
- fitTableToWidthIfNeeded() {
- const containerWidth = this.container.clientWidth;
- if (this.totalTableWidth < containerWidth) {
- // fit table width if content doesn't fill the width of the container
- this.totalTableWidth = containerWidth;
+ getCellContent({ cellData, columnKey }) {
+ const content = String(cellData);
+ const firstCharacter = content.substring(0, 1);
+ let truncated;
+ if (firstCharacter === '[') {
+ truncated = '[…]';
+ } else if (firstCharacter === '{') {
+ truncated = '{…}';
+ } else {
+ truncated = '';
}
- this.setState({ fitted: true });
+ return this.complexColumns[columnKey] ? truncated : content;
}
formatTableData(data) {
@@ -213,6 +230,15 @@ export default class FilterableTable extends PureComponent
{
this.setState({ sortBy, sortDirection });
}
+ fitTableToWidthIfNeeded() {
+ const containerWidth = this.container.clientWidth;
+ if (this.totalTableWidth < containerWidth) {
+ // fit table width if content doesn't fill the width of the container
+ this.totalTableWidth = containerWidth;
+ }
+ this.setState({ fitted: true });
+ }
+
addJsonModal(node, jsonObject, jsonString) {
return (
<ModalTrigger
@@ -260,13 +286,14 @@ export default class FilterableTable extends
PureComponent {
renderGridCell({ columnIndex, key, rowIndex, style }) {
const columnKey = this.props.orderedColumnKeys[columnIndex];
const cellData = this.list.get(rowIndex)[columnKey];
+ const content = this.getCellContent({ cellData, columnKey });
const cellNode = (
<div
key={key}
style={{ ...style, top: style.top - GRID_POSITION_ADJUSTMENT }}
className={`grid-cell ${this.rowClassName({ index: rowIndex })}`}
>
- {cellData}
+ {content}
</div>
);
@@ -332,8 +359,8 @@ export default class FilterableTable extends PureComponent {
);
}
- renderTableCell({ cellData }) {
- const cellNode = String(cellData);
+ renderTableCell({ cellData, columnKey }) {
+ const cellNode = this.getCellContent({ cellData, columnKey });
const jsonObject = safeJsonObjectParse(cellData);
if (jsonObject) {
return this.addJsonModal(cellNode, jsonObject, cellData);
@@ -396,7 +423,7 @@ export default class FilterableTable extends PureComponent {
>
{orderedColumnKeys.map(columnKey => (
<Column
- cellRenderer={this.renderTableCell}
+ cellRenderer={({ cellData }) => this.renderTableCell({
cellData, columnKey })}
dataKey={columnKey}
disableSort={false}
headerRenderer={this.renderTableHeader}
diff --git a/superset/db_engine_specs/presto.py
b/superset/db_engine_specs/presto.py
index 63171f3..6d6678b 100644
--- a/superset/db_engine_specs/presto.py
+++ b/superset/db_engine_specs/presto.py
@@ -591,7 +591,7 @@ class PrestoEngineSpec(BaseEngineSpec):
{'ColumnA': [1, 2], 'ColumnB': [3]},
{'ColumnA': [11, 22], 'ColumnB': [33]}
]
- all_array_data (intially) = {
+ all_array_data (initially) = {
0: [{'ColumnA': [1, 2], 'ColumnB': [3}],
1: [{'ColumnA': [11, 22], 'ColumnB': [33]}]
}
