Hide bits from community button

Added ability to hide the bits on the community button

src/site/twitch.tv/modules/chat/ChatModule.vue

@@ -78,6 +78,22 @@ const chatEvents = useComponentHook<Twitch.ChatEventComponent>({
 	predicate: (n) => n.onClearChatEvent,
 });
 
+const hideBitsBalance = useConfig<boolean>("chat.hide_bits_balance");
+useComponentHook<Twitch.ChatCommunityPointsButtonComponent>(
+	{
+		childSelector: ".community-points-summary",
+		predicate: (el) => el.shouldShowBitsBalance,
+	},
+	{
+		functionHooks: {
+			shouldShowBitsBalance(this, old) {
+				if (hideBitsBalance.value) return false;
+				return old.call(this);
+			},
+		},
+	},
+);
+
 const isHookable = ref(false);
 const isHookableDbc = refDebounced(isHookable, 200);
 
@@ -484,5 +500,11 @@ export const config = [
 		hint: "Whether or not to display 7TV Badges",
 		defaultValue: true,
 	}),
+	declareConfig("chat.hide_bits_balance", "TOGGLE", {
+		label: "Hide Bits Balance",
+		hint: "Hide the bits balance in the chat.",
+		path: ["Chat", "Style"],
+		defaultValue: false,
+	}),
 ];
 </script>

src/types/twitch.d.ts

@@ -437,6 +437,10 @@ declare module Twitch {
 		determineGroup: (command: ChatCommand) => string;
 	};
 
+	export type ChatCommunityPointsButtonComponent = ReactExtended.WritableComponent<{}> & {
+		shouldShowBitsBalance: () => boolean;
+	};
+
 	export type ChatChannelPointsClaimComponent = ReactExtended.WritableComponent<{
 		hidden: boolean;
 	}> & {