From 1cdf48b1f1cbe6d7ad445b5593280bc5215fa68b Mon Sep 17 00:00:00 2001
From: Armin Stanitzok <armin.stanitzok@outlook.de>
Date: Fri, 23 Jun 2023 16:51:16 +0200
Subject: [PATCH] twitch/chat(feat): hide pinned hype chats & button (#709)

---
 CHANGELOG-nightly.md                          |  1 +
 .../hidden-elements/HiddenElementsModule.vue  | 24 +++++++++++++++++++
 .../modules/hidden-elements/hiddenElements.ts |  4 ++++
 3 files changed, 29 insertions(+)

diff --git a/CHANGELOG-nightly.md b/CHANGELOG-nightly.md
index f8c2ee52d..dcd6897bb 100644
--- a/CHANGELOG-nightly.md
+++ b/CHANGELOG-nightly.md
@@ -4,6 +4,7 @@
 
 - Added an option to hide the new mature content dialogs on Twitch
 - Added formatting support for Hype Chat
+- Added options to hide Hype Chats and the Hype Chat button
 - Fixed an issue which prevented moderator data from loading in User Cards
 - Fixed an issue where nametags with blending paints did not correctly use the base color and appeared invisible instead
 - Kick:
diff --git a/src/site/twitch.tv/modules/hidden-elements/HiddenElementsModule.vue b/src/site/twitch.tv/modules/hidden-elements/HiddenElementsModule.vue
index 9c11d4645..bc3cb245a 100644
--- a/src/site/twitch.tv/modules/hidden-elements/HiddenElementsModule.vue
+++ b/src/site/twitch.tv/modules/hidden-elements/HiddenElementsModule.vue
@@ -56,6 +56,12 @@ export const config = [
 		hint: "If checked, community highlights at the top of chat will be hidden (such as hype trains, pinned messages, drops, etc.)",
 		defaultValue: false,
 	}),
+	declareConfig("layout.hide_pinned_hype_chats", "TOGGLE", {
+		path: ["Site Layout", "Chat"],
+		label: "Hide Pinned Hype Chats",
+		hint: "If checked, the list of recent hype chats will be hidden",
+		defaultValue: false,
+	}),
 	// Main page elements (Twitch Features)
 	declareConfig("layout.hide_react_buttons", "TOGGLE", {
 		path: ["Site Layout", "Twitch Features"],
@@ -69,6 +75,12 @@ export const config = [
 		hint: "If checked, the 'Bits' related buttons will be hidden",
 		defaultValue: false,
 	}),
+	declareConfig("layout.hide_hype_chat_button", "TOGGLE", {
+		path: ["Site Layout", "Twitch Features"],
+		label: "Hide Hype Chat Button",
+		hint: "If checked, the 'Hype Chat' related button will be hidden",
+		defaultValue: false,
+	}),
 	declareConfig("layout.hide_subscribe_button", "TOGGLE", {
 		path: ["Site Layout", "Twitch Features"],
 		label: "Hide Subscribe Buttons",
@@ -156,6 +168,12 @@ export const config = [
 	}
 }
 
+.seventv-hide-hype-chat-button {
+	button[aria-label="Hype Chat"] {
+		display: none !important;
+	}
+}
+
 .seventv-hide-top-bar-of-stream {
 	div[class$="top-bar"] {
 		display: none !important;
@@ -174,6 +192,12 @@ export const config = [
 	}
 }
 
+.seventv-hide-pinned-hype-chats {
+	div[class$="paid-pinned-chat-message-list"] {
+		display: none !important;
+	}
+}
+
 .seventv-hide-recommended-channels {
 	#side-nav > *:nth-child(1) > *:nth-child(1) > *:nth-child(3) {
 		display: none !important;
diff --git a/src/site/twitch.tv/modules/hidden-elements/hiddenElements.ts b/src/site/twitch.tv/modules/hidden-elements/hiddenElements.ts
index f34899641..184ff62be 100644
--- a/src/site/twitch.tv/modules/hidden-elements/hiddenElements.ts
+++ b/src/site/twitch.tv/modules/hidden-elements/hiddenElements.ts
@@ -6,8 +6,10 @@ const hideButtonsBelowChatbox = useConfig<boolean>("layout.hide_buttons_below_ch
 const hideStreamChatBar = useConfig<boolean>("layout.hide_stream_chat_bar");
 const hideReactButtons = useConfig<boolean>("layout.hide_react_buttons");
 const hideBitsButtons = useConfig<boolean>("layout.hide_bits_buttons");
+const hideHypeChatButton = useConfig<boolean>("layout.hide_hype_chat_button");
 const hideTopBarOfStream = useConfig<boolean>("layout.hide_top_bar_of_stream");
 const hidePlayerControls = useConfig<boolean>("layout.hide_player_controls");
+const hidePinnedHypeChats = useConfig<boolean>("layout.hide_pinned_hype_chats");
 const hideCommunityHighlights = useConfig<boolean>("layout.hide_community_highlights");
 const hideRecommendedChannels = useConfig<boolean>("layout.hide_recommended_channels");
 const hideViewersAlsoWatch = useConfig<boolean>("layout.hide_viewers_also_watch");
@@ -23,8 +25,10 @@ export const hiddenElementSettings: Array<{ class: string; isHidden: Ref<boolean
 	{ class: "seventv-hide-stream-chat-bar", isHidden: hideStreamChatBar },
 	{ class: "seventv-hide-react-buttons", isHidden: hideReactButtons },
 	{ class: "seventv-hide-bits-buttons", isHidden: hideBitsButtons },
+	{ class: "seventv-hide-hype-chat-button", isHidden: hideHypeChatButton },
 	{ class: "seventv-hide-top-bar-of-stream", isHidden: hideTopBarOfStream },
 	{ class: "seventv-hide-player-controls", isHidden: hidePlayerControls },
+	{ class: "seventv-hide-pinned-hype-chats", isHidden: hidePinnedHypeChats },
 	{ class: "seventv-hide-community-highlights", isHidden: hideCommunityHighlights },
 	{ class: "seventv-hide-recommended-channels", isHidden: hideRecommendedChannels },
 	{ class: "seventv-hide-viewers-also-watch", isHidden: hideViewersAlsoWatch },