Skip to content

Commit 768138e

Browse files
authored
Fix/expanded table broken on performance tuning (#17)
* Fixed expanded row bugs * v1.0.0-alpha.1 * Build example
1 parent d56a39f commit 768138e

File tree

7 files changed

+38
-23
lines changed

7 files changed

+38
-23
lines changed

dist/react-table.css

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

dist/react-table.min.css

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

docs/bundle.js

Lines changed: 15 additions & 7 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

docs/index.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,5 +11,5 @@
1111
</head>
1212
<body>
1313
<div id="container"></div>
14-
<script type="text/javascript" src="bundle.js?570dfb83ca72ff7c6f74"></script></body>
14+
<script type="text/javascript" src="bundle.js?e432a8c896f1da9b2c01"></script></body>
1515
</html>

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@trendmicro/react-table",
3-
"version": "1.0.0-alpha",
3+
"version": "1.0.0-alpha.1",
44
"description": "Trend Micro Components: React Table",
55
"main": "lib/index.js",
66
"files": [

src/TableBody.jsx

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,10 @@ class TableBody extends PureComponent {
1919
records: PropTypes.array,
2020
rowClassName: PropTypes.func,
2121
rowKey: PropTypes.oneOfType([PropTypes.string, PropTypes.func]),
22-
scrollTop: PropTypes.number
22+
scrollTop: PropTypes.number,
23+
store: PropTypes.any, // mini-store
24+
tableRole: PropTypes.string, // present fixed left table or normal table
25+
scrollLeft: PropTypes.number // From table body HOC
2326
};
2427

2528
static defaultProps = {
@@ -55,6 +58,7 @@ class TableBody extends PureComponent {
5558
}
5659

5760
onScroll = (e) => {
61+
e.stopPropagation();
5862
const { store, tableRole, scrollLeft } = this.props;
5963
store.setState({
6064
scrollTop: e.target.scrollTop,

src/TableRow.jsx

Lines changed: 14 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,10 @@ class TableRow extends Component {
1919
onHover: PropTypes.func,
2020
onRowClick: PropTypes.func,
2121
record: PropTypes.object,
22-
rowClassName: PropTypes.func
22+
rowClassName: PropTypes.func,
23+
isExpanded: PropTypes.bool,
24+
store: PropTypes.any,
25+
hovered: PropTypes.bool
2326
};
2427

2528
static defaultProps = {
@@ -72,6 +75,8 @@ class TableRow extends Component {
7275
!columnEqual
7376
||
7477
!recordEqual
78+
||
79+
this.props.isExpanded !== nextProps.isExpanded
7580
);
7681
}
7782

@@ -91,13 +96,10 @@ class TableRow extends Component {
9196
rowKey,
9297
rowIndex,
9398
record,
94-
className
99+
className,
100+
isExpanded
95101
} = this.props;
96-
const isRowExpanded = this.isRowExpanded(record, rowKey);
97-
let expandedRowContent;
98-
if (expandedRowRender && isRowExpanded) {
99-
expandedRowContent = expandedRowRender(record, rowIndex);
100-
}
102+
101103
return (
102104
<div
103105
className={cx(
@@ -135,9 +137,9 @@ class TableRow extends Component {
135137
</TableCell>
136138
);
137139
})}
138-
{isRowExpanded &&
140+
{isExpanded && expandedRowRender &&
139141
<div className={styles['tr-expand']}>
140-
{ expandedRowContent }
142+
{expandedRowRender(record, rowIndex)}
141143
</div>
142144
}
143145
</div>
@@ -147,8 +149,9 @@ class TableRow extends Component {
147149

148150
export default connect((state, props) => {
149151
const { currentHoverKey } = state;
150-
const { rowKey } = props;
152+
const { rowKey, expandedRowKeys, expandedRowRender } = props;
151153
return {
152-
hovered: currentHoverKey === rowKey
154+
hovered: currentHoverKey === rowKey,
155+
isExpanded: expandedRowRender && expandedRowKeys.indexOf(rowKey) >= 0
153156
};
154157
})(TableRow);

0 commit comments

Comments
 (0)