refactor(popups): Remove jQuery from popups (@thanoskn)

frontend/src/ts/popups/video-ad-popup.ts

@@ -5,6 +5,7 @@ import * as AdController from "../controllers/ad-controller";
 import * as Skeleton from "../utils/skeleton";
 import { isPopupVisible } from "../utils/misc";
 import { animate } from "animejs";
+import { qs } from "../utils/dom";
 
 const wrapperId = "videoAdPopupWrapper";
 
@@ -35,33 +36,38 @@ export async function show(): Promise<void> {
   }
 
   if (!isPopupVisible(wrapperId)) {
-    const el = document.querySelector("#videoAdPopupWrapper") as HTMLElement;
+    const el = qs("#videoAdPopupWrapper");
 
-    animate(el, {
-      opacity: [0, 1],
-      duration: 125,
-      onBegin: () => {
-        el.classList.remove("hidden");
-      },
-      onComplete: () => {
-        //@ts-expect-error 3rd party ad code
-        window.dataLayer.push({ event: "EG_Video" });
-      },
-    });
+    if (el) {
+      animate(el.native, {
+        opacity: [0, 1],
+        duration: 125,
+        onBegin: () => {
+          el.show();
+        },
+        onComplete: () => {
+          //@ts-expect-error 3rd party ad code
+          window.dataLayer.push({ event: "EG_Video" });
+        },
+      });
+    }
   }
 }
 
 function hide(): void {
   if (isPopupVisible(wrapperId)) {
-    const el = document.querySelector("#videoAdPopupWrapper") as HTMLElement;
-    animate(el, {
-      opacity: [1, 0],
-      duration: 125,
-      onComplete: () => {
-        el.classList.add("hidden");
-        Skeleton.remove(wrapperId);
-      },
-    });
+    const el = qs("#videoAdPopupWrapper");
+
+    if (el) {
+      animate(el.native, {
+        opacity: [1, 0],
+        duration: 125,
+        onComplete: () => {
+          el.hide();
+          Skeleton.remove(wrapperId);
+        },
+      });
+    }
   }
 }
 
@@ -80,7 +86,7 @@ export function egVideoListener(options: Record<string, string>): void {
   }
 }
 
-$(".pageTest #watchVideoAdButton").on("click", () => {
+qs(".pageTest #watchVideoAdButton")?.on("click", () => {
   void show();
 });