Alamantus/Lexiconga
1
0
Fork 0
mirror of https://github.com/Alamantus/Lexiconga.git synced 2025-04-30 07:12:59 +02:00
Code Issues Releases Activity

Add a notification for when a search filter is being used

Browse source
This commit is contained in:
Robbie Antenesse 2017-12-22 12:35:50 -07:00
parent 95629aac72
commit 79b14bd62b
2 changed files with 24 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

16
src/components/MainDisplay.jsx
View file

@ -16,6 +16,7 @@ export class MainDisplay extends Component {
PropTypes.checkPropTypes({ PropTypes.checkPropTypes({
dictionaryInfo: PropTypes.object.isRequired, dictionaryInfo: PropTypes.object.isRequired,
wordsToDisplay: PropTypes.array.isRequired, wordsToDisplay: PropTypes.array.isRequired,
wordsAreFiltered: PropTypes.bool,
updateDisplay: PropTypes.func.isRequired, updateDisplay: PropTypes.func.isRequired,
updater: PropTypes.object.isRequired, updater: PropTypes.object.isRequired,
}, props, 'prop', 'MainDisplay'); }, props, 'prop', 'MainDisplay');
@ -47,7 +48,13 @@ export class MainDisplay extends Component {
} }
render () { render () {
const { dictionaryInfo, wordsToDisplay, updateDisplay, updater } = this.props; const {
dictionaryInfo,
wordsToDisplay,
wordsAreFiltered,
updateDisplay,
updater,
} = this.props;
const { isMobile, wordFormIsOpen } = this.state; const { isMobile, wordFormIsOpen } = this.state;
const wordFormIsDisabled = dictionaryInfo.settings.isComplete; const wordFormIsDisabled = dictionaryInfo.settings.isComplete;
@ -82,6 +89,13 @@ export class MainDisplay extends Component {
updateDisplay={ updateDisplay } updateDisplay={ updateDisplay }
/> />
{wordsAreFiltered
&& (
<div className='notification'>
Words are filtered&mdash;displaying {wordsToDisplay.length} word{wordsToDisplay.length !== 1 && 's'}
</div>
)}
<WordsList <WordsList
words={ wordsToDisplay } words={ wordsToDisplay }
adsEveryXWords={ 10 } adsEveryXWords={ 10 }

10
src/index.jsx
View file

@ -74,6 +74,12 @@ class App extends Component {
}; };
} }
get isUsingFilter () {
const partsOfSpeechForFilter = [...this.state.partsOfSpeech, 'Uncategorized'];
return this.state.searchConfig.searchTerm !== ''
|| partsOfSpeechForFilter.length !== this.state.searchConfig.filteredPartsOfSpeech.length;
}
updatePartsOfSpeech () { updatePartsOfSpeech () {
this.setState({ this.setState({
partsOfSpeech: dictionary.partsOfSpeech, partsOfSpeech: dictionary.partsOfSpeech,
@ -85,8 +91,7 @@ class App extends Component {
const { searchConfig, partsOfSpeech } = this.state; const { searchConfig, partsOfSpeech } = this.state;
const partsOfSpeechForFilter = [...partsOfSpeech, 'Uncategorized']; const partsOfSpeechForFilter = [...partsOfSpeech, 'Uncategorized'];
let displayedWords; let displayedWords;
if (searchConfig.searchTerm !== '' if (this.isUsingFilter) {
|| partsOfSpeechForFilter.length !== searchConfig.filteredPartsOfSpeech.length) {
const { const {
searchingIn, searchingIn,
searchTerm, searchTerm,
@ -180,6 +185,7 @@ class App extends Component {
<MainDisplay <MainDisplay
dictionaryInfo={ this.dictionaryInfo } dictionaryInfo={ this.dictionaryInfo }
wordsToDisplay={ this.state.displayedWords } wordsToDisplay={ this.state.displayedWords }
wordsAreFiltered={ this.isUsingFilter }
updateDisplay={ this.updateDisplayedWords.bind(this) } updateDisplay={ this.updateDisplayedWords.bind(this) }
updater={ this.updater } updater={ this.updater }
/> />