UX: Add message when no topics found in KE view

This commit is contained in:
Justin DiRose 2019-11-13 15:52:33 -06:00
parent 698218c37b
commit 18c45a7a2b
3 changed files with 75 additions and 65 deletions

View File

@ -44,6 +44,11 @@ export default Ember.Controller.extend({
} }
}, },
@discourseComputed("topics")
emptyTopics(topics) {
return topics.length > 0 ? false : true;
},
@discourseComputed("loadMoreUrl") @discourseComputed("loadMoreUrl")
canLoadMore(loadMoreUrl) { canLoadMore(loadMoreUrl) {
if (loadMoreUrl === null || this.isLoadingMore) { if (loadMoreUrl === null || this.isLoadingMore) {

View File

@ -1,71 +1,75 @@
<div class="knowledge-explorer"> <div class="knowledge-explorer">
{{knowledge-explorer-search {{#if emptyTopics}}
searchTerm=(readonly searchTerm) <span class="no-topics-found">{{i18n 'knowledge_explorer.no_topics'}}</span>
onSearch=(action "performSearch") {{else}}
}} {{knowledge-explorer-search
{{#conditional-loading-spinner condition=isLoading}} searchTerm=(readonly searchTerm)
<div class="knowledge-explorer-browse"> onSearch=(action "performSearch")
{{#if site.mobileView}} }}
{{#unless selectedTopic}} {{#conditional-loading-spinner condition=isLoading}}
{{d-button class="knowledge-explorer-expander" icon=(if expandedFilters "angle-up" "angle-down") action=(action "toggleFilters") label="knowledge_explorer.filter_button"}} <div class="knowledge-explorer-browse">
{{/unless}} {{#if site.mobileView}}
{{/if}} {{#unless selectedTopic}}
<div class="knowledge-explorer-filters"> {{d-button class="knowledge-explorer-expander" icon=(if expandedFilters "angle-up" "angle-down") action=(action "toggleFilters") label="knowledge_explorer.filter_button"}}
{{#if expandedFilters}} {{/unless}}
{{#if categories}} {{/if}}
<div class="knowledge-explorer-items knowledge-explorer-categories"> <div class="knowledge-explorer-filters">
<h3>{{i18n 'knowledge_explorer.categories'}}</h3> {{#if expandedFilters}}
{{#each categories as |category|}} {{#if categories}}
{{knowledge-explorer-category <div class="knowledge-explorer-items knowledge-explorer-categories">
category=category <h3>{{i18n 'knowledge_explorer.categories'}}</h3>
selectCategory=(action "updateSelectedCategories" {{#each categories as |category|}}
tagName="") {{knowledge-explorer-category
category=category
selectCategory=(action "updateSelectedCategories"
tagName="")
}}
{{/each}}
</div>
{{/if}}
{{#if tags}}
<div class="knowledge-explorer-items knowledge-explorer-tags">
<h3>{{i18n 'knowledge_explorer.tags'}}</h3>
{{#each tags as |tag|}}
{{knowledge-explorer-tag
tag=tag
selectTag=(action "updateSelectedTags")
}}
{{/each}}
</div>
{{/if}}
{{/if}}
</div>
{{#if selectedTopic}}
{{#conditional-loading-spinner condition=isTopicLoading}}
{{knowledge-explorer-topic topic=topic}}
{{/conditional-loading-spinner}}
{{else}}
<div class="knowledge-explorer-results">
{{#if isSearching}}
{{#if emptySearchResults}}
<div class="result-count no-result">
{{i18n 'search.no_results'}}
</div>
{{else}}
<div class="result-count">
{{i18n 'knowledge_explorer.search.results'
count=searchCount
}} }}
{{/each}} </div>
</div> {{/if}}
{{/if}}
{{#if tags}}
<div class="knowledge-explorer-items knowledge-explorer-tags">
<h3>{{i18n 'knowledge_explorer.tags'}}</h3>
{{#each tags as |tag|}}
{{knowledge-explorer-tag
tag=tag
selectTag=(action "updateSelectedTags")
}}
{{/each}}
</div>
{{/if}} {{/if}}
{{#unless emptySearchResults}}
{{knowledge-explorer-topic-list
topics=topics
selectTopic=(action "setSelectedTopic")
loadMore=(action "loadMore")
loading=isLoadingMore
}}
{{/unless}}
</div>
{{/if}} {{/if}}
</div> </div>
{{#if selectedTopic}} {{/conditional-loading-spinner}}
{{#conditional-loading-spinner condition=isTopicLoading}} {{/if}}
{{knowledge-explorer-topic topic=topic}}
{{/conditional-loading-spinner}}
{{else}}
<div class="knowledge-explorer-results">
{{#if isSearching}}
{{#if emptySearchResults}}
<div class="result-count no-result">
{{i18n 'search.no_results'}}
</div>
{{else}}
<div class="result-count">
{{i18n 'knowledge_explorer.search.results'
count=searchCount
}}
</div>
{{/if}}
{{/if}}
{{#unless emptySearchResults}}
{{knowledge-explorer-topic-list
topics=topics
selectTopic=(action "setSelectedTopic")
loadMore=(action "loadMore")
loading=isLoadingMore
}}
{{/unless}}
</div>
{{/if}}
</div>
{{/conditional-loading-spinner}}
</div> </div>

View File

@ -2,6 +2,7 @@ en:
js: js:
knowledge_explorer: knowledge_explorer:
title: "Knowledge Explorer" title: "Knowledge Explorer"
no_topics: "No topics in Knowledge Explorer."
categories: "Categories" categories: "Categories"
tags: "Tags" tags: "Tags"
search: search: