diff --git a/app/assets/javascripts/discourse/app/components/sidebar/anonymous/categories-section.js b/app/assets/javascripts/discourse/app/components/sidebar/anonymous/categories-section.js index c4243386dd6..0c548a796b5 100644 --- a/app/assets/javascripts/discourse/app/components/sidebar/anonymous/categories-section.js +++ b/app/assets/javascripts/discourse/app/components/sidebar/anonymous/categories-section.js @@ -1,4 +1,3 @@ -import { canDisplayCategory } from "discourse/lib/sidebar/helpers"; import SidebarCommonCategoriesSection from "discourse/components/sidebar/common/categories-section"; import Category from "discourse/models/category"; @@ -19,14 +18,7 @@ export default class SidebarAnonymousCategoriesSection extends SidebarCommonCate .map((categoryId) => parseInt(categoryId, 10)) ); } else { - return this.site.categoriesList - .filter((category) => { - return ( - !category.parent_category_id && - canDisplayCategory(category.id, this.siteSettings) - ); - }) - .slice(0, 5); + return this.topSiteCategories; } } } diff --git a/app/assets/javascripts/discourse/app/components/sidebar/anonymous/tags-section.js b/app/assets/javascripts/discourse/app/components/sidebar/anonymous/tags-section.js index 51f99172ffc..2b5f6e8da5d 100644 --- a/app/assets/javascripts/discourse/app/components/sidebar/anonymous/tags-section.js +++ b/app/assets/javascripts/discourse/app/components/sidebar/anonymous/tags-section.js @@ -1,9 +1,10 @@ import { cached } from "@glimmer/tracking"; -import Component from "@glimmer/component"; import { inject as service } from "@ember/service"; + +import SidebarCommonTagsSection from "discourse/components/sidebar/common/tags-section"; import TagSectionLink from "discourse/lib/sidebar/user/tags-section/tag-section-link"; -export default class SidebarAnonymousTagsSection extends Component { +export default class SidebarAnonymousTagsSection extends SidebarCommonTagsSection { @service router; @service topicTrackingState; @service site; @@ -11,20 +12,15 @@ export default class SidebarAnonymousTagsSection extends Component { get displaySection() { return ( this.site.anonymous_default_navigation_menu_tags?.length > 0 || - this.site.top_tags?.length > 0 + this.topSiteTags?.length > 0 ); } @cached get sectionLinks() { - let tags; - - if (this.site.anonymous_default_navigation_menu_tags) { - tags = this.site.anonymous_default_navigation_menu_tags; - } else { - tags = this.site.top_tags.slice(0, 5); - } - return tags.map((tagName) => { + return ( + this.site.anonymous_default_navigation_menu_tags || this.topSiteTags + ).map((tagName) => { return new TagSectionLink({ tagName, topicTrackingState: this.topicTrackingState, diff --git a/app/assets/javascripts/discourse/app/components/sidebar/common/categories-section.js b/app/assets/javascripts/discourse/app/components/sidebar/common/categories-section.js index 68c3e74b1ce..dd45f8d2228 100644 --- a/app/assets/javascripts/discourse/app/components/sidebar/common/categories-section.js +++ b/app/assets/javascripts/discourse/app/components/sidebar/common/categories-section.js @@ -6,6 +6,8 @@ import Category from "discourse/models/category"; import CategorySectionLink from "discourse/lib/sidebar/user/categories-section/category-section-link"; import { canDisplayCategory } from "discourse/lib/sidebar/helpers"; +export const TOP_SITE_CATEGORIES_TO_SHOW = 5; + export default class SidebarCommonCategoriesSection extends Component { @service topicTrackingState; @service siteSettings; @@ -20,6 +22,17 @@ export default class SidebarCommonCategoriesSection extends Component { */ get categories() {} + get topSiteCategories() { + return this.site.categoriesList + .filter((category) => { + return ( + !category.parent_category_id && + canDisplayCategory(category.id, this.siteSettings) + ); + }) + .slice(0, TOP_SITE_CATEGORIES_TO_SHOW); + } + get sortedCategories() { if (!this.shouldSortCategoriesByDefault) { return this.categories; diff --git a/app/assets/javascripts/discourse/app/components/sidebar/common/tags-section.js b/app/assets/javascripts/discourse/app/components/sidebar/common/tags-section.js new file mode 100644 index 00000000000..700808ccbba --- /dev/null +++ b/app/assets/javascripts/discourse/app/components/sidebar/common/tags-section.js @@ -0,0 +1,20 @@ +import Component from "@glimmer/component"; +import { inject as service } from "@ember/service"; + +export const TOP_SITE_TAGS_TO_SHOW = 5; + +export default class SidebarCommonTagsSection extends Component { + @service site; + + topSiteTags = []; + + constructor() { + super(...arguments); + + if (this.site.top_tags?.length > 0) { + this.site.top_tags.splice(0, TOP_SITE_TAGS_TO_SHOW).forEach((tagName) => { + this.topSiteTags.push(tagName); + }); + } + } +} diff --git a/app/assets/javascripts/discourse/app/components/sidebar/user/categories-section.hbs b/app/assets/javascripts/discourse/app/components/sidebar/user/categories-section.hbs index 10f52cc4ae3..665dce3effd 100644 --- a/app/assets/javascripts/discourse/app/components/sidebar/user/categories-section.hbs +++ b/app/assets/javascripts/discourse/app/components/sidebar/user/categories-section.hbs @@ -1,81 +1,49 @@ -{{#if (or this.shouldDisplay this.shouldDisplayDefaultConfig)}} - + - {{#if this.shouldDisplay}} - {{#if (gt this.sectionLinks.length 0)}} - {{#each this.sectionLinks as |sectionLink|}} - - {{/each}} - {{else if this.currentUser.new_edit_sidebar_categories_tags_interface_groups_enabled}} - - {{else}} - - {{/if}} - - - {{/if}} - - {{#if this.shouldDisplayDefaultConfig}} + {{#if (gt this.sectionLinks.length 0)}} + {{#each this.sectionLinks as |sectionLink|}} - {{/if}} - -{{/if}} \ No newline at end of file + {{/each}} + {{/if}} + + + + {{#if this.shouldDisplayDefaultConfig}} + + {{/if}} + \ No newline at end of file diff --git a/app/assets/javascripts/discourse/app/components/sidebar/user/categories-section.js b/app/assets/javascripts/discourse/app/components/sidebar/user/categories-section.js index d14a16cd2e3..74cbe423404 100644 --- a/app/assets/javascripts/discourse/app/components/sidebar/user/categories-section.js +++ b/app/assets/javascripts/discourse/app/components/sidebar/user/categories-section.js @@ -6,6 +6,7 @@ import { debounce } from "discourse-common/utils/decorators"; import Category from "discourse/models/category"; import SidebarCommonCategoriesSection from "discourse/components/sidebar/common/categories-section"; import showModal from "discourse/lib/show-modal"; +import { hasDefaultSidebarCategories } from "discourse/lib/sidebar/helpers"; export const REFRESH_COUNTS_APP_EVENT_NAME = "sidebar:refresh-categories-section-counts"; @@ -48,20 +49,10 @@ export default class SidebarUserCategoriesSection extends SidebarCommonCategorie @cached get categories() { - return Category.findByIds(this.currentUser.sidebarCategoryIds); - } - - /** - * If a site has no default sidebar categories configured, show categories section if the user has categories configured. - * Otherwise, hide the categories section from the sidebar for the user. - * - * If a site has default sidebar categories configured, always show categories section for the user. - */ - get shouldDisplay() { - if (this.hasDefaultSidebarCategories) { - return true; + if (this.currentUser.sidebarCategoryIds?.length > 0) { + return Category.findByIds(this.currentUser.sidebarCategoryIds); } else { - return this.categories.length > 0; + return this.topSiteCategories; } } @@ -70,7 +61,7 @@ export default class SidebarUserCategoriesSection extends SidebarCommonCategorie } get hasDefaultSidebarCategories() { - return this.siteSettings.default_navigation_menu_categories.length > 0; + return hasDefaultSidebarCategories(this.siteSettings); } @action diff --git a/app/assets/javascripts/discourse/app/components/sidebar/user/tags-section.hbs b/app/assets/javascripts/discourse/app/components/sidebar/user/tags-section.hbs index 95bacd60845..ad0f94bc4f0 100644 --- a/app/assets/javascripts/discourse/app/components/sidebar/user/tags-section.hbs +++ b/app/assets/javascripts/discourse/app/components/sidebar/user/tags-section.hbs @@ -1,61 +1,47 @@ -{{#if (or this.shouldDisplay this.shouldDisplayDefaultConfig)}} - + - {{#if this.shouldDisplay}} - {{#if (gt this.sectionLinks.length 0)}} - {{#each this.sectionLinks as |sectionLink|}} - - {{/each}} - {{else}} - - {{/if}} - - - {{/if}} - - {{#if this.shouldDisplayDefaultConfig}} + {{#if (gt this.sectionLinks.length 0)}} + {{#each this.sectionLinks as |sectionLink|}} - {{/if}} - -{{/if}} \ No newline at end of file + {{/each}} + {{/if}} + + + + {{#if this.shouldDisplayDefaultConfig}} + + {{/if}} + \ No newline at end of file diff --git a/app/assets/javascripts/discourse/app/components/sidebar/user/tags-section.js b/app/assets/javascripts/discourse/app/components/sidebar/user/tags-section.js index 70f747058f4..381c1160b97 100644 --- a/app/assets/javascripts/discourse/app/components/sidebar/user/tags-section.js +++ b/app/assets/javascripts/discourse/app/components/sidebar/user/tags-section.js @@ -1,12 +1,13 @@ import { cached } from "@glimmer/tracking"; -import Component from "@glimmer/component"; import { inject as service } from "@ember/service"; import { action } from "@ember/object"; +import SidebarCommonTagsSection from "discourse/components/sidebar/common/tags-section"; import TagSectionLink from "discourse/lib/sidebar/user/tags-section/tag-section-link"; import PMTagSectionLink from "discourse/lib/sidebar/user/tags-section/pm-tag-section-link"; +import { hasDefaultSidebarTags } from "discourse/lib/sidebar/helpers"; -export default class SidebarUserTagsSection extends Component { +export default class SidebarUserTagsSection extends SidebarCommonTagsSection { @service router; @service topicTrackingState; @service pmTopicTrackingState; @@ -33,7 +34,20 @@ export default class SidebarUserTagsSection extends Component { get sectionLinks() { const links = []; - for (const tag of this.currentUser.sidebarTags) { + let tags; + + if (this.currentUser.sidebarTags.length > 0) { + tags = this.currentUser.sidebarTags; + } else { + tags = this.topSiteTags.map((tagName) => { + return { + name: tagName, + pm_only: false, + }; + }); + } + + for (const tag of tags) { if (tag.pm_only) { links.push( new PMTagSectionLink({ @@ -55,26 +69,12 @@ export default class SidebarUserTagsSection extends Component { return links; } - /** - * If a site has no default sidebar tags configured, show tags section if the user has personal sidebar tags configured. - * Otherwise, hide the tags section from the sidebar for the user. - * - * If a site has default sidebar tags configured, always display the tags section. - */ - get shouldDisplay() { - if (this.hasDefaultSidebarTags) { - return true; - } else { - return this.currentUser.sidebarTags.length > 0; - } - } - get shouldDisplayDefaultConfig() { return this.currentUser.admin && !this.hasDefaultSidebarTags; } get hasDefaultSidebarTags() { - return this.siteSettings.default_navigation_menu_tags.length > 0; + return hasDefaultSidebarTags(this.siteSettings); } @action diff --git a/app/assets/javascripts/discourse/app/lib/sidebar/helpers.js b/app/assets/javascripts/discourse/app/lib/sidebar/helpers.js index e6401c442fe..7fc3e68edd8 100644 --- a/app/assets/javascripts/discourse/app/lib/sidebar/helpers.js +++ b/app/assets/javascripts/discourse/app/lib/sidebar/helpers.js @@ -7,3 +7,11 @@ export function canDisplayCategory(categoryId, siteSettings) { return !Category.isUncategorized(categoryId); } + +export function hasDefaultSidebarCategories(siteSettings) { + return siteSettings.default_navigation_menu_categories.length > 0; +} + +export function hasDefaultSidebarTags(siteSettings) { + return siteSettings.default_navigation_menu_tags.length > 0; +} diff --git a/app/assets/javascripts/discourse/tests/acceptance/css-generator-test.js b/app/assets/javascripts/discourse/tests/acceptance/css-generator-test.js index d95402be050..6057a6a06a6 100644 --- a/app/assets/javascripts/discourse/tests/acceptance/css-generator-test.js +++ b/app/assets/javascripts/discourse/tests/acceptance/css-generator-test.js @@ -4,11 +4,12 @@ import { test } from "qunit"; acceptance("CSS Generator", function (needs) { needs.user(); + needs.site({ categories: [ - { id: 1, color: "ff0000" }, - { id: 2, color: "333" }, - { id: 4, color: "2B81AF", parentCategory: { id: 1 } }, + { id: 1, color: "ff0000", name: "category1" }, + { id: 2, color: "333", name: "category2" }, + { id: 4, color: "2B81AF", parentCategory: { id: 1 }, name: "category3" }, ], }); diff --git a/app/assets/javascripts/discourse/tests/acceptance/sidebar-anonymous-tags-section-test.js b/app/assets/javascripts/discourse/tests/acceptance/sidebar-anonymous-tags-section-test.js index 7ff0e7838f6..b777ad6b4c4 100644 --- a/app/assets/javascripts/discourse/tests/acceptance/sidebar-anonymous-tags-section-test.js +++ b/app/assets/javascripts/discourse/tests/acceptance/sidebar-anonymous-tags-section-test.js @@ -22,10 +22,10 @@ acceptance("Sidebar - Anonymous Tags Section", function (needs) { await visit("/"); const categories = queryAll( - ".sidebar-section[data-section-name='tags'] .sidebar-section-link-wrapper" + ".sidebar-section[data-section-name='tags'] .sidebar-section-link-wrapper[data-tag-name]" ); - assert.strictEqual(categories.length, 4); + assert.strictEqual(categories.length, 3); assert.strictEqual(categories[0].textContent.trim(), "design"); assert.strictEqual(categories[1].textContent.trim(), "development"); assert.strictEqual(categories[2].textContent.trim(), "fun"); diff --git a/app/assets/javascripts/discourse/tests/acceptance/sidebar-user-categories-section-test.js b/app/assets/javascripts/discourse/tests/acceptance/sidebar-user-categories-section-test.js index 7ad4202d3c1..146aa2a970e 100644 --- a/app/assets/javascripts/discourse/tests/acceptance/sidebar-user-categories-section-test.js +++ b/app/assets/javascripts/discourse/tests/acceptance/sidebar-user-categories-section-test.js @@ -16,6 +16,7 @@ import discoveryFixture from "discourse/tests/fixtures/discovery-fixtures"; import categoryFixture from "discourse/tests/fixtures/category-fixtures"; import { cloneJSON } from "discourse-common/lib/object"; import { NotificationLevels } from "discourse/lib/notification-levels"; +import { TOP_SITE_CATEGORIES_TO_SHOW } from "discourse/components/sidebar/common/categories-section"; acceptance( "Sidebar - Logged on user - Categories Section - allow_uncategorized_topics disabled", @@ -142,45 +143,39 @@ acceptance("Sidebar - Logged on user - Categories Section", function (needs) { ); }); - test("categories section is hidden when user has not added any categories and there are no default categories configured", async function (assert) { + test("categories section is shown with site's top categories when user has not added any categories and there are no default categories set for the user", async function (assert) { updateCurrentUser({ sidebar_category_ids: [] }); await visit("/"); - assert.notOk( - exists(".sidebar-section[data-section-name='categories']"), - "categories section is not shown" - ); - }); - - test("categories section is shown when user has not added any categories but default categories have been configured", async function (assert) { - updateCurrentUser({ sidebar_category_ids: [] }); - const categories = Site.current().categories; - this.siteSettings.default_navigation_menu_categories = `${categories[0].id}|${categories[1].id}`; - - await visit("/"); - assert.ok( exists(".sidebar-section[data-section-name='categories']"), "categories section is shown" ); - assert.ok( - exists( - ".sidebar-section[data-section-name='categories'] .sidebar-section-link[data-link-name='configure-categories']" - ), - "section link to add categories to sidebar is displayed" - ); - - await click( - ".sidebar-section[data-section-name='categories'] .sidebar-section-link[data-link-name='configure-categories']" + const categorySectionLinks = queryAll( + ".sidebar-section[data-section-name='categories'] .sidebar-section-link-wrapper[data-category-id]" ); assert.strictEqual( - currentURL(), - "/u/eviltrout/preferences/navigation-menu", - "it should transition to user preferences navigation menu page" + categorySectionLinks.length, + TOP_SITE_CATEGORIES_TO_SHOW, + "the right number of category section links are shown" ); + + const topCategories = Site.current().categoriesByCount.splice( + 0, + TOP_SITE_CATEGORIES_TO_SHOW + ); + + topCategories.forEach((category) => { + assert.ok( + exists( + `.sidebar-section-link-wrapper[data-category-id=${category.id}]` + ), + `${category.name} section link is shown` + ); + }); }); test("uncategorized category is shown when added to sidebar", async function (assert) { diff --git a/app/assets/javascripts/discourse/tests/acceptance/sidebar-user-tags-section-test.js b/app/assets/javascripts/discourse/tests/acceptance/sidebar-user-tags-section-test.js index aaac3bea932..8a78344f836 100644 --- a/app/assets/javascripts/discourse/tests/acceptance/sidebar-user-tags-section-test.js +++ b/app/assets/javascripts/discourse/tests/acceptance/sidebar-user-tags-section-test.js @@ -13,6 +13,8 @@ import { import discoveryFixture from "discourse/tests/fixtures/discovery-fixtures"; import { cloneJSON } from "discourse-common/lib/object"; import { NotificationLevels } from "discourse/lib/notification-levels"; +import Site from "discourse/models/site"; +import { TOP_SITE_TAGS_TO_SHOW } from "discourse/components/sidebar/common/tags-section"; acceptance( "Sidebar - Logged on user - Tags section - tagging disabled", @@ -115,49 +117,41 @@ acceptance("Sidebar - Logged on user - Tags section", function (needs) { ); }); - test("tags section is hidden when user has not added any tags and there are no default tags configured", async function (assert) { + test("tags section is displayed with site's top tags when user has not added any tags and there are no default tags configured", async function (assert) { updateCurrentUser({ sidebar_tags: [], }); - await visit("/"); - - assert.notOk( - exists(".sidebar-section[data-section-name='tags']"), - "tags section is not displayed" - ); - }); - - test("tags section is shown when user has not added any tags but default tags have been configured", async function (assert) { - updateCurrentUser({ - sidebar_tags: [], - }); - - this.siteSettings.default_navigation_menu_tags = "tag1|tag2"; + Site.current().top_tags = [ + "test1", + "test2", + "test3", + "test4", + "test5", + "test6", + ]; await visit("/"); assert.ok( exists(".sidebar-section[data-section-name='tags']"), - "tags section is shown" - ); - - assert.ok( - exists( - ".sidebar-section[data-section-name='tags'] .sidebar-section-link[data-link-name='configure-tags']" - ), - "section link to add tags to sidebar is displayed" - ); - - await click( - ".sidebar-section[data-section-name='tags'] .sidebar-section-link[data-link-name='configure-tags']" + "tags section is displayed" ); assert.strictEqual( - currentURL(), - "/u/eviltrout/preferences/navigation-menu", - "it should transition to user preferences navigation menu page" + count( + ".sidebar-section[data-section-name='tags'] .sidebar-section-link-wrapper[data-tag-name]" + ), + TOP_SITE_TAGS_TO_SHOW, + "right number of tag section links are displayed" ); + + ["test1", "test2", "test3", "test4", "test5"].forEach((tagName) => { + assert.ok( + exists(`.sidebar-section-link-wrapper[data-tag-name=${tagName}]`), + `${tagName} tag section link is displayed` + ); + }); }); test("tag section links are sorted alphabetically by tag's name", async function (assert) { @@ -682,13 +676,13 @@ acceptance("Sidebar - Logged on user - Tags section", function (needs) { assert.ok( exists( - ".sidebar-section-link[data-link-name='configure-default-sidebar-tags']" + ".sidebar-section-link[data-link-name='configure-default-navigation-menu-tags']" ), "section link to configure default sidebar tags is shown" ); await click( - ".sidebar-section-link[data-link-name='configure-default-sidebar-tags']" + ".sidebar-section-link[data-link-name='configure-default-navigation-menu-tags']" ); assert.strictEqual( diff --git a/app/assets/javascripts/discourse/tests/acceptance/user-preferences-navigation-menu-test.js b/app/assets/javascripts/discourse/tests/acceptance/user-preferences-navigation-menu-test.js index ae87858c2e2..2ac3354aa16 100644 --- a/app/assets/javascripts/discourse/tests/acceptance/user-preferences-navigation-menu-test.js +++ b/app/assets/javascripts/discourse/tests/acceptance/user-preferences-navigation-menu-test.js @@ -112,8 +112,6 @@ acceptance("User Preferences - Navigation Menu", function (needs) { updateCurrentUser({ admin: false, display_sidebar_tags: false }); await visit("/u/eviltrout/preferences/navigation-menu"); - assert.notOk(exists(".sidebar-section[data-section-name='categories']")); - const categorySelector = selectKit(".category-selector"); await categorySelector.expand(); await categorySelector.selectKitSelectRowByName("support"); diff --git a/config/locales/client.en.yml b/config/locales/client.en.yml index a539650cf0b..aa9f92abd10 100644 --- a/config/locales/client.en.yml +++ b/config/locales/client.en.yml @@ -1207,9 +1207,9 @@ en: enable: "Enable sidebar" options: "Options" categories_section: "Categories Section" - categories_section_instruction: "Selected categories will be displayed under Navigation Menu's categories section." + categories_section_instruction: "Selected categories will be displayed under Navigation Menu's categories section. If no categories are selected, the site's top categories will be displayed." tags_section: "Tags Section" - tags_section_instruction: "Selected tags will be displayed under Navigation Menu's tags section." + tags_section_instruction: "Selected tags will be displayed under Navigation Menu's tags section. If no tags are selected, the site's top tags will be displayed." navigation_section: "Navigation" list_destination_instruction: "When there's new content in the navigation menu..." list_destination_default: "use the default link and show a badge for new items" @@ -2058,7 +2058,7 @@ en: disable: "Show All Posts" short_label: "Summarize" short_title: "Show a summary of this topic: the most interesting posts as determined by the community" - strategy: + strategy: button_title: "Summarize this topic" title: "Topic summary" @@ -4444,20 +4444,12 @@ en: unread_with_count: "Unread (%{count})" archive: "Archive" tags: - links: - add_tags: - content: "Add tags" - title: "You have not added any tags. Click to get started." none: "You have not added any tags." click_to_get_started: "Click here to get started." header_link_text: "Tags" header_action_title: "Edit your sidebar tags" configure_defaults: "Configure defaults" categories: - links: - add_categories: - content: "Add categories" - title: "You have not added any categories. Click to get started." none: "You have not added any categories." click_to_get_started: "Click here to get started." header_link_text: "Categories" diff --git a/plugins/chat/test/javascripts/acceptance/hashtag-css-generator-test.js b/plugins/chat/test/javascripts/acceptance/hashtag-css-generator-test.js index c1a917c5c2f..4d7cd3329ef 100644 --- a/plugins/chat/test/javascripts/acceptance/hashtag-css-generator-test.js +++ b/plugins/chat/test/javascripts/acceptance/hashtag-css-generator-test.js @@ -3,9 +3,14 @@ import { visit } from "@ember/test-helpers"; import { test } from "qunit"; acceptance("Chat | Hashtag CSS Generator", function (needs) { - const category1 = { id: 1, color: "ff0000" }; - const category2 = { id: 2, color: "333" }; - const category3 = { id: 4, color: "2B81AF", parentCategory: { id: 1 } }; + const category1 = { id: 1, color: "ff0000", name: "category1" }; + const category2 = { id: 2, color: "333", name: "category2" }; + const category3 = { + id: 4, + color: "2B81AF", + parentCategory: { id: 1 }, + name: "category3", + }; needs.settings({ chat_enabled: true }); needs.user({