You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@superset.apache.org by hu...@apache.org on 2021/12/02 17:49:04 UTC
[superset] branch master updated: refactor: Add AutoSizer to react-virtualized `Grid` (#17606)
This is an automated email from the ASF dual-hosted git repository.
hugh pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/superset.git
The following commit(s) were added to refs/heads/master by this push:
new d9e9c3a refactor: Add AutoSizer to react-virtualized `Grid` (#17606)
d9e9c3a is described below
commit d9e9c3a3de2ec5fe90c613ac06ad2a5606c43ece
Author: Hugh A. Miles II <hu...@gmail.com>
AuthorDate: Thu Dec 2 09:47:47 2021 -0800
refactor: Add AutoSizer to react-virtualized `Grid` (#17606)
* remove styles from renderCell
* remove styling on grid
---
.../components/FilterableTable/FilterableTable.tsx | 68 +++++++++++-----------
1 file changed, 34 insertions(+), 34 deletions(-)
diff --git a/superset-frontend/src/components/FilterableTable/FilterableTable.tsx b/superset-frontend/src/components/FilterableTable/FilterableTable.tsx
index 9714907..46ceab4 100644
--- a/superset-frontend/src/components/FilterableTable/FilterableTable.tsx
+++ b/superset-frontend/src/components/FilterableTable/FilterableTable.tsx
@@ -20,6 +20,7 @@ import JSONbig from 'json-bigint';
import React, { PureComponent } from 'react';
import JSONTree from 'react-json-tree';
import {
+ AutoSizer,
Column,
Grid,
ScrollSync,
@@ -58,8 +59,8 @@ function safeJsonObjectParse(
}
}
-const SCROLL_BAR_HEIGHT = 15;
const GRID_POSITION_ADJUSTMENT = 4;
+const SCROLL_BAR_HEIGHT = 15;
const JSON_TREE_THEME = {
scheme: 'monokai',
author: 'wimer hazenberg (http://www.monokai.nl)',
@@ -479,39 +480,38 @@ export default class FilterableTable extends PureComponent<
return (
<StyledFilterableTable>
<ScrollSync>
- {({ onScroll, scrollTop }) => (
- <div
- className="filterable-table-container Table"
- data-test="filterable-table-container"
- ref={this.container}
- >
- <div className="LeftColumn">
- <Grid
- cellRenderer={this.renderGridCellHeader}
- columnCount={orderedColumnKeys.length}
- columnWidth={getColumnWidth}
- height={rowHeight}
- rowCount={1}
- rowHeight={rowHeight}
- scrollTop={scrollTop}
- width={this.totalTableWidth}
- />
- </div>
- <div className="RightColumn">
- <Grid
- cellRenderer={this.renderGridCell}
- columnCount={orderedColumnKeys.length}
- columnWidth={getColumnWidth}
- height={totalTableHeight - rowHeight}
- onScroll={onScroll}
- overscanColumnCount={overscanColumnCount}
- overscanRowCount={overscanRowCount}
- rowCount={this.list.length}
- rowHeight={rowHeight}
- width={this.totalTableWidth}
- />
- </div>
- </div>
+ {({ onScroll, scrollLeft }) => (
+ <>
+ <AutoSizer disableHeight>
+ {({ width }) => (
+ <div>
+ <Grid
+ cellRenderer={this.renderGridCellHeader}
+ columnCount={orderedColumnKeys.length}
+ columnWidth={getColumnWidth}
+ height={rowHeight}
+ rowCount={1}
+ rowHeight={rowHeight}
+ scrollLeft={scrollLeft}
+ width={width}
+ style={{ overflow: 'hidden' }}
+ />
+ <Grid
+ cellRenderer={this.renderGridCell}
+ columnCount={orderedColumnKeys.length}
+ columnWidth={getColumnWidth}
+ height={totalTableHeight - rowHeight}
+ onScroll={onScroll}
+ overscanColumnCount={overscanColumnCount}
+ overscanRowCount={overscanRowCount}
+ rowCount={this.list.length}
+ rowHeight={rowHeight}
+ width={width}
+ />
+ </div>
+ )}
+ </AutoSizer>
+ </>
)}
</ScrollSync>
</StyledFilterableTable>