Clean up auto whitelist option code

src/content/content.ts

@@ -5,7 +5,6 @@ import findChannelFromTwitchTvUrl from "../common/ts/findChannelFromTwitchTvUrl"
 import isChannelWhitelisted from "../common/ts/isChannelWhitelisted";
 import isChromium from "../common/ts/isChromium";
 import { getStreamStatus, setStreamStatus } from "../common/ts/streamStatus";
-import wasChannelSubscriber from "../common/ts/wasChannelSubscriber";
 import store from "../store";
 import type { State } from "../store/types";
 import { MessageType } from "../types";
@@ -100,12 +99,12 @@ function onBackgroundMessage(message: any): undefined {
 }
 
 function onPageMessage(event: MessageEvent) {
-  if (event.data?.type !== MessageType.ContentScriptMessage) return;
+  if (!event.data) return;
+  if (event.data.type !== MessageType.ContentScriptMessage) return;
 
-  const message = event.data?.message;
+  const { message, responseType, responseMessageType } = event.data;
   if (!message) return;
 
-  // GetStoreState
   if (message.type === MessageType.GetStoreState) {
     const sendStoreState = () => {
       window.postMessage({
@@ -119,7 +118,7 @@ function onPageMessage(event: MessageEvent) {
     if (store.readyState === "complete") sendStoreState();
     else store.addEventListener("load", sendStoreState);
   }
-  // EnableFullMode
+  // ---
   else if (message.type === MessageType.EnableFullMode) {
     try {
       browser.runtime.sendMessage(message);
@@ -130,7 +129,7 @@ function onPageMessage(event: MessageEvent) {
       );
     }
   }
-  // DisableFullMode
+  // ---
   else if (message.type === MessageType.DisableFullMode) {
     try {
       browser.runtime.sendMessage(message);
@@ -141,19 +140,16 @@ function onPageMessage(event: MessageEvent) {
       );
     }
   }
-  // ChannelSubscriptionStatus
+  // ---
-  else if (message.type === MessageType.ChannelSubscriptionStatus) {
+  else if (message.type === MessageType.ChannelSubStatusChange) {
-    const { channelName, isSubscribed, scope } = message;
+    const { channelName, wasSubscribed, isSubscribed } = message;
-    const wasSubscribed = wasChannelSubscriber(channelName);
+    const isWhitelisted = isChannelWhitelisted(channelName);
-    let isWhitelisted = isChannelWhitelisted(channelName);
+    console.log("[TTV LOL PRO] ChannelSubStatusChange", {
-    console.log(
+      channelName,
-      "[TTV LOL PRO] Received channel subscription status message. Current state:",
+      wasSubscribed,
-      {
+      isSubscribed,
-        wasSubscribed,
+      isWhitelisted,
-        isSubscribed,
+    });
-        isWhitelisted,
-      }
-    );
     if (store.state.whitelistChannelSubscriptions && channelName != null) {
       if (!wasSubscribed && isSubscribed) {
         store.state.activeChannelSubscriptions.push(channelName);
@@ -161,7 +157,6 @@ function onPageMessage(event: MessageEvent) {
         if (!isWhitelisted) {
           console.log(`[TTV LOL PRO] Adding '${channelName}' to whitelist.`);
           store.state.whitelistedChannels.push(channelName);
-          isWhitelisted = true;
         }
       } else if (wasSubscribed && !isSubscribed) {
         store.state.activeChannelSubscriptions =
@@ -177,23 +172,20 @@ function onPageMessage(event: MessageEvent) {
             store.state.whitelistedChannels.filter(
               c => c.toLowerCase() !== channelName.toLowerCase()
             );
-          isWhitelisted = false;
         }
       }
     }
-    console.log("[TTV LOL PRO] Sending channel subscription status response.");
     window.postMessage({
-      type:
+      type: responseType,
-        scope === "page" // TODO: Is this necessary? Isn't the scope always "worker"?
-          ? MessageType.PageScriptMessage
-          : MessageType.WorkerScriptMessage,
       message: {
-        type: MessageType.ChannelSubscriptionStatusResponse,
+        type: responseMessageType,
-        isWhitelisted: isWhitelisted,
+        whitelistedChannels: JSON.parse(
+          JSON.stringify(store.state.whitelistedChannels)
+        ),
       },
     });
   }
-  // UsherResponse
+  // ---
   else if (message.type === MessageType.UsherResponse) {
     try {
       browser.runtime.sendMessage(message);
@@ -204,7 +196,7 @@ function onPageMessage(event: MessageEvent) {
       );
     }
   }
-  // MultipleAdBlockersInUse
+  // ---
   else if (message.type === MessageType.MultipleAdBlockersInUse) {
     const channelName = findChannelFromTwitchTvUrl(location.href);
     if (!channelName) return;
@@ -214,7 +206,7 @@ function onPageMessage(event: MessageEvent) {
       reason: "Another Twitch ad blocker is in use",
     });
   }
-  // ClearStats
+  // ---
   else if (message.type === MessageType.ClearStats) {
     clearStats(message.channelName);
   }

src/page/getFetch.ts

@@ -265,7 +265,6 @@ export function getFetch(pageState: PageState): typeof fetch {
         encodeURIComponent('"player_type":"frontpage"')
       );
       const channelName = findChannelFromUsherUrl(url);
-      let isWhitelisted = isChannelWhitelisted(channelName, pageState);
       if (
         pageState.state?.whitelistChannelSubscriptions &&
         channelName != null
@@ -274,33 +273,29 @@ export function getFetch(pageState: PageState): typeof fetch {
         const isSubscribed = url.includes(
           encodeURIComponent('"subscriber":true')
         );
-        // const isSubscribed = url.includes(
-        //   encodeURIComponent("aminematue")
-        // );
         const hasSubStatusChanged =
           (wasSubscribed && !isSubscribed) || (!wasSubscribed && isSubscribed);
         if (hasSubStatusChanged) {
-          console.log(
-            "[TTV LOL PRO] Channel subscription status changed. Sending message…"
-          );
           try {
             const response =
               await pageState.sendMessageToContentScriptAndWaitForResponse(
                 pageState.scope,
                 {
-                  type: MessageType.ChannelSubscriptionStatus,
+                  type: MessageType.ChannelSubStatusChange,
-                  scope: pageState.scope,
                   channelName,
+                  wasSubscribed,
                   isSubscribed,
                 },
-                MessageType.ChannelSubscriptionStatusResponse
+                MessageType.ChannelSubStatusChangeResponse
               );
-            if (typeof response.isWhitelisted === "boolean") {
+            if (typeof response.whitelistedChannels === "object") {
-              isWhitelisted = response.isWhitelisted;
+              pageState.state.whitelistedChannels =
+                response.whitelistedChannels;
             }
           } catch {}
         }
       }
+      const isWhitelisted = isChannelWhitelisted(channelName, pageState);
       if (!isLivestream || isFrontpage || isWhitelisted) {
         console.log(
           "[TTV LOL PRO] Not flagging Usher request: not a livestream, is frontpage, or is whitelisted."

src/page/sendMessage.ts

@@ -13,7 +13,9 @@ function sendMessage(
   type: MessageType,
   message: any
 ): void {
-  if (!recipient) return;
+  if (!recipient) {
+    return console.warn("[TTV LOL PRO] Message recipient is undefined.");
+  }
   recipient.postMessage({
     type,
     message,
@@ -30,7 +32,7 @@ async function sendMessageAndWaitForResponse(
 ): Promise<any> {
   return new Promise((resolve, reject) => {
     if (!recipient) {
-      console.warn("[TTV LOL PRO] Recipient is undefined.");
+      console.warn("[TTV LOL PRO] Message recipient is undefined.");
       resolve(undefined);
       return;
     }
@@ -46,7 +48,12 @@ async function sendMessageAndWaitForResponse(
     };
 
     self.addEventListener("message", listener);
-    sendMessage(recipient, type, message);
+    recipient.postMessage({
+      type,
+      message,
+      responseType,
+      responseMessageType,
+    });
     setTimeout(() => {
       self.removeEventListener("message", listener);
       reject(new Error("Timed out waiting for message response."));

src/types.ts

@@ -79,8 +79,8 @@ export const enum MessageType {
   EnableFullMode = "TLP_EnableFullMode",
   EnableFullModeResponse = "TLP_EnableFullModeResponse",
   DisableFullMode = "TLP_DisableFullMode",
-  ChannelSubscriptionStatus = "TLP_ChannelSubscriptionStatus",
+  ChannelSubStatusChange = "TLP_ChannelSubStatusChange",
-  ChannelSubscriptionStatusResponse = "TLP_ChannelSubscriptionStatusResponse",
+  ChannelSubStatusChangeResponse = "TLP_ChannelSubStatusChangeResponse",
   UsherResponse = "TLP_UsherResponse",
   NewPlaybackAccessToken = "TLP_NewPlaybackAccessToken",
   NewPlaybackAccessTokenResponse = "TLP_NewPlaybackAccessTokenResponse",