diff --git a/src/components/src/common/data-table/index.tsx b/src/components/src/common/data-table/index.tsx index a0aa4a9572..917243864a 100644 --- a/src/components/src/common/data-table/index.tsx +++ b/src/components/src/common/data-table/index.tsx @@ -422,6 +422,7 @@ function DataTableFactory(HeaderCell: ReturnType) { pinnedGrid: HTMLDivElement | null = null; unpinnedGrid: HTMLDivElement | null = null; + hasMounted = false; state: DataTableState = { cellSizeCache: {}, @@ -430,6 +431,7 @@ function DataTableFactory(HeaderCell: ReturnType) { }; componentDidMount() { + this.hasMounted = true; window.addEventListener('resize', this.scaleCellsToWidth); this.scaleCellsToWidth(); } @@ -444,11 +446,9 @@ function DataTableFactory(HeaderCell: ReturnType) { } componentWillUnmount() { + this.hasMounted = false; window.removeEventListener('resize', this.scaleCellsToWidth); // fix Warning: Can't perform a React state update on an unmounted component - this.setState = () => { - return; - }; } root = createRef(); @@ -458,12 +458,16 @@ function DataTableFactory(HeaderCell: ReturnType) { !Array.isArray(pinnedColumns) ? columns : columns.filter(c => !pinnedColumns.includes(c)) ); - toggleMoreOptions = moreOptionsColumn => - this.setState({ - moreOptionsColumn: - this.state.moreOptionsColumn === moreOptionsColumn ? null : moreOptionsColumn - }); - toggleShowStats = () => this.setState({showStats: !this.state.showStats}); + toggleMoreOptions = moreOptionsColumn => { + if (this.hasMounted) + this.setState({ + moreOptionsColumn: + this.state.moreOptionsColumn === moreOptionsColumn ? null : moreOptionsColumn + }); + }; + toggleShowStats = () => { + if (this.hasMounted) this.setState({showStats: !this.state.showStats}); + }; getCellSizeCache = () => { const {cellSizeCache: propsCache = {}, fixedWidth, pinnedColumns = []} = this.props; const unpinnedColumns = this.unpinnedColumns(this.props); @@ -486,7 +490,7 @@ function DataTableFactory(HeaderCell: ReturnType) { }; doScaleCellsToWidth = () => { - this.setState(this.getCellSizeCache()); + if (this.hasMounted) this.setState(this.getCellSizeCache()); }; scaleCellsToWidth = debounce(this.doScaleCellsToWidth, 300); diff --git a/src/components/src/common/portaled.tsx b/src/components/src/common/portaled.tsx index 05e5acb444..eaefff318a 100644 --- a/src/components/src/common/portaled.tsx +++ b/src/components/src/common/portaled.tsx @@ -168,6 +168,7 @@ class Portaled extends Component { _unmounted = false; componentDidMount() { + this._unmounted = false; // relative this.unsubscribe = subscribe(this.handleScroll); this.handleScroll();