Requested changes for PR

src/trubbel/manifest.json

@@ -10,7 +10,7 @@
 	"description": "Just some random things.",
 	"author": "Trubbel",
 	"maintainer": "Trubbel",
-	"version": "2.4.1",
+	"version": "2.5.7",
 	"search_terms": "trubbel",
 	"website": "https://twitch.tv/trubbel",
 	"created": "2025-01-06T23:29:54.496Z"

src/trubbel/settings/chat-viewer-card.js

@@ -44,8 +44,7 @@ export class ChatViewerCard extends FrankerFaceZ.utilities.module.Module {
   onBufferMessage(event) {
     if (!this.settings.get("addon.trubbel.chat.viewer-card")) return;
 
-    const messageType = event?.message?.type;
-    if (messageType !== 29) return;
+    if (event?.message?.type !== this.chat?.chat_types.Info) return;
 
     const message = event?.message?.message;
     const regex = /:\s*(.+?)\./;
@@ -158,16 +157,7 @@ export class ChatViewerCard extends FrankerFaceZ.utilities.module.Module {
 
   checkNavigation() {
     if (!this.settings.get("addon.trubbel.chat.viewer-card")) return;
-
-    const chatRoutes = [
-      "dash-popout-chat",
-      "dash-stream-manager",
-      "embed-chat",
-      "mod-popout-chat",
-      "mod-view",
-      "popout",
-      "user"
-    ];
+    const chatRoutes = this.site.constructor.CHAT_ROUTES;
 
     if (chatRoutes.includes(this.router?.current?.name)) {
       this.init();

src/trubbel/settings/directory.js

@@ -1,12 +1,29 @@
 const { createElement } = FrankerFaceZ.utilities.dom;
 
+import { FOLLOWING_CHANNELS_SELECTOR } from "../utils/constants/selectors";
+import GET_FOLLOWS from "../utils/graphql/follows_totalCount.gql";
+
 export class Directory extends FrankerFaceZ.utilities.module.Module {
   constructor(...args) {
     super(...args);
 
     this.inject("settings");
+    this.inject("i18n");
+    this.inject("site");
     this.inject("site.router");
 
+    // Directory - Following - Show Total Followed Channels
+    this.settings.add("addon.trubbel.directory.total-followed-channels", {
+      default: false,
+      ui: {
+        sort: 0,
+        path: "Add-Ons > Trubbel\u2019s Utilities > Directory >> Following",
+        title: "Show Total Followed Channels",
+        description: "This displays the total number of channels you're following. Which is visible in the [following](https://twitch.tv/directory/following)-pages.",
+        component: "setting-check-box"
+      }
+    });
+
     // Directory - Thumbnails - Enable Video Previews in Directory
     this.settings.add("addon.trubbel.directory.previews", {
       default: false,
@@ -75,7 +92,6 @@ export class Directory extends FrankerFaceZ.utilities.module.Module {
   onEnable() {
     this.settings.getChanges("addon.trubbel.directory.previews", () => this.handlePreviews());
     this.router.on(":route", this.checkNavigation, this);
-    this.checkNavigation();
   }
 
   checkNavigation() {
@@ -96,6 +112,39 @@ export class Directory extends FrankerFaceZ.utilities.module.Module {
         this.setupEventListeners();
       }
     }
+
+    if (this.router?.current?.name === "dir-following" && this.settings.get("addon.trubbel.directory.total-followed-channels")) {
+      this.showTotalFollowedChannels();
+    }
+  }
+
+  async showTotalFollowedChannels() {
+    const tabElement = await this.site.awaitElement(FOLLOWING_CHANNELS_SELECTOR, document.documentElement, 5000);
+    if (tabElement) {
+      // Make sure it doesn't update (if active) on each tab change (Overview, Live, Videos, Categories, Channels)
+      if (!tabElement.textContent.includes("(")) {
+
+        const apollo = this.resolve("site.apollo");
+        if (!apollo) {
+          return null;
+        }
+
+        const result = await apollo.client.query({
+          query: GET_FOLLOWS,
+          variables: {}
+        });
+
+        const totalCount = result?.data?.currentUser?.follows?.totalCount;
+        if (totalCount) {
+          const followCount = this.i18n.formatNumber(totalCount);
+          tabElement.textContent += ` (${followCount})`;
+        }
+      } else {
+        this.log.info("[Show Total Followed Channels] follow count already set");
+      }
+    } else {
+      this.log.warn("[Show Total Followed Channels] unable to find element:", tabElement);
+    }
   }
 
   getVideoPreviewURL(login) {

src/trubbel/settings/remove-things.js

@@ -238,7 +238,7 @@ export class RemoveThings extends FrankerFaceZ.utilities.module.Module {
     if (this.settings.get("addon.trubbel.remove-things.stories")) {
       this.style.set("hide-stories-left-nav-expanded", "#side-nav [class*=\"storiesLeftNavSection--\"] { display: none !important; }");
       this.style.set("hide-stories-left-nav-collapsed", "#side-nav :is([style]) :has([class*=\"storiesLeftNavSectionCollapsedButton--\"]) { display: none !important; }");
-      this.style.set("hide-stories-following-page", "div[class^=\"Layout-sc-\"] > [data-simplebar=\"init\"] > div:nth-child(3) > :has(h2[class*=\"sr-only\"]:is([class^=\"CoreText-sc-\"])) { display: none !important; }");
+      this.style.set("hide-stories-following-page", "div[class^=\"Layout-sc-\"]:has(> [data-simplebar=\"init\"] > .simplebar-scroll-content > .simplebar-content[style] h2.sr-only) { display: none !important; }");
     } else {
       this.style.delete("hide-stories-left-nav-expanded");
       this.style.delete("hide-stories-left-nav-collapsed");

src/trubbel/settings/ui-tweaks.js

@@ -10,14 +10,13 @@ export class UITweaks extends FrankerFaceZ.utilities.module.Module {
     this.inject("settings");
     this.inject("site.router");
 
-    // UI Tweaks - Chat - Reduce Chat Viewer List Padding
+    // UI Tweaks - Chat - Reduce padding in Viewer List
     this.settings.add("addon.trubbel.ui-tweaks.chat-viewer-list-padding", {
       default: false,
       ui: {
         sort: 0,
         path: "Add-Ons > Trubbel\u2019s Utilities > UI Tweaks >> Chat",
-        title: "Reduce Chat Viewer List Padding",
-        description: "Gives the ability to adjust the height of the whisper window drop down.",
+        title: "Reduce padding in Viewer List",
         component: "setting-check-box"
       },
       changed: () => this.updateCSS()
@@ -169,7 +168,7 @@ export class UITweaks extends FrankerFaceZ.utilities.module.Module {
   }
 
   updateCSS() {
-    // UI Tweaks - Chat - Reduce Chat Viewer List Padding
+    // UI Tweaks - Chat - Reduce padding in Viewer List
     if (this.settings.get("addon.trubbel.ui-tweaks.chat-viewer-list-padding")) {
       this.style.set("viewer-list-padding1", "#community-tab-content > div {padding: 1rem !important;}");
       this.style.set("viewer-list-padding2", ".chatter-list-item {padding: .2rem 0!important;}");

src/trubbel/utils/constants/selectors.js

@@ -1,3 +1,4 @@
+export const FOLLOWING_CHANNELS_SELECTOR = "[data-a-target=\"following-channels-tab\"] [class*=\"ScTitle-sc-\"]";
 export const MOST_RECENT_CARD_SELECTOR = ".offline-recommendations-video-card:has([class*=\"offline-recommendations-video-card-border-\"]) :is(.tw-aspect)";
 export const MOST_RECENT_SELECTOR = ".offline-recommendations-video-card";
 export const TIMESTAMP_SELECTOR = ".timestamp-metadata__bar + p";

src/trubbel/utils/graphql/follows_totalCount.gql

@@ -0,0 +1,8 @@
+query Trubbel_GetTotalChannelFollowCount {
+	currentUser {
+		id
+		follows {
+			totalCount
+		}
+	}
+}