diff --git a/src/components/MainDisplay.jsx b/src/components/MainDisplay.jsx
index 31c7ecc..28bca00 100644
--- a/src/components/MainDisplay.jsx
+++ b/src/components/MainDisplay.jsx
@@ -16,6 +16,7 @@ export class MainDisplay extends Component {
PropTypes.checkPropTypes({
dictionaryInfo: PropTypes.object.isRequired,
+ isLoadingWords: PropTypes.bool,
wordsToDisplay: PropTypes.array.isRequired,
wordsAreFiltered: PropTypes.bool,
wordsInCurrentList: PropTypes.number,
@@ -56,6 +57,7 @@ export class MainDisplay extends Component {
render () {
const {
dictionaryInfo,
+ isLoadingWords,
wordsToDisplay,
wordsAreFiltered,
wordsInCurrentList,
@@ -116,6 +118,7 @@ export class MainDisplay extends Component {
isTop />
diff --git a/src/components/display/WordsList.jsx b/src/components/display/WordsList.jsx
index 98bfa6e..058b4ad 100644
--- a/src/components/display/WordsList.jsx
+++ b/src/components/display/WordsList.jsx
@@ -13,6 +13,7 @@ export class WordsList extends Component {
super(props);
PropTypes.checkPropTypes({
+ isLoadingWords: PropTypes.bool,
adsEveryXWords: PropTypes.number,
words: PropTypes.array,
updateDisplay: PropTypes.func.isRequired,
@@ -22,6 +23,12 @@ export class WordsList extends Component {
render () {
const adsEveryXWords = this.props.adsEveryXWords || 10;
+ if (this.props.isLoadingWords) {
+ return
;
+ }
+
return (
diff --git a/src/components/structure/Pagination/index.jsx b/src/components/structure/Pagination/index.jsx
index 83d4f64..f0ac101 100644
--- a/src/components/structure/Pagination/index.jsx
+++ b/src/components/structure/Pagination/index.jsx
@@ -16,7 +16,7 @@ export const Pagination = (props) => {
const { currentPage, itemsPerPage, stats, setPage, wordsInCurrentList, isTop } = props;
if (wordsInCurrentList === null) {
- return
;
+ return null;
}
const lastPage = Math.floor(wordsInCurrentList / itemsPerPage);
diff --git a/src/index.jsx b/src/index.jsx
index 7a6a012..5b1d345 100644
--- a/src/index.jsx
+++ b/src/index.jsx
@@ -46,6 +46,7 @@ class App extends Component {
ignoreDiacritics: false,
filteredPartsOfSpeech: [...dictionary.partsOfSpeech, 'Uncategorized'],
},
+ isLoadingWords: true,
wordsInCurrentList: null,
}
@@ -181,18 +182,21 @@ class App extends Component {
displayedWords,
stats: getWordsStats(words, partsOfSpeech, this.state.settings.caseSensitive),
wordsInCurrentList,
+ isLoadingWords: false,
}, () => callback());
});
}
search (searchConfig) {
this.setState({
+ isLoadingWords: true,
searchConfig: searchConfig,
}, () => this.updateDisplayedWords());
}
setPage (newPage) {
this.setState({
+ isLoadingWords: true,
currentPage: newPage,
}, () => this.updateDisplayedWords());
}
@@ -208,6 +212,7 @@ class App extends Component {