Do not empty table when fetching new data

This commit is contained in:
Andrew Nicolaou 2019-09-11 21:13:34 +02:00 committed by Cassie Tarakajian
parent a385b470b2
commit 679304d0ab
1 changed files with 15 additions and 3 deletions

View File

@ -28,6 +28,18 @@ class CollectionList extends React.Component {
this.props.getCollections(this.props.username); this.props.getCollections(this.props.username);
this.props.resetSorting(); this.props.resetSorting();
this._renderFieldHeader = this._renderFieldHeader.bind(this); this._renderFieldHeader = this._renderFieldHeader.bind(this);
this.state = {
hasLoadedData: false,
};
}
componentDidUpdate(prevProps) {
if (prevProps.loading === true && this.props.loading === false) {
this.setState({
hasLoadedData: true,
});
}
} }
getTitle() { getTitle() {
@ -38,11 +50,11 @@ class CollectionList extends React.Component {
} }
hasCollections() { hasCollections() {
return !this.props.loading && this.props.collections.length > 0; return (!this.props.loading || this.state.hasLoadedData) && this.props.collections.length > 0;
} }
_renderLoader() { _renderLoader() {
if (this.props.loading) return <Loader />; if (this.props.loading && !this.state.hasLoadedData) return <Loader />;
return null; return null;
} }
@ -78,7 +90,7 @@ class CollectionList extends React.Component {
const username = this.props.username !== undefined ? this.props.username : this.props.user.username; const username = this.props.username !== undefined ? this.props.username : this.props.user.username;
return ( return (
<div className="sketches-table-container"> <div className={`sketches-table-container ${this.props.addMode ? 'sketches-table-container--fixed' : ''}`}>
<Helmet> <Helmet>
<title>{this.getTitle()}</title> <title>{this.getTitle()}</title>
</Helmet> </Helmet>