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

@@ -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>;
 }
 
 /**

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;