move to npm logger, fix favicon, clan badges, user avatar

package.json

@@ -19,6 +19,7 @@
 		"typescript": "^5.8.3"
 	},
 	"dependencies": {
+		"@creations.works/logger": "^1.0.3",
 		"ejs": "^3.1.10",
 		"isomorphic-dompurify": "^2.23.0",
 		"marked": "^15.0.7",

public/css/index.css

@@ -222,8 +222,8 @@ body {
 }
 
 .clan-badge {
-	width: 50px;
+	width: fit-content;
-	height: 20px;
+	height: fit-content;
 	border-radius: 8px;
 	background-color: var(--card-bg);
 
@@ -232,7 +232,7 @@ body {
 	align-items: center;
 	justify-content: center;
 	gap: 0.3rem;
-	padding: .4rem 0.5rem;
+	padding: .3rem .5rem;
 
 	text-align: center;
 	align-items: center;

src/helpers/char.ts

@@ -1,6 +0,0 @@
-export function timestampToReadable(timestamp?: number): string {
-	const date: Date =
-		timestamp && !Number.isNaN(timestamp) ? new Date(timestamp) : new Date();
-	if (Number.isNaN(date.getTime())) return "Invalid Date";
-	return date.toISOString().replace("T", " ").replace("Z", "");
-}

src/helpers/logger.ts

@@ -1,205 +0,0 @@
-import type { Stats } from "node:fs";
-import {
-	type WriteStream,
-	createWriteStream,
-	existsSync,
-	mkdirSync,
-	statSync,
-} from "node:fs";
-import { EOL } from "node:os";
-import { basename, join } from "node:path";
-import { environment } from "@config/environment";
-import { timestampToReadable } from "@helpers/char";
-
-class Logger {
-	private static instance: Logger;
-	private static log: string = join(__dirname, "../../logs");
-
-	public static getInstance(): Logger {
-		if (!Logger.instance) {
-			Logger.instance = new Logger();
-		}
-
-		return Logger.instance;
-	}
-
-	private writeToLog(logMessage: string): void {
-		if (environment.development) return;
-
-		const date: Date = new Date();
-		const logDir: string = Logger.log;
-		const logFile: string = join(
-			logDir,
-			`${date.getFullYear()}-${date.getMonth() + 1}-${date.getDate()}.log`,
-		);
-
-		if (!existsSync(logDir)) {
-			mkdirSync(logDir, { recursive: true });
-		}
-
-		let addSeparator = false;
-
-		if (existsSync(logFile)) {
-			const fileStats: Stats = statSync(logFile);
-			if (fileStats.size > 0) {
-				const lastModified: Date = new Date(fileStats.mtime);
-				if (
-					lastModified.getFullYear() === date.getFullYear() &&
-					lastModified.getMonth() === date.getMonth() &&
-					lastModified.getDate() === date.getDate() &&
-					lastModified.getHours() !== date.getHours()
-				) {
-					addSeparator = true;
-				}
-			}
-		}
-
-		const stream: WriteStream = createWriteStream(logFile, { flags: "a" });
-
-		if (addSeparator) {
-			stream.write(`${EOL}${date.toISOString()}${EOL}`);
-		}
-
-		stream.write(`${logMessage}${EOL}`);
-		stream.close();
-	}
-
-	private extractFileName(stack: string): string {
-		const stackLines: string[] = stack.split("\n");
-		let callerFile = "";
-
-		for (let i = 2; i < stackLines.length; i++) {
-			const line: string = stackLines[i].trim();
-			if (line && !line.includes("Logger.") && line.includes("(")) {
-				callerFile = line.split("(")[1]?.split(")")[0] || "";
-				break;
-			}
-		}
-
-		return basename(callerFile);
-	}
-
-	private getCallerInfo(stack: unknown): {
-		filename: string;
-		timestamp: string;
-	} {
-		const filename: string =
-			typeof stack === "string" ? this.extractFileName(stack) : "unknown";
-
-		const readableTimestamp: string = timestampToReadable();
-
-		return { filename, timestamp: readableTimestamp };
-	}
-
-	public info(message: string | string[], breakLine = false): void {
-		const stack: string = new Error().stack || "";
-		const { filename, timestamp } = this.getCallerInfo(stack);
-
-		const joinedMessage: string = Array.isArray(message)
-			? message.join(" ")
-			: message;
-
-		const logMessageParts: ILogMessageParts = {
-			readableTimestamp: { value: timestamp, color: "90" },
-			level: { value: "[INFO]", color: "32" },
-			filename: { value: `(${filename})`, color: "36" },
-			message: { value: joinedMessage, color: "0" },
-		};
-
-		this.writeToLog(`${timestamp} [INFO] (${filename}) ${joinedMessage}`);
-		this.writeConsoleMessageColored(logMessageParts, breakLine);
-	}
-
-	public warn(message: string | string[], breakLine = false): void {
-		const stack: string = new Error().stack || "";
-		const { filename, timestamp } = this.getCallerInfo(stack);
-
-		const joinedMessage: string = Array.isArray(message)
-			? message.join(" ")
-			: message;
-
-		const logMessageParts: ILogMessageParts = {
-			readableTimestamp: { value: timestamp, color: "90" },
-			level: { value: "[WARN]", color: "33" },
-			filename: { value: `(${filename})`, color: "36" },
-			message: { value: joinedMessage, color: "0" },
-		};
-
-		this.writeToLog(`${timestamp} [WARN] (${filename}) ${joinedMessage}`);
-		this.writeConsoleMessageColored(logMessageParts, breakLine);
-	}
-
-	public error(
-		message: string | Error | (string | Error)[],
-		breakLine = false,
-	): void {
-		const stack: string = new Error().stack || "";
-		const { filename, timestamp } = this.getCallerInfo(stack);
-
-		const messages: (string | Error)[] = Array.isArray(message)
-			? message
-			: [message];
-		const joinedMessage: string = messages
-			.map((msg: string | Error): string =>
-				typeof msg === "string" ? msg : msg.message,
-			)
-			.join(" ");
-
-		const logMessageParts: ILogMessageParts = {
-			readableTimestamp: { value: timestamp, color: "90" },
-			level: { value: "[ERROR]", color: "31" },
-			filename: { value: `(${filename})`, color: "36" },
-			message: { value: joinedMessage, color: "0" },
-		};
-
-		this.writeToLog(`${timestamp} [ERROR] (${filename}) ${joinedMessage}`);
-		this.writeConsoleMessageColored(logMessageParts, breakLine);
-	}
-
-	public custom(
-		bracketMessage: string,
-		bracketMessage2: string,
-		message: string | string[],
-		color: string,
-		breakLine = false,
-	): void {
-		const stack: string = new Error().stack || "";
-		const { timestamp } = this.getCallerInfo(stack);
-
-		const joinedMessage: string = Array.isArray(message)
-			? message.join(" ")
-			: message;
-
-		const logMessageParts: ILogMessageParts = {
-			readableTimestamp: { value: timestamp, color: "90" },
-			level: { value: bracketMessage, color },
-			filename: { value: `${bracketMessage2}`, color: "36" },
-			message: { value: joinedMessage, color: "0" },
-		};
-
-		this.writeToLog(
-			`${timestamp} ${bracketMessage} (${bracketMessage2}) ${joinedMessage}`,
-		);
-		this.writeConsoleMessageColored(logMessageParts, breakLine);
-	}
-
-	public space(): void {
-		console.log();
-	}
-
-	private writeConsoleMessageColored(
-		logMessageParts: ILogMessageParts,
-		breakLine = false,
-	): void {
-		const logMessage: string = Object.keys(logMessageParts)
-			.map((key: string) => {
-				const part: ILogMessagePart = logMessageParts[key];
-				return `\x1b[${part.color}m${part.value}\x1b[0m`;
-			})
-			.join(" ");
-		console.log(logMessage + (breakLine ? EOL : ""));
-	}
-}
-
-const logger: Logger = Logger.getInstance();
-export { logger };

src/index.ts

@@ -1,4 +1,4 @@
-import { logger } from "@helpers/logger";
+import { logger } from "@creations.works/logger";
 
 import { serverHandler } from "@/server";
 

src/routes/[id].ts

@@ -41,11 +41,12 @@ async function handler(request: ExtendedRequest): Promise<Response> {
 		status = presence.discord_status;
 	}
 
+	const avatar: string = presence.discord_user.avatar
+		? `https://cdn.discordapp.com/avatars/${presence.discord_user.id}/${presence.discord_user.avatar}`
+		: `https://cdn.discordapp.com/embed/avatars/${Math.floor(Math.random() * 5)}.png`;
+
 	let colors: ImageColorResult | null = null;
 	if (presence.kv.colors === "true") {
-		const avatar: string = presence.discord_user.avatar
-			? `https://cdn.discordapp.com/avatars/${presence.discord_user.id}/${presence.discord_user.avatar}`
-			: `https://cdn.discordapp.com/embed/avatars/${presence.discord_user.discriminator || 1 % 5}`;
 		colors = await getImageColors(avatar, true);
 	}
 
@@ -64,6 +65,7 @@ async function handler(request: ExtendedRequest): Promise<Response> {
 		instance: instance,
 		readme: readme,
 		badgeApi: presence.kv.badges !== "false" ? badgeApi : null,
+		avatar: avatar,
 		colors: colors?.colors ?? {},
 		extraOptions: {
 			snow: presence.kv.snow === "true",

src/server.ts

@@ -1,6 +1,6 @@
 import { resolve } from "node:path";
 import { environment } from "@config/environment";
-import { logger } from "@helpers/logger";
+import { logger } from "@creations.works/logger";
 import {
 	type BunFile,
 	FileSystemRouter,
@@ -44,7 +44,9 @@ class ServerHandler {
 		];
 
 		logger.info(`Server running at ${accessUrls[0]}`);
-		logger.info(`Access via: ${accessUrls[1]} or ${accessUrls[2]}`, true);
+		logger.info(`Access via: ${accessUrls[1]} or ${accessUrls[2]}`, {
+			breakLine: true,
+		});
 
 		this.logRoutes();
 	}

src/views/index.ejs

@@ -30,6 +30,8 @@
 	<% } %>
 
 	<meta name="color-scheme" content="dark">
+
+	<link rel="icon" href="<%= avatar %>" type="image/png">
 </head>
 
 <body>
@@ -41,7 +43,7 @@
 	<div class="user-card">
 		<div class="avatar-status-wrapper">
 			<div class="avatar-wrapper">
-				<img class="avatar" src="https://cdn.discordapp.com/avatars/<%= user.id %>/<%= user.avatar %>" alt="Avatar">
+				<img class="avatar" src="<%= avatar %>" alt="Avatar">
 				<% if (user.avatar_decoration_data) { %>
 				<img class="decoration" src="https://cdn.discordapp.com/avatar-decoration-presets/<%= user.avatar_decoration_data.asset %>" alt="Decoration">
 				<% } %>

src/websocket.ts

@@ -1,4 +1,4 @@
-import { logger } from "@helpers/logger";
+import { logger } from "@creations.works/logger";
 import type { ServerWebSocket } from "bun";
 
 class WebSocketHandler {