codeninjasllc/discourse
1
0
Fork 0
mirror of https://github.com/codeninjasllc/discourse.git synced 2024-11-27 17:46:05 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions

UX: Let the user know the search is too short in the header menu

Browse source
This commit is contained in:
Robin Ward 2016-08-09 16:05:58 -04:00
parent cc366d5a60
commit db3ae803c5
3 changed files with 15 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
app/assets/javascripts/discourse/widgets/search-menu-results.js.es6
View file

@ -71,6 +71,10 @@ createWidget('search-menu-results', {
tagName: 'div.results', tagName: 'div.results',
html(attrs) { html(attrs) {
if (attrs.invalidTerm) {
return h('div.no-results', I18n.t('search.too_short'));
}
if (attrs.noResults) { if (attrs.noResults) {
return h('div.no-results', I18n.t('search.no_results')); return h('div.no-results', I18n.t('search.no_results'));
} }

19
app/assets/javascripts/discourse/widgets/search-menu.js.es6
View file

@ -8,7 +8,8 @@ const searchData = {
results: {}, results: {},
noResults: false, noResults: false,
term: undefined, term: undefined,
typeFilter: null typeFilter: null,
invalidTerm: false
}; };
// Helps with debouncing and cancelling promises // Helps with debouncing and cancelling promises
@ -45,8 +46,11 @@ const SearchHelper = {
searchData.noResults = true; searchData.noResults = true;
searchData.results = []; searchData.results = [];
searchData.loading = false; searchData.loading = false;
searchData.invalidTerm = true;
widget.scheduleRerender(); widget.scheduleRerender();
} else { } else {
searchData.invalidTerm = false;
this._activeSearch = searchForTerm(term, { typeFilter, searchContext, fullSearchUrl }); this._activeSearch = searchForTerm(term, { typeFilter, searchContext, fullSearchUrl });
this._activeSearch.then(content => { this._activeSearch.then(content => {
searchData.noResults = content.resultTypes.length === 0; searchData.noResults = content.resultTypes.length === 0;
@ -98,7 +102,8 @@ export default createWidget('search-menu', {
} else { } else {
results.push(this.attach('search-menu-results', { term: searchData.term, results.push(this.attach('search-menu-results', { term: searchData.term,
noResults: searchData.noResults, noResults: searchData.noResults,
results: searchData.results })); results: searchData.results,
invalidTerm: searchData.invalidTerm }));
} }
return results; return results;
@ -130,13 +135,9 @@ export default createWidget('search-menu', {
triggerSearch() { triggerSearch() {
searchData.noResults = false; searchData.noResults = false;
if (isValidSearchTerm(searchData.term)) { this.searchService().set('highlightTerm', searchData.term);
this.searchService().set('highlightTerm', searchData.term); searchData.loading = true;
searchData.loading = true; Ember.run.debounce(SearchHelper, SearchHelper.perform, this, 400);
Ember.run.debounce(SearchHelper, SearchHelper.perform, this, 400);
} else {
searchData.results = [];
}
}, },
moreOfType(type) { moreOfType(type) {

2
config/locales/client.en.yml
View file

@ -1185,7 +1185,7 @@ en:
most_liked: "Most Liked" most_liked: "Most Liked"
select_all: "Select All" select_all: "Select All"
clear_all: "Clear All" clear_all: "Clear All"
too_short: "Sorry, your search term is too short. Please try a longer query." too_short: "Your search term is too short."
result_count: result_count:
one: "1 result for <span class='term'>\"{{term}}\"</span>" one: "1 result for <span class='term'>\"{{term}}\"</span>"
other: "{{count}} results for <span class='term'>\"{{term}}\"</span>" other: "{{count}} results for <span class='term'>\"{{term}}\"</span>"