UX: Remove experimental sidebar notification text (#17290)

2024-11-23 02:50:00 +08:00 · 2022-06-30 14:15:39 -04:00 · 2022-06-30 14:15:39 -04:00 · 4df683f88d
commit 4df683f88d
parent d0a4bc636f
14 changed files with 36 additions and 63 deletions
--- a/app/assets/javascripts/discourse/app/lib/sidebar/categories-section/category-section-link.js
+++ b/app/assets/javascripts/discourse/app/lib/sidebar/categories-section/category-section-link.js
@ -1,5 +1,3 @@
-import I18n from "I18n";
-
 import { htmlSafe } from "@ember/template";

 import { tracked } from "@glimmer/tracking";
@ -54,15 +52,11 @@ export default class CategorySectionLink {
    return htmlSafe(categoryBadgeHTML(this.category, { link: false }));
  }

-  get badgeText() {
+  get badgeCount() {
    if (this.totalUnread > 0) {
-      return I18n.t("sidebar.unread_count", {
-        count: this.totalUnread,
-      });
+      return this.totalUnread;
    } else if (this.totalNew > 0) {
-      return I18n.t("sidebar.new_count", {
-        count: this.totalNew,
-      });
+      return this.totalNew;
    }
  }

--- a/app/assets/javascripts/discourse/app/lib/sidebar/tags-section/tag-section-link.js
+++ b/app/assets/javascripts/discourse/app/lib/sidebar/tags-section/tag-section-link.js
@ -1,5 +1,3 @@
-import I18n from "I18n";
-
 import { tracked } from "@glimmer/tracking";

 import { bind } from "discourse-common/utils/decorators";
@ -47,15 +45,11 @@ export default class TagSectionLink {
    return this.tagName;
  }

-  get badgeText() {
+  get badgeCount() {
    if (this.totalUnread > 0) {
-      return I18n.t("sidebar.unread_count", {
-        count: this.totalUnread,
-      });
+      return this.totalUnread;
    } else if (this.totalNew > 0) {
-      return I18n.t("sidebar.new_count", {
-        count: this.totalNew,
-      });
+      return this.totalNew;
    }
  }

--- a/app/assets/javascripts/discourse/app/lib/sidebar/topics-section/base-section-link.js
+++ b/app/assets/javascripts/discourse/app/lib/sidebar/topics-section/base-section-link.js
@ -61,7 +61,7 @@ export default class BaseSectionLink {
  /**
   * @returns {string} Text for the badge within the link
   */
-  get badgeText() {}
+  get badgeCount() {}

  _notImplemented() {
    throw "not implemented";
--- a/app/assets/javascripts/discourse/app/lib/sidebar/topics-section/everything-section-link.js
+++ b/app/assets/javascripts/discourse/app/lib/sidebar/topics-section/everything-section-link.js
@ -52,15 +52,11 @@ export default class EverythingSectionLink extends BaseSectionLink {
    return "discovery.latest discovery.new discovery.unread discovery.top";
  }

-  get badgeText() {
+  get badgeCount() {
    if (this.totalUnread > 0) {
-      return I18n.t("sidebar.unread_count", {
-        count: this.totalUnread,
-      });
+      return this.totalUnread;
    } else if (this.totalNew > 0) {
-      return I18n.t("sidebar.new_count", {
-        count: this.totalNew,
-      });
+      return this.totalNew;
    } else {
      return;
    }
--- a/app/assets/javascripts/discourse/app/lib/sidebar/topics-section/my-posts-section-link.js
+++ b/app/assets/javascripts/discourse/app/lib/sidebar/topics-section/my-posts-section-link.js
@ -51,11 +51,9 @@ export default class MyPostsSectionLink extends BaseSectionLink {
    return I18n.t("sidebar.sections.topics.links.my_posts.content");
  }

-  get badgeText() {
+  get badgeCount() {
    if (this._hasDraft) {
-      return I18n.t("sidebar.sections.topics.links.my_posts.draft_count", {
-        count: this.draftCount,
-      });
+      return this.draftCount;
    }
  }

--- a/app/assets/javascripts/discourse/app/lib/sidebar/topics-section/tracked-section-link.js
+++ b/app/assets/javascripts/discourse/app/lib/sidebar/topics-section/tracked-section-link.js
@ -56,15 +56,11 @@ export default class TrackedSectionLink extends BaseSectionLink {
    return "discovery.latest discovery.new discovery.unread discovery.top";
  }

-  get badgeText() {
+  get badgeCount() {
    if (this.totalUnread > 0) {
-      return I18n.t("sidebar.unread_count", {
-        count: this.totalUnread,
-      });
+      return this.totalUnread;
    } else if (this.totalNew > 0) {
-      return I18n.t("sidebar.new_count", {
-        count: this.totalNew,
-      });
+      return this.totalNew;
    } else {
      return;
    }
--- a/app/assets/javascripts/discourse/app/templates/components/sidebar/categories-section.hbs
+++ b/app/assets/javascripts/discourse/app/templates/components/sidebar/categories-section.hbs
@ -17,7 +17,7 @@
        @content={{sectionLink.text}}
        @currentWhen={{sectionLink.currentWhen}}
        @model={{sectionLink.model}}
-        @badgeText={{sectionLink.badgeText}} >
+        @badgeCount={{sectionLink.badgeCount}} >
      </Sidebar::SectionLink>
    {{/each}}
  {{else}}
--- a/app/assets/javascripts/discourse/app/templates/components/sidebar/section-link.hbs
+++ b/app/assets/javascripts/discourse/app/templates/components/sidebar/section-link.hbs
@ -11,9 +11,9 @@
      {{@content}}
    </span>

-    {{#if @badgeText}}
+    {{#if @badgeCount}}
      <span class="sidebar-section-link-content-badge">
-        {{@badgeText}}
+        {{@badgeCount}}
      </span>
    {{/if}}
  </Sidebar::SectionLinkTo>
--- a/app/assets/javascripts/discourse/app/templates/components/sidebar/tags-section.hbs
+++ b/app/assets/javascripts/discourse/app/templates/components/sidebar/tags-section.hbs
@ -15,7 +15,7 @@
        @title={{sectionLink.title}}
        @content={{sectionLink.text}}
        @currentWhen={{sectionLink.currentWhen}}
-        @badgeText={{sectionLink.badgeText}}
+        @badgeCount={{sectionLink.badgeCount}}
        @model={{sectionLink.model}}>
      </Sidebar::SectionLink>
    {{/each}}
--- a/app/assets/javascripts/discourse/app/templates/components/sidebar/topics-section.hbs
+++ b/app/assets/javascripts/discourse/app/templates/components/sidebar/topics-section.hbs
@ -16,7 +16,7 @@
      @title={{sectionLink.title}}
      @content={{sectionLink.text}}
      @currentWhen={{sectionLink.currentWhen}}
-      @badgeText={{sectionLink.badgeText}}
+      @badgeCount={{sectionLink.badgeCount}}
      @model={{sectionLink.model}} />
  {{/each}}
 </Sidebar::Section>
--- a/app/assets/javascripts/discourse/tests/acceptance/sidebar-categories-section-test.js
+++ b/app/assets/javascripts/discourse/tests/acceptance/sidebar-categories-section-test.js
@ -1,4 +1,3 @@
-import I18n from "I18n";
 import { test } from "qunit";

 import { click, currentURL, settled, visit } from "@ember/test-helpers";
@ -315,7 +314,7 @@ acceptance("Sidebar - Categories Section", function (needs) {
      query(
        `.sidebar-section-link-${category1.slug} .sidebar-section-link-content-badge`
      ).textContent.trim(),
-      I18n.t("sidebar.unread_count", { count: 1 }),
+      "1",
      `displays 1 unread count for ${category1.slug} section link`
    );

@ -323,7 +322,7 @@ acceptance("Sidebar - Categories Section", function (needs) {
      query(
        `.sidebar-section-link-${category2.slug} .sidebar-section-link-content-badge`
      ).textContent.trim(),
-      I18n.t("sidebar.unread_count", { count: 2 }),
+      "2",
      `displays 2 unread count for ${category2.slug} section link`
    );

@ -342,7 +341,7 @@ acceptance("Sidebar - Categories Section", function (needs) {
      query(
        `.sidebar-section-link-${category1.slug} .sidebar-section-link-content-badge`
      ).textContent.trim(),
-      I18n.t("sidebar.new_count", { count: 1 }),
+      "1",
      `displays 1 new count for ${category1.slug} section link`
    );

@ -379,7 +378,7 @@ acceptance("Sidebar - Categories Section", function (needs) {
      query(
        `.sidebar-section-link-${category2.slug} .sidebar-section-link-content-badge`
      ).textContent.trim(),
-      I18n.t("sidebar.unread_count", { count: 1 }),
+      "1",
      `displays 1 unread count for ${category2.slug} section link`
    );
  });
--- a/app/assets/javascripts/discourse/tests/acceptance/sidebar-tags-section-test.js
+++ b/app/assets/javascripts/discourse/tests/acceptance/sidebar-tags-section-test.js
@ -269,7 +269,7 @@ acceptance("Sidebar - Tags section", function (needs) {
      query(
        `.sidebar-section-link-tag1 .sidebar-section-link-content-badge`
      ).textContent.trim(),
-      I18n.t("sidebar.unread_count", { count: 1 }),
+      "1",
      `displays 1 unread count for tag1 section link`
    );

@ -277,7 +277,7 @@ acceptance("Sidebar - Tags section", function (needs) {
      query(
        `.sidebar-section-link-tag2 .sidebar-section-link-content-badge`
      ).textContent.trim(),
-      I18n.t("sidebar.unread_count", { count: 1 }),
+      "1",
      `displays 1 unread count for tag2 section link`
    );

@ -301,7 +301,7 @@ acceptance("Sidebar - Tags section", function (needs) {
      query(
        `.sidebar-section-link-tag1 .sidebar-section-link-content-badge`
      ).textContent.trim(),
-      I18n.t("sidebar.new_count", { count: 1 }),
+      "1",
      `displays 1 new count for tag1 section link`
    );

--- a/app/assets/javascripts/discourse/tests/acceptance/sidebar-topics-section-test.js
+++ b/app/assets/javascripts/discourse/tests/acceptance/sidebar-topics-section-test.js
@ -333,7 +333,7 @@ acceptance("Sidebar - Topics Section", function (needs) {
      query(
        ".sidebar-section-link-everything .sidebar-section-link-content-badge"
      ).textContent.trim(),
-      "3 unread",
+      "3",
      "it displays the right unread count"
    );

@ -359,7 +359,7 @@ acceptance("Sidebar - Topics Section", function (needs) {
      query(
        ".sidebar-section-link-everything .sidebar-section-link-content-badge"
      ).textContent.trim(),
-      "2 unread",
+      "2",
      "it updates the unread count"
    );

@ -391,7 +391,7 @@ acceptance("Sidebar - Topics Section", function (needs) {
      query(
        ".sidebar-section-link-everything .sidebar-section-link-content-badge"
      ).textContent.trim(),
-      "1 new",
+      "1",
      "it displays the new count once there are no unread topics"
    );

@ -553,7 +553,7 @@ acceptance("Sidebar - Topics Section", function (needs) {
      query(
        ".sidebar-section-link-tracked .sidebar-section-link-content-badge"
      ).textContent.trim(),
-      "3 unread",
+      "3",
      "it displays the right unread count"
    );

@ -578,7 +578,7 @@ acceptance("Sidebar - Topics Section", function (needs) {
      query(
        ".sidebar-section-link-tracked .sidebar-section-link-content-badge"
      ).textContent.trim(),
-      "2 unread",
+      "2",
      "it updates the unread count"
    );

@ -606,7 +606,7 @@ acceptance("Sidebar - Topics Section", function (needs) {
      query(
        ".sidebar-section-link-tracked .sidebar-section-link-content-badge"
      ).textContent.trim(),
-      "1 new",
+      "1",
      "it displays the new count once there are no tracked unread topics"
    );

--- a/app/assets/stylesheets/common/base/sidebar.scss
+++ b/app/assets/stylesheets/common/base/sidebar.scss
@ -107,11 +107,6 @@
      font-weight: bold;
    }

-    .sidebar-section-link-content-badge {
-      width: 30%;
-      text-align: right;
-    }
-
    .sidebar-section-link-content-text {
      width: 70%;

@ -140,10 +135,11 @@
  }

  .sidebar-section-link-content-badge {
-    color: var(--tertiary);
    font-size: var(--font-down-1);
-    font-weight: normal;
+    color: var(--tertiary);
    margin-left: auto;
+    font-weight: normal;
+    margin-right: 0.4em;
  }

  .sidebar-section-header-caret {