Update Lanyard socket URL, enhance IP logging in postAnalytics, and refactor App component structure

src/back/Sockets/Lanyard.ts

@@ -7,7 +7,7 @@ export default class {
 
 	constructor(callback: (data: LanyardData) => void) {
 		this._socket = new ReconnectingWebSocket(
-			"wss://lanyard.creations.works/socket",
+			"wss://lanyard.atums.world/socket",
 		);
 		this._keepAlive = null;
 		this._callback = callback;
@@ -55,7 +55,7 @@ export default class {
 			}
 		};
 
-		this._socket.onclose = () => {
+		this._socket.onclose = (e) => {
 			console.log("Lanyard socket closed");
 			if (this._keepAlive) {
 				clearInterval(this._keepAlive);

src/back/index.ts

@@ -10,7 +10,7 @@ const build = async () => {
 		minify: !development,
 		sourcemap: development ? "inline" : "none",
 		splitting: true,
-		publicPath: "/assets/",
+		publicPath: "/assets/"
 	});
 };
 
@@ -47,18 +47,28 @@ const postAnalytics = async (
 	req: Request | Bun.BunRequest,
 	server: Bun.Server,
 ) => {
+	const cfIp = req.headers.get("CF-Connecting-IP");
+	const realIp = req.headers.get("X-Real-IP");
+	const forwardedIp = req.headers.get("X-Forwarded-For");
+	const serverIp = server.requestIP(req)?.address;
+
+	console.log({
+		cfIp,
+		realIp,
+		forwardedIp,
+		serverIp,
+	});
+
 	return await fetch("https://plausible.creations.works/api/event", {
 		method: "POST",
 		headers: {
 			"Content-Type": "application/json",
 			"User-Agent": req.headers.get("user-agent") || "",
 			"X-Forwarded-For": String(
-				req.headers.get("CF-Connecting-IP") ||
-				req.headers.get("X-Real-IP") ||
-				req.headers.get("X-Forwarded-For")?.split(",")[0] ||
-				(typeof server.requestIP(req) === "string"
-					? server.requestIP(req)
-					: server.requestIP(req)?.address || ""),
+				cfIp ||
+				realIp ||
+				forwardedIp?.split(",")[0] ||
+				serverIp,
 			),
 		},
 		body: JSON.stringify({

src/front/App.tsx

@@ -1,145 +1,27 @@
 import Hyperate from "./components/Hyperate";
 import Lanyard from "./components/Lanyard";
 
-let latestLanyard: LanyardData | null = null;
-
-window.addEventListener("lanyard-update", (e) => {
-	latestLanyard = (e as CustomEvent<LanyardData>).detail;
-});
-
 export default () => {
-	const container = document.createElement("div");
-	container.className = "app terminal";
+	return (
+		<div class="app terminal">
+			<p>[seth@ipv4 ~]$ cat ./about.txt</p>
+			<p>
+				A Dedicated Backend Developer,
+				<br />
+				with a passion for high-fidelity audio,
+				<br />
+				gaming, and web development.
+			</p>
 
-	const renderElement = (content: string | Node) => {
-		const p = document.createElement("p");
-		if (typeof content === "string") {
-			p.textContent = content;
-		} else {
-			p.appendChild(content);
-		}
-		return p;
-	};
+			<p>[seth@ipv4 ~]$ cat /tmp/discord-ipc</p>
+			<p>
+				<Lanyard />
+			</p>
 
-	const prompt = "[seth@ipv4 ~]$";
-
-	const staticLines: (string | (() => Node))[] = [
-		`${prompt} cat ./about.txt`,
-		() =>
-			document
-				.createRange()
-				.createContextualFragment(
-					"A Dedicated Backend Developer,<br />with a passion for high-fidelity audio,<br />gaming, and web development.",
-				),
-		`${prompt} cat /tmp/discord-ipc`,
-		() => Lanyard(),
-		`${prompt} cat /tmp/heartrate`,
-		() => Hyperate(),
-	];
-
-	const renderStatic = () => {
-		for (const line of staticLines) {
-			const content = typeof line === "function" ? line() : line;
-			container.appendChild(renderElement(content));
-		}
-	};
-
-	renderStatic();
-
-	const lanyardInstance = Lanyard();
-	const files: Record<string, () => Node> = {
-		"./about.txt": () =>
-			document
-				.createRange()
-				.createContextualFragment(
-					"A Dedicated Backend Developer,<br />with a passion for high-fidelity audio,<br />gaming, and web development.",
-				),
-		"/tmp/discord-ipc": () => lanyardInstance,
-		"/tmp/heartrate": () => Hyperate(),
-	};
-
-	const history: string[] = [];
-	let historyIndex = -1;
-
-	const inputBox = document.createElement("input");
-	inputBox.className = "terminal-input";
-	inputBox.autofocus = true;
-
-	const inputLine = document.createElement("div");
-	inputLine.className = "terminal-line";
-
-	const promptSpan = document.createElement("span");
-	promptSpan.textContent = `${prompt} `;
-
-	inputLine.appendChild(promptSpan);
-	inputLine.appendChild(inputBox);
-	container.appendChild(inputLine);
-
-	const appendLine = (line: string | Node) => {
-		container.insertBefore(renderElement(line), inputLine);
-	};
-
-	inputBox.addEventListener("keydown", (e) => {
-		if (e.key === "Enter") {
-			const cmd = inputBox.value.trim();
-			if (!cmd) return;
-
-			history.push(cmd);
-			historyIndex = history.length;
-
-			appendLine(`${prompt} ${cmd}`);
-
-			let out: string | Node;
-
-			if (cmd.startsWith("cat ")) {
-				const file = cmd.slice(4).trim();
-				out = files[file]?.() ?? `cat: ${file}: No such file`;
-			} else if (cmd === "ls") {
-				out = Object.keys(files)
-					.filter((f) => f.startsWith("./"))
-					.map((f) => f.slice(2))
-					.join("\n");
-			} else if (cmd.startsWith("ls ")) {
-				const dir = cmd.slice(3).trim();
-				if (dir === "/tmp") {
-					out = Object.keys(files)
-						.filter((f) => f.startsWith("/tmp/"))
-						.map((f) => f.slice("/tmp/".length))
-						.join("\n");
-				} else {
-					out = `ls: cannot access '${dir}': No such file or directory`;
-				}
-			} else if (cmd === "help") {
-				out = [
-					"Available commands:",
-					"  cat [file]     View contents of a file",
-					"  ls             List files in current directory",
-					"  ls /tmp        List files in /tmp directory",
-					"  help           Show this message",
-				].join("\n");
-			} else {
-				out = `bash: ${cmd}: command not found`;
-			}
-
-			appendLine(out);
-			inputBox.value = "";
-		} else if (e.key === "ArrowUp") {
-			if (historyIndex > 0) {
-				historyIndex--;
-				inputBox.value = history[historyIndex] || "";
-			}
-			e.preventDefault();
-		} else if (e.key === "ArrowDown") {
-			if (historyIndex < history.length - 1) {
-				historyIndex++;
-				inputBox.value = history[historyIndex] || "";
-			} else {
-				historyIndex = history.length;
-				inputBox.value = "";
-			}
-			e.preventDefault();
-		}
-	});
-
-	return container;
+			<p>[seth@ipv4 ~]$ cat /tmp/heartrate</p>
+			<p>
+				<Hyperate />
+			</p>
+		</div>
+	);
 };

src/front/Socket.ts

@@ -41,9 +41,6 @@ class Socket extends EventTarget {
 
 	emitLanyard(lanyard: LanyardData) {
 		this.dispatchEvent(new CustomEvent("lanyard", { detail: lanyard }));
-		window.dispatchEvent(
-			new CustomEvent("lanyard-update", { detail: lanyard }),
-		);
 	}
 	emitHyperate(heartRate: number) {
 		this.dispatchEvent(new CustomEvent("hyperate", { detail: heartRate }));

src/front/index.css

@@ -14,11 +14,9 @@ body {
 body {
 	color: #dedede;
 	text-shadow: 0 0 5px #c8c8c8;
-	background: radial-gradient(
-		at bottom right,
+	background: radial-gradient(at bottom right,
 			var(--gradient-color, rgba(150, 150, 150, 0.1)) 0%,
-		rgba(0, 0, 0, 1) 100%
-	);
+			rgba(0, 0, 0, 1) 100%);
 	display: flex;
 	height: 100vh;
 	width: 100vw;
@@ -40,27 +38,5 @@ p {
 	display: flex;
 	flex-direction: column;
 	box-sizing: border-box;
-
 	gap: 0.4em;
 }
-
-.terminal-input {
-	background: transparent;
-	border: none;
-	color: inherit;
-	font: inherit;
-	outline: none;
-	display: inline-block;
-	width: 100%;
-}
-
-.terminal-line {
-	display: flex;
-	align-items: baseline;
-	flex-direction: row;
-	width: 100%;
-}
-
-.terminal-line > span {
-	white-space: pre;
-}

src/index.ts

@@ -9,7 +9,7 @@ let lanyard: LanyardData = {
 	activities: [],
 };
 
-await fs.rm("./dist", { recursive: true, force: true }).catch(() => {});
+await fs.rm("./dist", { recursive: true, force: true }).catch(() => { });
 
 if (!Backend.development) {
 	await Backend.build();
@@ -30,8 +30,9 @@ const server = serve({
 		"/assets/:file": async (req) =>
 			Backend.Responses.file(file(`./dist/${req.params.file}`)),
 
-		"/public/:file": async (req) =>
-			Backend.Responses.file(file(`./public/${req.params.file}`)),
+		"/robots.txt": async () => Backend.Responses.file(file("./public/robots.txt")),
+		"/favicon.svg": async () =>
+			Backend.Responses.file(file("./public/favicon.svg")),
 
 		"/api/server": () => {
 			const safeProcess = JSON.parse(JSON.stringify(process));