From 424a274c12a1764fcaabf44d407999ab929f02fa Mon Sep 17 00:00:00 2001 From: Jean Date: Mon, 25 Jul 2022 09:41:43 -0400 Subject: [PATCH] FEATURE: add categories page style to order topics by created date (#17500) --- .../app/components/navigation-item.js | 7 +++++ .../app/controllers/discovery/categories.js | 5 +-- .../discourse/app/lib/keyboard-shortcuts.js | 1 + .../app/models/topic-tracking-state.js | 6 ++-- .../app/routes/discovery-categories.js | 5 ++- .../components/categories-topic-list.hbs | 6 +++- .../app/templates/discovery/categories.hbs | 11 +++++-- .../tests/acceptance/categories-test.js | 27 +++++++++++++++- app/controllers/categories_controller.rb | 12 +++++-- app/models/category_page_style.rb | 1 + config/locales/client.en.yml | 1 + config/locales/server.en.yml | 2 ++ spec/requests/categories_controller_spec.rb | 31 +++++++++++++++++++ 13 files changed, 102 insertions(+), 13 deletions(-) diff --git a/app/assets/javascripts/discourse/app/components/navigation-item.js b/app/assets/javascripts/discourse/app/components/navigation-item.js index e50001bba5b..2686d526ce0 100644 --- a/app/assets/javascripts/discourse/app/components/navigation-item.js +++ b/app/assets/javascripts/discourse/app/components/navigation-item.js @@ -65,6 +65,13 @@ export default Component.extend(FilterModeMixin, { } } + if ( + this.siteSettings.desktop_category_page_style === + "categories_and_latest_topics_created_date" + ) { + queryParams.push("order=created"); + } + if (queryParams.length) { href += `?${queryParams.join("&")}`; } diff --git a/app/assets/javascripts/discourse/app/controllers/discovery/categories.js b/app/assets/javascripts/discourse/app/controllers/discovery/categories.js index 4851ccf976c..a80ce60bcfc 100644 --- a/app/assets/javascripts/discourse/app/controllers/discovery/categories.js +++ b/app/assets/javascripts/discourse/app/controllers/discovery/categories.js @@ -23,7 +23,6 @@ export default DiscoveryController.extend({ category: null, canEdit: reads("currentUser.staff"), - @discourseComputed("model.parentCategory") categoryPageStyle(parentCategory) { let style = this.siteSettings.desktop_category_page_style; @@ -40,7 +39,9 @@ export default DiscoveryController.extend({ } const componentName = - parentCategory && style === "categories_and_latest_topics" + parentCategory && + (style === "categories_and_latest_topics" || + style === "categories_and_latest_topics_created_date") ? "categories_only" : style; return dasherize(componentName); diff --git a/app/assets/javascripts/discourse/app/lib/keyboard-shortcuts.js b/app/assets/javascripts/discourse/app/lib/keyboard-shortcuts.js index 4ab8ea9ea0a..a2a862c6028 100644 --- a/app/assets/javascripts/discourse/app/lib/keyboard-shortcuts.js +++ b/app/assets/javascripts/discourse/app/lib/keyboard-shortcuts.js @@ -781,6 +781,7 @@ export default { case "categories_with_featured_topics": return $(".latest .featured-topic"); case "categories_and_latest_topics": + case "categories_and_latest_topics_created_date": return $(".latest-topic-list .latest-topic-list-item"); case "categories_and_top_topics": return $(".top-topic-list .latest-topic-list-item"); diff --git a/app/assets/javascripts/discourse/app/models/topic-tracking-state.js b/app/assets/javascripts/discourse/app/models/topic-tracking-state.js index 06671d9fecb..03059fb3926 100644 --- a/app/assets/javascripts/discourse/app/models/topic-tracking-state.js +++ b/app/assets/javascripts/discourse/app/models/topic-tracking-state.js @@ -245,8 +245,10 @@ const TopicTrackingState = EmberObject.extend({ filter === "categories" && data.message_type === "latest" && !Site.current().mobileView && - this.siteSettings.desktop_category_page_style === - "categories_and_latest_topics" + (this.siteSettings.desktop_category_page_style === + "categories_and_latest_topics" || + this.siteSettings.desktop_category_page_style === + "categories_and_latest_topics_created_date") ) { this._addIncoming(data.topic_id); } diff --git a/app/assets/javascripts/discourse/app/routes/discovery-categories.js b/app/assets/javascripts/discourse/app/routes/discovery-categories.js index d7b1970d3fb..4ad4307f87a 100644 --- a/app/assets/javascripts/discourse/app/routes/discovery-categories.js +++ b/app/assets/javascripts/discourse/app/routes/discovery-categories.js @@ -24,7 +24,10 @@ const DiscoveryCategoriesRoute = DiscourseRoute.extend(OpenComposer, { let style = !this.site.mobileView && this.siteSettings.desktop_category_page_style; - if (style === "categories_and_latest_topics") { + if ( + style === "categories_and_latest_topics" || + style === "categories_and_latest_topics_created_date" + ) { return this._findCategoriesAndTopics("latest"); } else if (style === "categories_and_top_topics") { return this._findCategoriesAndTopics("top"); diff --git a/app/assets/javascripts/discourse/app/templates/components/categories-topic-list.hbs b/app/assets/javascripts/discourse/app/templates/components/categories-topic-list.hbs index 3aeb597f8ee..a7ac67b3f6e 100644 --- a/app/assets/javascripts/discourse/app/templates/components/categories-topic-list.hbs +++ b/app/assets/javascripts/discourse/app/templates/components/categories-topic-list.hbs @@ -8,7 +8,11 @@ {{/each}}
- {{i18n "more"}} + {{#if (eq this.siteSettings.desktop_category_page_style "categories_and_latest_topics_created_date") }} + {{i18n "more"}} + {{else}} + {{i18n "more"}} + {{/if}}
{{else}}
diff --git a/app/assets/javascripts/discourse/app/templates/discovery/categories.hbs b/app/assets/javascripts/discourse/app/templates/discovery/categories.hbs index 7f131c225c0..a9cde049366 100644 --- a/app/assets/javascripts/discourse/app/templates/discovery/categories.hbs +++ b/app/assets/javascripts/discourse/app/templates/discovery/categories.hbs @@ -9,9 +9,14 @@
{{/if}} - {{component this.categoryPageStyle - categories=this.model.categories - topics=this.model.topics}} + {{#if (eq this.categoryPageStyle "categories-and-latest-topics-created-date")}} + + {{else}} + {{component this.categoryPageStyle + categories=this.model.categories + topics=this.model.topics}} + {{/if}} + diff --git a/app/assets/javascripts/discourse/tests/acceptance/categories-test.js b/app/assets/javascripts/discourse/tests/acceptance/categories-test.js index c1b4ed3bd38..d0b91e934ac 100644 --- a/app/assets/javascripts/discourse/tests/acceptance/categories-test.js +++ b/app/assets/javascripts/discourse/tests/acceptance/categories-test.js @@ -1,4 +1,8 @@ -import { acceptance, exists } from "discourse/tests/helpers/qunit-helpers"; +import { + acceptance, + exists, + query, +} from "discourse/tests/helpers/qunit-helpers"; import { visit } from "@ember/test-helpers"; import { test } from "qunit"; @@ -29,9 +33,30 @@ acceptance("Categories - 'categories_and_latest_topics'", function (needs) { exists("div.latest-topic-list div[data-topic-id=8]"), "shows the topic list" ); + assert.notOk( + query(".more-topics a").href.endsWith("?order=created"), + "the load more button doesn't include the order=created param" + ); }); }); +acceptance( + "Categories - 'categories_and_latest_topics' - order by created date", + function (needs) { + needs.settings({ + desktop_category_page_style: "categories_and_latest_topics_created_date", + }); + test("order topics by", async function (assert) { + await visit("/categories"); + + assert.ok( + query(".more-topics a").href.endsWith("?order=created"), + "the load more button includes the order=created param" + ); + }); + } +); + acceptance("Categories - 'categories_with_featured_topics'", function (needs) { needs.settings({ desktop_category_page_style: "categories_with_featured_topics", diff --git a/app/controllers/categories_controller.rb b/app/controllers/categories_controller.rb index 65cb1fe769d..a3d1821d4aa 100644 --- a/app/controllers/categories_controller.rb +++ b/app/controllers/categories_controller.rb @@ -48,10 +48,14 @@ class CategoriesController < ApplicationController style = SiteSetting.desktop_category_page_style topic_options = { per_page: CategoriesController.topics_per_page, - no_definitions: true + no_definitions: true, } - if style == "categories_and_latest_topics" + if style == "categories_and_latest_topics_created_date" + topic_options[:order] = 'created' + @topic_list = TopicQuery.new(current_user, topic_options).list_latest + @topic_list.more_topics_url = url_for(public_send("latest_path", sort: :created)) + elsif style == "categories_and_latest_topics" @topic_list = TopicQuery.new(current_user, topic_options).list_latest @topic_list.more_topics_url = url_for(public_send("latest_path")) elsif style == "categories_and_top_topics" @@ -284,8 +288,10 @@ class CategoriesController < ApplicationController topic_options = { per_page: CategoriesController.topics_per_page, - no_definitions: true + no_definitions: true, } + style = SiteSetting.desktop_category_page_style + topic_options[:order] = 'created' if style == "categories_and_latest_topics_created_date" result = CategoryAndTopicLists.new result.category_list = CategoryList.new(guardian, category_options) diff --git a/app/models/category_page_style.rb b/app/models/category_page_style.rb index 4d0eaf75170..cf6381d58e6 100644 --- a/app/models/category_page_style.rb +++ b/app/models/category_page_style.rb @@ -12,6 +12,7 @@ class CategoryPageStyle < EnumSiteSetting @values ||= [ { name: 'category_page_style.categories_only', value: 'categories_only' }, { name: 'category_page_style.categories_with_featured_topics', value: 'categories_with_featured_topics' }, + { name: 'category_page_style.categories_and_latest_topics_created_date', value: 'categories_and_latest_topics_created_date' }, { name: 'category_page_style.categories_and_latest_topics', value: 'categories_and_latest_topics' }, { name: 'category_page_style.categories_and_top_topics', value: 'categories_and_top_topics' }, { name: 'category_page_style.categories_boxes', value: 'categories_boxes' }, diff --git a/config/locales/client.en.yml b/config/locales/client.en.yml index f2cbea83edb..f00c3f6075e 100644 --- a/config/locales/client.en.yml +++ b/config/locales/client.en.yml @@ -2063,6 +2063,7 @@ en: categories_only: "Categories Only" categories_with_featured_topics: "Categories with Featured Topics" categories_and_latest_topics: "Categories and Latest Topics" + categories_and_latest_topics_created_date: "Categories and Latest Topics (sort by topic created date)" categories_and_top_topics: "Categories and Top Topics" categories_boxes: "Boxes with Subcategories" categories_boxes_with_topics: "Boxes with Featured Topics" diff --git a/config/locales/server.en.yml b/config/locales/server.en.yml index 8189f3c7087..8e93e480414 100644 --- a/config/locales/server.en.yml +++ b/config/locales/server.en.yml @@ -5010,6 +5010,8 @@ en: label: "Categories with Featured Topics" categories_and_latest_topics: label: "Categories and Latest Topics" + categories_and_latest_topics_created_date: + label: "Categories and Latest Topics (sort by topic created date)" categories_and_top_topics: label: "Categories and Top Topics" categories_boxes: diff --git a/spec/requests/categories_controller_spec.rb b/spec/requests/categories_controller_spec.rb index 24eb5d25969..0c121739154 100644 --- a/spec/requests/categories_controller_spec.rb +++ b/spec/requests/categories_controller_spec.rb @@ -140,6 +140,37 @@ describe CategoriesController do expect(subsubcategory_response["topics"].map { |c| c['id'] }).to contain_exactly(topic3.id) end + describe 'categories and latest topics - ordered by created date' do + fab!(:category) { Fabricate(:category) } + fab!(:topic1) { Fabricate(:topic, category: category, created_at: 5.days.ago, updated_at: Time.now, bumped_at: Time.now) } + fab!(:topic2) { Fabricate(:topic, category: category, created_at: 2.days.ago, bumped_at: 2.days.ago) } + fab!(:topic3) { Fabricate(:topic, category: category, created_at: 1.day.ago, bumped_at: 1.day.ago) } + + context 'when order is not set to created date' do + before do + SiteSetting.desktop_category_page_style = "categories_and_latest_topics" + end + + it 'sorts topics by the default bump date' do + get "/categories_and_latest.json" + expect(response.status).to eq(200) + expect(response.parsed_body['topic_list']['topics'].map { |t| t["id"] }).to eq([topic1.id, topic3.id, topic2.id]) + end + end + + context 'when order is set to created' do + before do + SiteSetting.desktop_category_page_style = "categories_and_latest_topics_created_date" + end + + it 'sorts topics by crated at date' do + get "/categories_and_latest.json" + expect(response.status).to eq(200) + expect(response.parsed_body['topic_list']['topics'].map { |t| t["id"] }).to eq([topic3.id, topic2.id, topic1.id]) + end + end + end + it 'includes subcategories and topics by default when view is subcategories_with_featured_topics' do SiteSetting.max_category_nesting = 3 subcategory = Fabricate(:category, user: admin, parent_category: category)