Merge pull request #70 from VampireChicken12/dev

fix: Forgot to enable hide scrollbar on page load

src/features/hideScrollBar/index.ts

@@ -1,17 +1,16 @@
-export function hideScrollBar() {
-	const style = document.createElement("style");
-	style.innerHTML = `
-		::-webkit-scrollbar {
-			width: 0px;
-			height: 0px;
-		}
-	`;
-	style.id = "yte-hide-scroll-bar";
-	document.head.appendChild(style);
-}
-export function showScrollBar() {
-	const style = document.getElementById("yte-hide-scroll-bar");
-	if (style) {
-		style.remove();
-	}
+import { waitForSpecificMessage } from "@/src/utils/utilities";
+import { hideScrollBar } from "./utils";
+
+export async function enableHideScrollBar() {
+	// Wait for the "options" message from the content script
+	const optionsData = await waitForSpecificMessage("options", "request_data", "content");
+	if (!optionsData) return;
+	const {
+		data: { options }
+	} = optionsData;
+	// Extract the necessary properties from the options object
+	const { enable_hide_scroll_bar } = options;
+	// If the hide scroll bar option is disabled, return
+	if (!enable_hide_scroll_bar) return;
+	hideScrollBar();
 }

src/features/hideScrollBar/utils.ts

@@ -0,0 +1,17 @@
+export function hideScrollBar() {
+	const style = document.createElement("style");
+	style.innerHTML = `
+		::-webkit-scrollbar {
+			width: 0px;
+			height: 0px;
+		}
+	`;
+	style.id = "yte-hide-scroll-bar";
+	document.head.appendChild(style);
+}
+export function showScrollBar() {
+	const style = document.getElementById("yte-hide-scroll-bar");
+	if (style) {
+		style.remove();
+	}
+}

src/pages/content/index.tsx

@@ -14,7 +14,8 @@ import eventManager from "@/utils/EventManager";
 import { browserColorLog, formatError } from "@/utils/utilities";
 
 import type { ExtensionSendOnlyMessageMappings, Messages, YouTubePlayerDiv } from "@/src/types";
-import { hideScrollBar, showScrollBar } from "@/src/features/hideScrollBar";
+import { enableHideScrollBar } from "@/src/features/hideScrollBar";
+import { hideScrollBar, showScrollBar } from "@/src/features/hideScrollBar/utils";
 // TODO: Add always show progressbar feature
 
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
@@ -68,6 +69,7 @@ document.documentElement.appendChild(element);
 window.onload = function () {
 	enableRememberVolume();
 	enableFeatureMenu();
+	enableHideScrollBar();
 	const enableFeatures = () => {
 		eventManager.removeAllEventListeners(["featureMenu"]);
 		addLoopButton();