refactor(hidden-frame): 🎉 update hidden frame logic

robolaunch · Aug 9, 2023 · 74f3c1d · 74f3c1d
1 parent 92ddf5c
commit 74f3c1d
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 10 deletions.
diff --git a/public/css/style.css b/public/css/style.css
@@ -742,6 +742,10 @@ video {
   top: 3.6rem;
 }
 
+.-top-\[999999\]{
+  top: -999999;
+}
+
 .-z-10{
   z-index: -10;
 }

diff --git a/src/components/HiddenFrame/HiddenFrame.tsx b/src/components/HiddenFrame/HiddenFrame.tsx
@@ -8,20 +8,26 @@ export default function HiddenFrame({ url }: IHiddenFrame): ReactElement {
   const [active, setActive] = useState<boolean>(true);
 
   useEffect(() => {
-    setInterval(() => {
-      url && setActive((prev) => !prev);
-    }, 30000);
+    const timer = setInterval(() => {
+      url && setActive(!active);
+    }, 10000);
+
+    return () => {
+      clearInterval(timer);
+    };
   }, [active, url]);
 
   return (
     <Fragment>
-      <iframe
-        title="iframe"
-        allow="clipboard-read"
-        className="absolute  grid-cols-1 gap-6"
-        src={url ? url.replace("wss://", "https://") + "health" : ""}
-        onLoad={() => console.log("iframe loaded")}
-      />
+      {active && (
+        <iframe
+          title="iframe"
+          allow="clipboard-read"
+          className="absolute -top-[9999px]"
+          src={url ? url.replace("wss://", "https://") + "health" : ""}
+          onLoad={() => console.log("iframe loaded")}
+        />
+      )}
     </Fragment>
   );
 }