Added Eruda support for iframe view. ts-ignore is since typescript can't tell the iframe is not in the same file as IframeHeader.tsx

src/components/iframe/IframeHeader.tsx

@@ -2,12 +2,13 @@ import { useState } from "preact/hooks";
 import { useTranslation } from "react-i18next";
 import { Link } from "preact-router";
 import { RiPictureInPictureExitFill, RiFullscreenFill } from "react-icons/ri";
+import { IoCodeSlashSharp } from "react-icons/io5";
 import { FaXmark } from "react-icons/fa6";
-
 export function IframeHeader(props: { url: string }) {
   const { t } = useTranslation();
   const [showPopout, setShowPopout] = useState(false);
   const [showFullScreen, setFullScreen] = useState(false);
+
   if (showPopout) {
     window.location.replace(props.url);
   }
@@ -34,6 +35,33 @@ export function IframeHeader(props: { url: string }) {
       </Link>
       <div id="navItems" class="w-1/2">
         <div className="mr-4 flex flex-row items-center justify-end gap-3">
+          <IoCodeSlashSharp
+            className="duration-0500 h-6 w-6 cursor-pointer text-navbar-text-color transition-all hover:scale-110 hover:brightness-125"
+            onClick={() => {
+                const proccy = document.getElementById("iframe");
+                if (!proccy) return;
+                // @ts-ignore
+                const proccyWindow = proccy.contentWindow;
+                // @ts-ignore
+                const proccyDocument = proccy.contentDocument;
+            
+                if (!proccyWindow || !proccyDocument) return;
+            
+                if (proccyWindow.eruda?._isInit) {
+                    proccyWindow.eruda.destroy();
+                } else {
+                    let script = proccyDocument.createElement('script');
+                    script.src = "https://cdn.jsdelivr.net/npm/eruda";
+                    script.onload = function() {
+                        if (!proccyWindow) return;
+                        proccyWindow.eruda.init();
+                        proccyWindow.eruda.show();
+                    }
+                    proccyDocument.head.appendChild(script);
+                }
+                    }
+                  }
+            />
           <RiPictureInPictureExitFill
             className="duration-0500 h-6 w-6 cursor-pointer text-navbar-text-color transition-all hover:scale-110 hover:brightness-125"
             onClick={() => setShowPopout(true)}

src/pages/ProxyFrame.tsx

@@ -104,6 +104,7 @@ export function ProxyFrame(props: { url: string }) {
   if (!ProxiedUrl == undefined) {
     window.location.href = ProxiedUrl;
   }
+    
   return (
     <div class="h-screen w-screen bg-primary">
       <CloakedHead