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/11/23 19:26:32 UTC
[superset] branch hugh/sqllab-grid created (now d124960)
This is an automated email from the ASF dual-hosted git repository.
hugh pushed a change to branch hugh/sqllab-grid
in repository https://gitbox.apache.org/repos/asf/superset.git.
at d124960 init
This branch includes the following new commits:
new d124960 init
The 1 revisions listed above as "new" are entirely new to this
repository and will be described in separate emails. The revisions
listed as "add" were already present in the repository and have only
been added to this reference.
[superset] 01/01: init
Posted by hu...@apache.org.
This is an automated email from the ASF dual-hosted git repository.
hugh pushed a commit to branch hugh/sqllab-grid
in repository https://gitbox.apache.org/repos/asf/superset.git
commit d124960e7131c715abf74f29fe1839eb50a77fe8
Author: hughhhh <hu...@gmail.com>
AuthorDate: Tue Nov 23 11:24:32 2021 -0800
init
---
.../components/FilterableTable/FilterableTable.tsx | 91 ++++++++--------------
1 file changed, 31 insertions(+), 60 deletions(-)
diff --git a/superset-frontend/src/components/FilterableTable/FilterableTable.tsx b/superset-frontend/src/components/FilterableTable/FilterableTable.tsx
index 9714907..4711b44 100644
--- a/superset-frontend/src/components/FilterableTable/FilterableTable.tsx
+++ b/superset-frontend/src/components/FilterableTable/FilterableTable.tsx
@@ -22,7 +22,7 @@ import JSONTree from 'react-json-tree';
import {
Column,
Grid,
- ScrollSync,
+ AutoSizer,
SortDirection,
SortDirectionType,
SortIndicator,
@@ -424,24 +424,21 @@ export default class FilterableTable extends PureComponent<
rowIndex: number;
style: React.CSSProperties;
}) {
+ // if (rowIndex === 0) {
+ // return (
+ // <div key={key} style={style}>
+ // header
+ // </div>
+ // );
+ // }
+
const columnKey = this.props.orderedColumnKeys[columnIndex];
const cellData = this.list[rowIndex][columnKey];
- const cellText = this.getCellContent({ cellData, columnKey });
- const content =
- cellData === null ? <i className="text-muted">{cellText}</i> : cellText;
+
+ // TODO: handle NULL cases
const cellNode = (
- <div
- key={key}
- style={{
- ...style,
- top:
- typeof style.top === 'number'
- ? style.top - GRID_POSITION_ADJUSTMENT
- : style.top,
- }}
- className={`grid-cell ${this.rowClassName({ index: rowIndex })}`}
- >
- <div css={{ width: 'inherit' }}>{content}</div>
+ <div key={key} style={style}>
+ {this.getCellContent({ cellData, columnKey })}
</div>
);
@@ -453,12 +450,7 @@ export default class FilterableTable extends PureComponent<
}
renderGrid() {
- const {
- orderedColumnKeys,
- overscanColumnCount,
- overscanRowCount,
- rowHeight,
- } = this.props;
+ const { orderedColumnKeys, rowHeight } = this.props;
let { height } = this.props;
let totalTableHeight = height;
@@ -475,46 +467,25 @@ export default class FilterableTable extends PureComponent<
const getColumnWidth = ({ index }: { index: number }) =>
this.widthsForColumnsByKey[orderedColumnKeys[index]];
+ const { innerWidth: width, innerHeight } = window;
+ console.log('width', width);
+ console.log('length', innerHeight);
+
// fix height of filterable table
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>
- )}
- </ScrollSync>
- </StyledFilterableTable>
+ <AutoSizer>
+ {({ width }) => (
+ <Grid
+ cellRenderer={this.renderGridCell}
+ columnCount={orderedColumnKeys.length}
+ columnWidth={getColumnWidth}
+ rowCount={this.list.length}
+ rowHeight={rowHeight}
+ height={totalTableHeight}
+ width={width}
+ />
+ )}
+ </AutoSizer>
);
}