diff --git a/app/controllers/knowledge_explorer/knowledge_explorer_controller.rb b/app/controllers/knowledge_explorer/knowledge_explorer_controller.rb index 576787c..ddf299d 100644 --- a/app/controllers/knowledge_explorer/knowledge_explorer_controller.rb +++ b/app/controllers/knowledge_explorer/knowledge_explorer_controller.rb @@ -9,6 +9,8 @@ module KnowledgeExplorer tags: params[:tags], category: params[:category], search_term: params[:search], + ascending: params[:ascending], + order: params[:order], page: params[:page] } diff --git a/assets/javascripts/discourse/components/knowledge-explorer-topic-list.js.es6 b/assets/javascripts/discourse/components/knowledge-explorer-topic-list.js.es6 index a612cba..354d7c4 100644 --- a/assets/javascripts/discourse/components/knowledge-explorer-topic-list.js.es6 +++ b/assets/javascripts/discourse/components/knowledge-explorer-topic-list.js.es6 @@ -1,3 +1,25 @@ +import discourseComputed from "discourse-common/utils/decorators"; + export default Ember.Component.extend({ - classNames: "knowledge-explorer-topic-list" + classNames: "knowledge-explorer-topic-list", + @discourseComputed("order") + sortTitle(order) { + return order === "title"; + }, + + @discourseComputed("order") + sortActivity(order) { + return order === "activity"; + }, + + actions: { + sortListActivity() { + this.sortBy("activity"); + return false; + }, + sortListTitle() { + this.sortBy("title"); + return false; + } + } }); diff --git a/assets/javascripts/discourse/controllers/knowledge-explorer.js.es6 b/assets/javascripts/discourse/controllers/knowledge-explorer.js.es6 index 45173f2..4f49149 100644 --- a/assets/javascripts/discourse/controllers/knowledge-explorer.js.es6 +++ b/assets/javascripts/discourse/controllers/knowledge-explorer.js.es6 @@ -18,8 +18,10 @@ function mergeCategories(results) { export default Ember.Controller.extend({ application: Ember.inject.controller(), queryParams: { + ascending: "ascending", filterCategories: "category", filterTags: "tags", + orderColumn: "order", searchTerm: "search", selectedTopic: "topic" }, @@ -36,6 +38,8 @@ export default Ember.Controller.extend({ selectedTopic: null, topic: null, expandedFilters: false, + ascending: null, + orderColumn: null, @on("init") _setupFilters() { @@ -149,6 +153,21 @@ export default Ember.Controller.extend({ this.send("refreshModel"); }, + sortBy(column) { + const order = this.orderColumn; + const ascending = this.ascending; + if (column === "title") { + this.set("orderColumn", "title"); + } else if (column === "activity") { + this.set("orderColumn", "activity"); + } + + if (!ascending && order) this.set("ascending", true); + else this.set("ascending", ""); + + this.send("refreshModel"); + }, + loadMore() { if (this.canLoadMore) { this.set("isLoadingMore", true); @@ -172,7 +191,9 @@ export default Ember.Controller.extend({ const params = this.getProperties( "filterCategories", "filterTags", - "searchTerm" + "searchTerm", + "ascending", + "orderColumn" ); KnowledgeExplorer.list(params).then(result => { diff --git a/assets/javascripts/discourse/models/knowledge-explorer.js.es6 b/assets/javascripts/discourse/models/knowledge-explorer.js.es6 index 925b54d..30cdc52 100644 --- a/assets/javascripts/discourse/models/knowledge-explorer.js.es6 +++ b/assets/javascripts/discourse/models/knowledge-explorer.js.es6 @@ -11,6 +11,8 @@ export default { filters.push(`category=${params.filterCategories}`); if (params.filterTags) filters.push(`tags=${params.filterTags}`); if (params.searchTerm) filters.push(`search=${params.searchTerm}`); + if (params.ascending) filters.push("ascending=true"); + if (params.orderColumn) filters.push(`order=${params.orderColumn}`); if (params.page) filters.push(`page=${params.page}`); let promise = ajax(`/knowledge-explorer.json?${filters.join("&")}`); diff --git a/assets/javascripts/discourse/templates/components/knowledge-explorer-topic-list.hbs b/assets/javascripts/discourse/templates/components/knowledge-explorer-topic-list.hbs index 168bf7d..c5f48fc 100644 --- a/assets/javascripts/discourse/templates/components/knowledge-explorer-topic-list.hbs +++ b/assets/javascripts/discourse/templates/components/knowledge-explorer-topic-list.hbs @@ -1,8 +1,26 @@ {{#load-more selector=".topic-list tr" action=loadMore}}
Topic | -Activity | ++ Topic + {{#if sortTitle}} + {{#if ascending}} + {{d-icon 'angle-up'}} + {{else}} + {{d-icon 'angle-down'}} + {{/if}} + {{/if}} + | ++ Activity + {{#if sortActivity}} + {{#if ascending}} + {{d-icon 'angle-up'}} + {{else}} + {{d-icon 'angle-down'}} + {{/if}} + {{/if}} + | {{#each topics as |topic|}} diff --git a/assets/javascripts/discourse/templates/knowledge-explorer.hbs b/assets/javascripts/discourse/templates/knowledge-explorer.hbs index 51928ac..5a4d250 100644 --- a/assets/javascripts/discourse/templates/knowledge-explorer.hbs +++ b/assets/javascripts/discourse/templates/knowledge-explorer.hbs @@ -62,6 +62,9 @@ {{#unless emptySearchResults}} {{knowledge-explorer-topic-list topics=topics + ascending=ascending + order=orderColumn + sortBy=(action "sortBy") selectTopic=(action "setSelectedTopic") loadMore=(action "loadMore") loading=isLoadingMore diff --git a/assets/stylesheets/common/knowledge-explorer.scss b/assets/stylesheets/common/knowledge-explorer.scss index 72cbbfc..af94a6e 100644 --- a/assets/stylesheets/common/knowledge-explorer.scss +++ b/assets/stylesheets/common/knowledge-explorer.scss @@ -115,6 +115,18 @@ .knowledge-explorer-topic-list { flex-basis: 100%; + th { + min-width: 5em; + + &:hover { + background-color: $primary-low; + } + + .d-icon { + vertical-align: middle; + } + } + .badge-wrapper .badge-category .category-name { // extra protection for ultra-long category names max-width: 30vw; diff --git a/lib/knowledge_explorer/query.rb b/lib/knowledge_explorer/query.rb index 0b006b6..779f14b 100644 --- a/lib/knowledge_explorer/query.rb +++ b/lib/knowledge_explorer/query.rb @@ -49,6 +49,20 @@ module KnowledgeExplorer results = results.where('lower(title) LIKE ?', "%#{@filters[:search_term].downcase}%") end + if @filters[:order] == "title" + if @filters[:ascending].present? + results = results.reorder('title') + else + results = results.reorder('title DESC') + end + elsif @filters[:order] == "activity" + if @filters[:ascending].present? + results = results.reorder('last_posted_at') + else + results = results.reorder('last_posted_at DESC') + end + end + tags = tag_count(results) categories = categories_count(results) @@ -120,6 +134,7 @@ module KnowledgeExplorer filters.push("tags=#{@filters[:tags]}") if @filters[:tags].present? filters.push("category=#{@filters[:category]}") if @filters[:category].present? filters.push("search=#{@filters[:search_term]}") if @filters[:search_term].present? + filters.push("sort=#{@filters[:sort]}") if @filters[:sort].present? if @filters[:page].present? filters.push("page=#{@filters[:page].to_i + 1}")
---|