Add proxies from X-Frame-Bypass repo

components/apps/Browser/config.ts

@@ -1,3 +1,4 @@
+import { type ProxyState } from "components/apps/Browser/useProxyMenu";
 import { FAVICON_BASE_PATH } from "utils/constants";
 
 type Bookmark = {
@@ -78,3 +79,42 @@ export const OLD_NET_SUPPORTED_YEARS = [
 ];
 
 export const WAYBACK_URL_INFO = "https://archive.org/wayback/available?url=";
+
+export const PROXIES: Record<
+  ProxyState,
+  ((url: string) => Promise<string> | string) | undefined
+> = {
+  ALL_ORIGINS: (url) => `https://api.allorigins.win/raw?url=${url}`,
+  CHAINFLARE: (url) => `https://x.xxlxx.co/?url=${url}`,
+  CORS: undefined,
+  WAYBACK_MACHINE: async (url) => {
+    try {
+      const urlInfoResponse = await fetch(`${WAYBACK_URL_INFO}${url}`);
+      const { archived_snapshots } =
+        (await urlInfoResponse.json()) as WaybackUrlInfo;
+
+      if (archived_snapshots.closest.url) {
+        let addressUrl = archived_snapshots.closest.url;
+
+        if (
+          addressUrl.startsWith("http:") &&
+          window.location.protocol === "https:"
+        ) {
+          addressUrl = addressUrl.replace("http:", "https:");
+        }
+
+        return addressUrl;
+      }
+    } catch {
+      // Ignore failure to fetch url
+    }
+
+    return url;
+  },
+  ...Object.fromEntries(
+    OLD_NET_SUPPORTED_YEARS.map((year) => [
+      `OLD_NET_${year}`,
+      (url) => `${OLD_NET_PROXY.replace("<year>", year.toString())}${url}`,
+    ])
+  ),
+};

components/apps/Browser/index.tsx

@@ -22,9 +22,7 @@ import {
   HOME_PAGE,
   LOCAL_HOST,
   NOT_FOUND,
-  OLD_NET_PROXY,
-  WAYBACK_URL_INFO,
-  type WaybackUrlInfo,
+  PROXIES,
   bookmarks,
 } from "components/apps/Browser/config";
 import { type ComponentProcessProps } from "components/system/Apps/RenderComponent";
@@ -315,35 +313,9 @@ const Browser: FC<ComponentProcessProps> = ({ id }) => {
             setSrcDoc(newSrcDoc);
             prependFileToTitle(newTitle);
           } else {
-            let addressUrl = processedUrl.href;
-
-            if (proxyState === "WAYBACK_MACHINE") {
-              try {
-                const urlInfoResponse = await fetch(
-                  `${WAYBACK_URL_INFO}${addressUrl}`
-                );
-                const { archived_snapshots } =
-                  (await urlInfoResponse.json()) as WaybackUrlInfo;
-
-                if (archived_snapshots.closest.url) {
-                  addressUrl = archived_snapshots.closest.url;
-
-                  if (
-                    addressUrl.startsWith("http:") &&
-                    window.location.protocol === "https:"
-                  ) {
-                    addressUrl = addressUrl.replace("http:", "https:");
-                  }
-                }
-              } catch {
-                // Ignore failure to fetch url
-              }
-            } else if (proxyState.startsWith("OLD_NET_")) {
-              const year = proxyState.replace("OLD_NET_", "");
-              const proxyUrl = OLD_NET_PROXY.replace("<year>", year);
-
-              addressUrl = `${proxyUrl}${processedUrl.href}`;
-            }
+            const addressUrl = PROXIES[proxyState]
+              ? await PROXIES[proxyState](processedUrl.href)
+              : processedUrl.href;
 
             changeIframeWindowLocation(addressUrl, contentWindow);
 

components/apps/Browser/useProxyMenu.ts

@@ -3,7 +3,12 @@ import { OLD_NET_SUPPORTED_YEARS } from "components/apps/Browser/config";
 import { useMenu } from "contexts/menu";
 import { type ContextMenuCapture } from "contexts/menu/useMenuContextState";
 
-export type ProxyState = `CORS` | `OLD_NET_${number}` | "WAYBACK_MACHINE";
+export type ProxyState =
+  | "ALL_ORIGINS"
+  | "CHAINFLARE"
+  | "CORS"
+  | `OLD_NET_${number}`
+  | "WAYBACK_MACHINE";
 
 const useProxyMenu = (
   proxyState: ProxyState,
@@ -14,24 +19,34 @@ const useProxyMenu = (
   return useMemo(
     () =>
       contextMenu?.(() => [
+        {
+          action: () => setProxyState("ALL_ORIGINS"),
+          label: "allOrigins",
+          toggle: proxyState === "ALL_ORIGINS",
+        },
+        {
+          action: () => setProxyState("CHAINFLARE"),
+          label: "Chainflare",
+          toggle: proxyState === "CHAINFLARE",
+        },
         {
           action: () => setProxyState("CORS"),
-          checked: proxyState === "CORS",
           label: "Local w/CORS",
+          toggle: proxyState === "CORS",
         },
         {
           action: () => setProxyState("WAYBACK_MACHINE"),
-          checked: proxyState === "WAYBACK_MACHINE",
           label: "Wayback Machine",
+          toggle: proxyState === "WAYBACK_MACHINE",
         },
         {
-          checked: proxyState.startsWith("OLD_NET_"),
           label: "The Old Net",
           menu: OLD_NET_SUPPORTED_YEARS.map((year) => ({
             action: () => setProxyState(`OLD_NET_${year}`),
             checked: proxyState === `OLD_NET_${year}`,
             label: year.toString(),
           })),
+          toggle: proxyState.startsWith("OLD_NET_"),
         },
       ]),
     [contextMenu, proxyState, setProxyState]