From 71db8e57f5b21bdae60fe43319259c7ad26a5fc1 Mon Sep 17 00:00:00 2001
From: bbassie <17990055+bbassie@users.noreply.github.com>
Date: Wed, 12 Aug 2026 10:58:30 +0000
Subject: [PATCH] Label Factorio output in the console with its log level

The Web UI console rendered server level entries as bare parsed Factorio
output, while every other level was prefixed with its name. Nothing in a
line distinguished what the game wrote from what Clusterio wrote about it,
which matters more now that both modes of the filter carry a mix of the
two.

Emit the [server] prefix for those entries as well, matching what
TerminalFormat already does for the host and controller logs, and style the
level the same bold the terminal colourises it with.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
---
 packages/web_ui/src/components/LogConsole.tsx | 10 ++++------
 packages/web_ui/src/style.css                 |  4 ++++
 2 files changed, 8 insertions(+), 6 deletions(-)

diff --git a/packages/web_ui/src/components/LogConsole.tsx b/packages/web_ui/src/components/LogConsole.tsx
index 5db8da63..0a201f0c 100644
--- a/packages/web_ui/src/components/LogConsole.tsx
+++ b/packages/web_ui/src/components/LogConsole.tsx
@@ -22,7 +22,7 @@ type Parsed = {
 	message: string;
 };
 
-function formatParsedOutput(parsed: Parsed, key: number) {
+function formatParsedOutput(parsed: Parsed) {
 	let time: ReactElement|string = "";
 	if (parsed.format === "seconds") {
 		time = <span className="factorio-time">{parsed.time.padStart(8)} </span>;
@@ -51,7 +51,7 @@ function formatParsedOutput(parsed: Parsed, key: number) {
 		info = <>[<span className="factorio-action">{parsed.action}</span>] </>;
 	}
 
-	return <span key={key}>{time}{info}{parsed.message}<br/></span>;
+	return <>{time}{info}{parsed.message}</>;
 }
 
 type Info = {
@@ -61,11 +61,9 @@ type Info = {
 };
 
 function formatLog(info: Info, key: number): ReactElement {
-	if (info.level === "server" && info.parsed) {
-		return formatParsedOutput(info.parsed, key);
-	}
 	let level = <span className={`log-${info.level}`}>{info.level}</span>;
-	return <span key={key}>[{level}] {info.message}<br/></span>;
+	let message = info.level === "server" && info.parsed ? formatParsedOutput(info.parsed) : info.message;
+	return <span key={key}>[{level}] {message}<br/></span>;
 }
 
 /**
diff --git a/packages/web_ui/src/style.css b/packages/web_ui/src/style.css
index 53cd7cdc..5553ceff 100644
--- a/packages/web_ui/src/style.css
+++ b/packages/web_ui/src/style.css
@@ -257,6 +257,10 @@ body {
 	color: #ad3939;
 }
 
+.log-server {
+	font-weight: bold;
+}
+
 .log-fatal {
 	font-weight: bold;
 	background-color: #ad3939;