From ae13d0da6b3eb78336af3cdb09a6ecb54246bd14 Mon Sep 17 00:00:00 2001 From: Dustin Brett Date: Sun, 12 Jan 2025 11:09:19 -0800 Subject: [PATCH] Add "proxy" to browser --- components/apps/Browser/NavigationIcons.tsx | 6 +++ components/apps/Browser/StyledBrowser.ts | 10 +++++ components/apps/Browser/config.ts | 14 ++++++ components/apps/Browser/index.tsx | 47 ++++++++++++++++++++- components/apps/Browser/useProxyMenu.ts | 41 ++++++++++++++++++ public/CREDITS.md | 2 + 6 files changed, 118 insertions(+), 2 deletions(-) create mode 100644 components/apps/Browser/useProxyMenu.ts diff --git a/components/apps/Browser/NavigationIcons.tsx b/components/apps/Browser/NavigationIcons.tsx index d374ccd1..9923b340 100644 --- a/components/apps/Browser/NavigationIcons.tsx +++ b/components/apps/Browser/NavigationIcons.tsx @@ -28,3 +28,9 @@ export const Stop = memo(() => ( )); + +export const Network = memo(() => ( + + + +)); diff --git a/components/apps/Browser/StyledBrowser.ts b/components/apps/Browser/StyledBrowser.ts index 639b7e63..9714bf65 100644 --- a/components/apps/Browser/StyledBrowser.ts +++ b/components/apps/Browser/StyledBrowser.ts @@ -43,6 +43,16 @@ const StyledBrowser = styled.div` width: 20px; } + &.proxy { + margin: 0 10px 0 4px; + width: 40px; + + svg { + height: 15px; + width: 15px; + } + } + &:hover { background-color: rgb(103, 103, 103); } diff --git a/components/apps/Browser/config.ts b/components/apps/Browser/config.ts index e2e7c4a6..56b86236 100644 --- a/components/apps/Browser/config.ts +++ b/components/apps/Browser/config.ts @@ -7,6 +7,10 @@ type Bookmark = { url: string; }; +export type WaybackUrlInfo = { + archived_snapshots: { closest: { url: string } }; +}; + export const DINO_GAME = { icon: "/System/Icons/Favicons/dino.webp", name: "T-Rex Chrome Dino Game", @@ -59,3 +63,13 @@ export const LOCAL_HOST = new Set(["127.0.0.1", "localhost"]); export const NOT_FOUND = '404 Not Found

Not Found

The requested URL was not found on this server.

'; + +export const OLD_NET_PROXY = + "https://theoldnet.com/get?scripts=true&decode=true&year=&url="; + +export const OLD_NET_SUPPORTED_YEARS = [ + 1996, 1997, 1998, 1999, 2000, 2001, 2002, 2003, 2004, 2005, 2006, 2007, 2008, + 2009, 2010, 2011, 2012, +]; + +export const WAYBACK_URL_INFO = "https://archive.org/wayback/available?url="; diff --git a/components/apps/Browser/index.tsx b/components/apps/Browser/index.tsx index 968063e3..425ef638 100644 --- a/components/apps/Browser/index.tsx +++ b/components/apps/Browser/index.tsx @@ -1,5 +1,8 @@ import { basename, join, resolve } from "path"; import { useCallback, useEffect, useRef, useState } from "react"; +import useProxyMenu, { + type ProxyState, +} from "components/apps/Browser/useProxyMenu"; import { ADDRESS_INPUT_PROPS } from "components/apps/FileExplorer/AddressBar"; import useHistoryMenu from "components/apps/Browser/useHistoryMenu"; import useBookmarkMenu from "components/apps/Browser/useBookmarkMenu"; @@ -7,13 +10,21 @@ import { createDirectoryIndex, type DirectoryEntries, } from "components/apps/Browser/directoryIndex"; -import { Arrow, Refresh, Stop } from "components/apps/Browser/NavigationIcons"; +import { + Arrow, + Network, + Refresh, + Stop, +} from "components/apps/Browser/NavigationIcons"; import StyledBrowser from "components/apps/Browser/StyledBrowser"; import { DINO_GAME, HOME_PAGE, LOCAL_HOST, NOT_FOUND, + OLD_NET_PROXY, + WAYBACK_URL_INFO, + type WaybackUrlInfo, bookmarks, } from "components/apps/Browser/config"; import { type ComponentProcessProps } from "components/system/Apps/RenderComponent"; @@ -102,6 +113,8 @@ const Browser: FC = ({ id }) => { position, moveHistory ); + const [proxyState, setProxyState] = useState("CORS"); + const proxyMenu = useProxyMenu(proxyState, setProxyState); const bookmarkMenu = useBookmarkMenu(); const setUrl = useCallback( async (addressInput: string): Promise => { @@ -302,7 +315,28 @@ const Browser: FC = ({ id }) => { setSrcDoc(newSrcDoc); prependFileToTitle(newTitle); } else { - const addressUrl = processedUrl.href; + 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; + } + } 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); + + addressUrl = `${proxyUrl}${processedUrl.href}`; + } changeIframeWindowLocation(addressUrl, contentWindow); @@ -357,6 +391,7 @@ const Browser: FC = ({ id }) => { initialTitle, open, prependFileToTitle, + proxyState, readFile, readdir, setIcon, @@ -423,6 +458,14 @@ const Browser: FC = ({ id }) => { }} {...ADDRESS_INPUT_PROPS} /> +