1 files changed, 61 insertions, 0 deletions
diff --git a/src/zenserver/frontend/html/pages/sessions.js b/src/zenserver/frontend/html/pages/sessions.js
new file mode 100644
index 000000000..95533aa96
--- /dev/null
+++ b/src/zenserver/frontend/html/pages/sessions.js
@@ -0,0 +1,61 @@
+// Copyright Epic Games, Inc. All Rights Reserved.
+
+"use strict";
+
+import { ZenPage } from "./page.js"
+import { Fetcher } from "../util/fetcher.js"
+import { Table } from "../util/widgets.js"
+
+////////////////////////////////////////////////////////////////////////////////
+export class Page extends ZenPage
+{
+	async main()
+	{
+		this.set_title("sessions");
+
+		const data = await new Fetcher().resource("/sessions/").json();
+		const sessions = data.sessions || [];
+
+		const section = this.add_section("Sessions");
+
+		if (sessions.length === 0)
+		{
+			section.tag().classify("empty-state").text("No active sessions.");
+			return;
+		}
+
+		const columns = [
+			"id",
+			"created",
+			"updated",
+			"metadata",
+		];
+		const table = section.add_widget(Table, columns, Table.Flag_FitLeft);
+
+		for (const session of sessions)
+		{
+			const created = session.created_at ? new Date(session.created_at).toLocaleString() : "-";
+			const updated = session.updated_at ? new Date(session.updated_at).toLocaleString() : "-";
+			const meta = this._format_metadata(session.metadata);
+
+			const row = table.add_row(
+				session.id || "-",
+				created,
+				updated,
+				meta,
+			);
+		}
+	}
+
+	_format_metadata(metadata)
+	{
+		if (!metadata || Object.keys(metadata).length === 0)
+		{
+			return "-";
+		}
+
+		return Object.entries(metadata)
+			.map(([k, v]) => `${k}: ${v}`)
+			.join(", ");
+	}
+}