UX: Rename Sidebar 'Topics' section to 'Community' (#17605)

Product decision to rename as not all links under the section falls
under the topics umbrella

app/assets/javascripts/discourse/app/components/sidebar/community-section.js

@@ -2,11 +2,11 @@ import GlimmerComponent from "discourse/components/glimmer";
 import Composer from "discourse/models/composer";
 import { getOwner } from "discourse-common/lib/get-owner";
 import PermissionType from "discourse/models/permission-type";
-import { customSectionLinks } from "discourse/lib/sidebar/custom-topics-section-links";
-import EverythingSectionLink from "discourse/lib/sidebar/topics-section/everything-section-link";
-import TrackedSectionLink from "discourse/lib/sidebar/topics-section/tracked-section-link";
-import BookmarkedSectionLink from "discourse/lib/sidebar/topics-section/bookmarked-section-link";
-import MyPostsSectionLink from "discourse/lib/sidebar/topics-section/my-posts-section-link";
+import { customSectionLinks } from "discourse/lib/sidebar/custom-community-section-links";
+import EverythingSectionLink from "discourse/lib/sidebar/community-section/everything-section-link";
+import TrackedSectionLink from "discourse/lib/sidebar/community-section/tracked-section-link";
+import BookmarkedSectionLink from "discourse/lib/sidebar/community-section/bookmarked-section-link";
+import MyPostsSectionLink from "discourse/lib/sidebar/community-section/my-posts-section-link";
 
 import { action } from "@ember/object";
 import { next } from "@ember/runloop";
@@ -18,7 +18,7 @@ const DEFAULT_SECTION_LINKS = [
   MyPostsSectionLink,
 ];
 
-export default class SidebarTopicsSection extends GlimmerComponent {
+export default class SidebarCommunitySection extends GlimmerComponent {
   configuredSectionLinks = [...DEFAULT_SECTION_LINKS, ...customSectionLinks];
 
   sectionLinks = this.configuredSectionLinks.map((sectionLinkClass) => {

app/assets/javascripts/discourse/app/lib/plugin-api.js

@@ -94,7 +94,7 @@ import {
 import { CUSTOM_USER_SEARCH_OPTIONS } from "select-kit/components/user-chooser";
 import { downloadCalendar } from "discourse/lib/download-calendar";
 import { consolePrefix } from "discourse/lib/source-identifier";
-import { addSectionLink } from "discourse/lib/sidebar/custom-topics-section-links";
+import { addSectionLink } from "discourse/lib/sidebar/custom-community-section-links";
 import { addSidebarSection } from "discourse/lib/sidebar/custom-sections";
 
 // If you add any methods to the API ensure you bump up the version number
@@ -1628,7 +1628,7 @@ class PluginApi {
   /**
    * EXPERIMENTAL. Do not use.
    * Support for adding a link under Sidebar topics section by returning a class which extends from the BaseSectionLink
-   * class interface. See `lib/sidebar/topics-section/base-section-link.js` for documentation on the BaseSectionLink class
+   * class interface. See `lib/sidebar/community-section/base-section-link.js` for documentation on the BaseSectionLink class
    * interface.
    *
    * ```

app/assets/javascripts/discourse/app/lib/sidebar/community-section/base-section-link.js

@@ -9,7 +9,7 @@ export default class BaseSectionLink {
   }
 
   /**
-   * Called when topics-section component is torn down.
+   * Called when community-section component is torn down.
    */
   teardown() {}
 

app/assets/javascripts/discourse/app/lib/sidebar/community-section/bookmarked-section-link.js

@@ -1,6 +1,6 @@
 import I18n from "I18n";
 
-import BaseSectionLink from "discourse/lib/sidebar/topics-section/base-section-link";
+import BaseSectionLink from "discourse/lib/sidebar/community-section/base-section-link";
 
 export default class BookmarkedSectionLink extends BaseSectionLink {
   get name() {
@@ -16,10 +16,10 @@ export default class BookmarkedSectionLink extends BaseSectionLink {
   }
 
   get title() {
-    return I18n.t("sidebar.sections.topics.links.bookmarked.title");
+    return I18n.t("sidebar.sections.community.links.bookmarked.title");
   }
 
   get text() {
-    return I18n.t("sidebar.sections.topics.links.bookmarked.content");
+    return I18n.t("sidebar.sections.community.links.bookmarked.content");
   }
 }

app/assets/javascripts/discourse/app/lib/sidebar/community-section/everything-section-link.js

@@ -2,7 +2,7 @@ import I18n from "I18n";
 
 import { tracked } from "@glimmer/tracking";
 import { bind } from "discourse-common/utils/decorators";
-import BaseSectionLink from "discourse/lib/sidebar/topics-section/base-section-link";
+import BaseSectionLink from "discourse/lib/sidebar/community-section/base-section-link";
 
 export default class EverythingSectionLink extends BaseSectionLink {
   @tracked totalUnread = 0;
@@ -41,11 +41,11 @@ export default class EverythingSectionLink extends BaseSectionLink {
   }
 
   get title() {
-    return I18n.t("sidebar.sections.topics.links.everything.title");
+    return I18n.t("sidebar.sections.community.links.everything.title");
   }
 
   get text() {
-    return I18n.t("sidebar.sections.topics.links.everything.content");
+    return I18n.t("sidebar.sections.community.links.everything.content");
   }
 
   get currentWhen() {

app/assets/javascripts/discourse/app/lib/sidebar/community-section/my-posts-section-link.js

@@ -1,7 +1,7 @@
 import I18n from "I18n";
 import { tracked } from "@glimmer/tracking";
 
-import BaseSectionLink from "discourse/lib/sidebar/topics-section/base-section-link";
+import BaseSectionLink from "discourse/lib/sidebar/community-section/base-section-link";
 
 const USER_DRAFTS_CHANGED_EVENT = "user-drafts:changed";
 
@@ -44,16 +44,16 @@ export default class MyPostsSectionLink extends BaseSectionLink {
   }
 
   get title() {
-    return I18n.t("sidebar.sections.topics.links.my_posts.title");
+    return I18n.t("sidebar.sections.community.links.my_posts.title");
   }
 
   get text() {
-    return I18n.t("sidebar.sections.topics.links.my_posts.content");
+    return I18n.t("sidebar.sections.community.links.my_posts.content");
   }
 
   get badgeText() {
     if (this._hasDraft) {
-      return I18n.t("sidebar.sections.topics.links.my_posts.draft_count", {
+      return I18n.t("sidebar.sections.community.links.my_posts.draft_count", {
         count: this.draftCount,
       });
     }

app/assets/javascripts/discourse/app/lib/sidebar/community-section/tracked-section-link.js

@@ -2,7 +2,7 @@ import I18n from "I18n";
 
 import { tracked } from "@glimmer/tracking";
 import { bind } from "discourse-common/utils/decorators";
-import BaseSectionLink from "discourse/lib/sidebar/topics-section/base-section-link";
+import BaseSectionLink from "discourse/lib/sidebar/community-section/base-section-link";
 import { isTrackedTopic } from "discourse/lib/topic-list-tracked-filter";
 
 export default class TrackedSectionLink extends BaseSectionLink {
@@ -45,11 +45,11 @@ export default class TrackedSectionLink extends BaseSectionLink {
   }
 
   get title() {
-    return I18n.t("sidebar.sections.topics.links.tracked.title");
+    return I18n.t("sidebar.sections.community.links.tracked.title");
   }
 
   get text() {
-    return I18n.t("sidebar.sections.topics.links.tracked.content");
+    return I18n.t("sidebar.sections.community.links.tracked.content");
   }
 
   get currentWhen() {

app/assets/javascripts/discourse/app/lib/sidebar/custom-community-section-links.js

@@ -1,4 +1,4 @@
-import BaseSectionLink from "discourse/lib/sidebar/topics-section/base-section-link";
+import BaseSectionLink from "discourse/lib/sidebar/community-section/base-section-link";
 
 export let customSectionLinks = [];
 
@@ -8,7 +8,7 @@ export let customSectionLinks = [];
  * @param {BaseSectionLink} baseSectionLink Factory class to inherit from.
  * @returns {BaseSectionLink} A class that extends BaseSectionLink.
  *
- * @param {(addTopicsSectionLinkCallback|Object)} arg - A callback function or an Object.
+ * @param {(addSectionLinkCallback|Object)} arg - A callback function or an Object.
  * @param {string} arg.name - The name of the link. Needs to be dasherized and lowercase.
  * @param {string} arg.route - The Ember route of the link.
  * @param {string} arg.title - The title attribute for the link.

app/assets/javascripts/discourse/app/templates/components/sidebar/community-section.hbs

@@ -1,11 +1,11 @@
 <Sidebar::Section
-  @sectionName="topics"
+  @sectionName="community"
   @headerRoute="discovery.latest"
   @headerQuery={{hash f=undefined}}
-  @headerLinkText={{i18n "sidebar.sections.topics.header_link_text"}}
-  @headerLinkTitle={{i18n "sidebar.sections.topics.header_link_title"}}
+  @headerLinkText={{i18n "sidebar.sections.community.header_link_text"}}
+  @headerLinkTitle={{i18n "sidebar.sections.community.header_link_title"}}
   @headerActionsIcon="plus"
-  @headerActions={{array (hash action=this.composeTopic title=(i18n "sidebar.sections.topics.header_action_title"))}}
+  @headerActions={{array (hash action=this.composeTopic title=(i18n "sidebar.sections.community.header_action_title"))}}
   @collapsable={{@collapsable}} >
 
   {{#each this.sectionLinks as |sectionLink|}}

app/assets/javascripts/discourse/app/templates/components/sidebar/sections.hbs

@@ -1,5 +1,5 @@
 <div class="sidebar-sections">
-  <Sidebar::TopicsSection @collapsable={{@collapsableSections}}/>
+  <Sidebar::CommunitySection @collapsable={{@collapsableSections}}/>
   <Sidebar::CategoriesSection @collapsable={{@collapsableSections}}/>
 
   {{#if this.siteSettings.tagging_enabled}}

app/assets/javascripts/discourse/tests/acceptance/sidebar-community-section-test.js

@@ -17,7 +17,7 @@ import { withPluginApi } from "discourse/lib/plugin-api";
 import Site from "discourse/models/site";
 import { NotificationLevels } from "discourse/lib/notification-levels";
 
-acceptance("Sidebar - Topics Section", function (needs) {
+acceptance("Sidebar - Community Section", function (needs) {
   needs.user({
     experimental_sidebar_enabled: true,
     tracked_tags: ["tag1"],
@@ -41,14 +41,14 @@ acceptance("Sidebar - Topics Section", function (needs) {
 
   test("clicking on section header button", async function (assert) {
     await visit("/");
-    await click(".sidebar-section-topics .sidebar-section-header-button");
+    await click(".sidebar-section-community .sidebar-section-header-button");
 
     assert.ok(exists("#reply-control"), "it opens the composer");
   });
 
   test("clicking on section header button while viewing a category", async function (assert) {
     await visit("/c/bug");
-    await click(".sidebar-section-topics .sidebar-section-header-button");
+    await click(".sidebar-section-community .sidebar-section-header-button");
 
     assert.ok(exists("#reply-control"), "it opens the composer");
 
@@ -63,34 +63,34 @@ acceptance("Sidebar - Topics Section", function (needs) {
     await visit("/");
 
     assert.ok(
-      exists(".sidebar-section-topics .sidebar-section-content"),
+      exists(".sidebar-section-community .sidebar-section-content"),
       "shows content section"
     );
 
     assert.strictEqual(
-      query(".sidebar-section-topics .sidebar-section-header-caret").title,
+      query(".sidebar-section-community .sidebar-section-header-caret").title,
       I18n.t("sidebar.toggle_section"),
       "caret has the right title"
     );
 
-    await click(".sidebar-section-topics .sidebar-section-header-caret");
+    await click(".sidebar-section-community .sidebar-section-header-caret");
 
     assert.ok(
-      !exists(".sidebar-section-topics .sidebar-section-content"),
+      !exists(".sidebar-section-community .sidebar-section-content"),
       "hides content section"
     );
 
-    await click(".sidebar-section-topics .sidebar-section-header-caret");
+    await click(".sidebar-section-community .sidebar-section-header-caret");
 
     assert.ok(
-      exists(".sidebar-section-topics .sidebar-section-content"),
+      exists(".sidebar-section-community .sidebar-section-content"),
       "shows content section"
     );
   });
 
   test("clicking on section header link", async function (assert) {
     await visit("/t/280");
-    await click(".sidebar-section-topics .sidebar-section-header-link");
+    await click(".sidebar-section-community .sidebar-section-header-link");
 
     assert.strictEqual(
       currentURL(),
@@ -99,20 +99,22 @@ acceptance("Sidebar - Topics Section", function (needs) {
     );
 
     assert.strictEqual(
-      count(".sidebar-section-topics .sidebar-section-link.active"),
+      count(".sidebar-section-community .sidebar-section-link.active"),
       1,
       "only one link is marked as active"
     );
 
     assert.ok(
-      exists(".sidebar-section-topics .sidebar-section-link-everything.active"),
+      exists(
+        ".sidebar-section-community .sidebar-section-link-everything.active"
+      ),
       "the everything link is marked as active"
     );
   });
 
   test("clicking on everything link", async function (assert) {
     await visit("/t/280");
-    await click(".sidebar-section-topics .sidebar-section-link-everything");
+    await click(".sidebar-section-community .sidebar-section-link-everything");
 
     assert.strictEqual(
       currentURL(),
@@ -121,20 +123,22 @@ acceptance("Sidebar - Topics Section", function (needs) {
     );
 
     assert.strictEqual(
-      count(".sidebar-section-topics .sidebar-section-link.active"),
+      count(".sidebar-section-community .sidebar-section-link.active"),
       1,
       "only one link is marked as active"
     );
 
     assert.ok(
-      exists(".sidebar-section-topics .sidebar-section-link-everything.active"),
+      exists(
+        ".sidebar-section-community .sidebar-section-link-everything.active"
+      ),
       "the everything link is marked as active"
     );
   });
 
   test("clicking on tracked link", async function (assert) {
     await visit("/t/280");
-    await click(".sidebar-section-topics .sidebar-section-link-tracked");
+    await click(".sidebar-section-community .sidebar-section-link-tracked");
 
     assert.strictEqual(
       currentURL(),
@@ -143,20 +147,20 @@ acceptance("Sidebar - Topics Section", function (needs) {
     );
 
     assert.strictEqual(
-      count(".sidebar-section-topics .sidebar-section-link.active"),
+      count(".sidebar-section-community .sidebar-section-link.active"),
       1,
       "only one link is marked as active"
     );
 
     assert.ok(
-      exists(".sidebar-section-topics .sidebar-section-link-tracked.active"),
+      exists(".sidebar-section-community .sidebar-section-link-tracked.active"),
       "the tracked link is marked as active"
     );
   });
 
   test("clicking on bookmarked link", async function (assert) {
     await visit("/t/280");
-    await click(".sidebar-section-topics .sidebar-section-link-bookmarked");
+    await click(".sidebar-section-community .sidebar-section-link-bookmarked");
 
     assert.strictEqual(
       currentURL(),
@@ -165,20 +169,22 @@ acceptance("Sidebar - Topics Section", function (needs) {
     );
 
     assert.strictEqual(
-      count(".sidebar-section-topics .sidebar-section-link.active"),
+      count(".sidebar-section-community .sidebar-section-link.active"),
       1,
       "only one link is marked as active"
     );
 
     assert.ok(
-      exists(".sidebar-section-topics .sidebar-section-link-bookmarked.active"),
+      exists(
+        ".sidebar-section-community .sidebar-section-link-bookmarked.active"
+      ),
       "the bookmarked link is marked as active"
     );
   });
 
   test("clicking on my posts link", async function (assert) {
     await visit("/t/280");
-    await click(".sidebar-section-topics .sidebar-section-link-my-posts");
+    await click(".sidebar-section-community .sidebar-section-link-my-posts");
 
     assert.strictEqual(
       currentURL(),
@@ -187,20 +193,24 @@ acceptance("Sidebar - Topics Section", function (needs) {
     );
 
     assert.strictEqual(
-      count(".sidebar-section-topics .sidebar-section-link.active"),
+      count(".sidebar-section-community .sidebar-section-link.active"),
       1,
       "only one link is marked as active"
     );
 
     assert.ok(
-      exists(".sidebar-section-topics .sidebar-section-link-my-posts.active"),
+      exists(
+        ".sidebar-section-community .sidebar-section-link-my-posts.active"
+      ),
       "the my posts link is marked as active"
     );
 
     await visit(`/u/${loggedInUser().username}/activity/drafts`);
 
     assert.notOk(
-      exists(".sidebar-section-topics .sidebar-section-link-my-posts.active"),
+      exists(
+        ".sidebar-section-community .sidebar-section-link-my-posts.active"
+      ),
       "the my posts link is not marked as active when user has no drafts and visiting the user activity drafts URL"
     );
   });
@@ -214,7 +224,7 @@ acceptance("Sidebar - Topics Section", function (needs) {
 
     await settled();
 
-    await click(".sidebar-section-topics .sidebar-section-link-my-posts");
+    await click(".sidebar-section-community .sidebar-section-link-my-posts");
 
     assert.strictEqual(
       currentURL(),
@@ -223,20 +233,24 @@ acceptance("Sidebar - Topics Section", function (needs) {
     );
 
     assert.strictEqual(
-      count(".sidebar-section-topics .sidebar-section-link.active"),
+      count(".sidebar-section-community .sidebar-section-link.active"),
       1,
       "only one link is marked as active"
     );
 
     assert.ok(
-      exists(".sidebar-section-topics .sidebar-section-link-my-posts.active"),
+      exists(
+        ".sidebar-section-community .sidebar-section-link-my-posts.active"
+      ),
       "the my posts link is marked as active"
     );
 
     await visit(`/u/${loggedInUser().username}/activity`);
 
     assert.ok(
-      exists(".sidebar-section-topics .sidebar-section-link-my-posts.active"),
+      exists(
+        ".sidebar-section-community .sidebar-section-link-my-posts.active"
+      ),
       "the my posts link is marked as active"
     );
   });
@@ -245,13 +259,15 @@ acceptance("Sidebar - Topics Section", function (needs) {
     await visit("/top");
 
     assert.strictEqual(
-      count(".sidebar-section-topics .sidebar-section-link.active"),
+      count(".sidebar-section-community .sidebar-section-link.active"),
       1,
       "only one link is marked as active"
     );
 
     assert.ok(
-      exists(".sidebar-section-topics .sidebar-section-link-everything.active"),
+      exists(
+        ".sidebar-section-community .sidebar-section-link-everything.active"
+      ),
       "the everything link is marked as active"
     );
   });
@@ -260,13 +276,15 @@ acceptance("Sidebar - Topics Section", function (needs) {
     await visit("/unread");
 
     assert.strictEqual(
-      count(".sidebar-section-topics .sidebar-section-link.active"),
+      count(".sidebar-section-community .sidebar-section-link.active"),
       1,
       "only one link is marked as active"
     );
 
     assert.ok(
-      exists(".sidebar-section-topics .sidebar-section-link-everything.active"),
+      exists(
+        ".sidebar-section-community .sidebar-section-link-everything.active"
+      ),
       "the everything link is marked as active"
     );
   });
@@ -275,13 +293,15 @@ acceptance("Sidebar - Topics Section", function (needs) {
     await visit("/new");
 
     assert.strictEqual(
-      count(".sidebar-section-topics .sidebar-section-link.active"),
+      count(".sidebar-section-community .sidebar-section-link.active"),
       1,
       "only one link is marked as active"
     );
 
     assert.ok(
-      exists(".sidebar-section-topics .sidebar-section-link-everything.active"),
+      exists(
+        ".sidebar-section-community .sidebar-section-link-everything.active"
+      ),
       "the everything link is marked as active"
     );
   });
@@ -432,13 +452,13 @@ acceptance("Sidebar - Topics Section", function (needs) {
     await visit("/top?f=tracked");
 
     assert.strictEqual(
-      count(".sidebar-section-topics .sidebar-section-link.active"),
+      count(".sidebar-section-community .sidebar-section-link.active"),
       1,
       "only one link is marked as active"
     );
 
     assert.ok(
-      exists(".sidebar-section-topics .sidebar-section-link-tracked.active"),
+      exists(".sidebar-section-community .sidebar-section-link-tracked.active"),
       "the tracked link is marked as active"
     );
   });
@@ -447,13 +467,13 @@ acceptance("Sidebar - Topics Section", function (needs) {
     await visit("/unread?f=tracked");
 
     assert.strictEqual(
-      count(".sidebar-section-topics .sidebar-section-link.active"),
+      count(".sidebar-section-community .sidebar-section-link.active"),
       1,
       "only one link is marked as active"
     );
 
     assert.ok(
-      exists(".sidebar-section-topics .sidebar-section-link-tracked.active"),
+      exists(".sidebar-section-community .sidebar-section-link-tracked.active"),
       "the tracked link is marked as active"
     );
   });
@@ -462,13 +482,13 @@ acceptance("Sidebar - Topics Section", function (needs) {
     await visit("/new?f=tracked");
 
     assert.strictEqual(
-      count(".sidebar-section-topics .sidebar-section-link.active"),
+      count(".sidebar-section-community .sidebar-section-link.active"),
       1,
       "only one link is marked as active"
     );
 
     assert.ok(
-      exists(".sidebar-section-topics .sidebar-section-link-tracked.active"),
+      exists(".sidebar-section-community .sidebar-section-link-tracked.active"),
       "the tracked link is marked as active"
     );
   });

app/assets/javascripts/discourse/tests/acceptance/sidebar-mobile-test.js

@@ -56,7 +56,7 @@ acceptance("Sidebar - Mobile - User with sidebar enabled", function (needs) {
     await click(".sidebar-section-header-caret");
 
     assert.ok(
-      !exists(".sidebar-section-topics .sidebar-section-content"),
+      !exists(".sidebar-section-community .sidebar-section-content"),
       "topics section is collapsed"
     );
 

app/assets/javascripts/discourse/tests/helpers/qunit-helpers.js

@@ -63,7 +63,7 @@ import {
   setTestPresence,
 } from "discourse/lib/user-presence";
 import PreloadStore from "discourse/lib/preload-store";
-import { resetDefaultSectionLinks as resetTopicsSectionLinks } from "discourse/lib/sidebar/custom-topics-section-links";
+import { resetDefaultSectionLinks as resetTopicsSectionLinks } from "discourse/lib/sidebar/custom-community-section-links";
 import {
   clearBlockDecorateCallbacks,
   clearTagDecorateCallbacks,

config/locales/client.en.yml

@@ -4096,9 +4096,9 @@ en:
           header_link_title: "all categories"
           header_link_text: "Categories"
           header_action_title: "edit your sidebar categories"
-        topics:
+        community:
           header_link_title: "home"
-          header_link_text: "Topics"
+          header_link_text: "Community"
           header_action_title: "create a new topic"
           links:
             everything: