fix: get all tests passing

coder · Parkreiner · May 23, 2025 · May 23, 2025 · May 23, 2025 · May 23, 2025
commit bc3d095aaa15e3695b2ee5e735dca7c407b8aa9a
@@ -7,6 +7,7 @@ import {
 } from "testHelpers/websockets";
 import { OneWayWebSocket } from "utils/OneWayWebSocket";
 import { createUseAgentLogs } from "./useAgentLogs";
+import { act } from "react";
 
 const millisecondsInOneMinute = 60_000;
 
@@ -82,14 +83,15 @@ describe("useAgentLogs", () => {
 	it("Automatically sorts logs that are received out of order", async () => {
 		const { hookResult, publisherResult } = mountHook();
 		const logs = generateMockLogs(10, new Date("september 9, 1999"));
-		const reversed = logs.toReversed();
 
-		for (const log of reversed) {
-			publisherResult.current.publishMessage(
-				new MessageEvent<string>("message", {
-					data: JSON.stringify(log),
-				}),
-			)
+		for (const log of logs.toReversed()) {
+			act(() => {
+				publisherResult.current.publishMessage(
+					new MessageEvent<string>("message", {
+						data: JSON.stringify([log]),
+					}),
+				)
+			})
 		}
 		await waitFor(() => expect(hookResult.current).toEqual(logs));
 	});
@@ -111,7 +113,7 @@ describe("useAgentLogs", () => {
 		const initialEvent = new MessageEvent<string>("message", {
 			data: JSON.stringify(initialLogs),
 		});
-		publisherResult.current.publishMessage(initialEvent);
+		act(() => publisherResult.current.publishMessage(initialEvent));
 		await waitFor(() => expect(hookResult.current).toEqual(initialLogs));
 
 		// Disable the hook (and have the hook close the connection behind the
@@ -126,7 +128,7 @@ describe("useAgentLogs", () => {
 		const newEvent = new MessageEvent<string>("message", {
 			data: JSON.stringify(newLogs),
 		});
-		publisherResult.current.publishMessage(newEvent);
+		act(() => publisherResult.current.publishMessage(newEvent));
 		await waitFor(() => expect(hookResult.current).toEqual(newLogs));
 	});
 });
@@ -34,19 +34,42 @@ export function createUseAgentLogs(createSocket: CreateSocket) {
 			// Always fetch the logs from the beginning. We may want to optimize
 			// this in the future, but it would add some complexity in the code
 			// that might not be worth it.
+			const createdAtMap = new Map<string, number>();
 			const socket = createSocket(agent.id, { after: 0 });
 			socket.addEventListener("message", (e) => {
 				if (e.parseError) {
 					console.warn("Error parsing agent log: ", e.parseError);
 					return;
 				}
-				setLogs((logs) => [...logs, ...e.parsedMessage]);
+
+				if (e.parsedMessage.length === 0) {
+					return;
+				}
+
+				setLogs((logs) => {
+					const newLogs = [...logs, ...e.parsedMessage];
+					newLogs.sort((l1, l2) => {
+						let d1 = createdAtMap.get(l1.created_at);
+						if (d1 === undefined) {
+							d1 = (new Date(l1.created_at)).getTime();
+							createdAtMap.set(l1.created_at, d1);
+						}
+						let d2 = createdAtMap.get(l2.created_at);
+						if (d2 === undefined) {
+							d2 = (new Date(l2.created_at)).getTime();
+							createdAtMap.set(l2.created_at, d2);
+						}
+						return d1 - d2;
+					});
+
+					return newLogs;
+				});
 			});
 
 			socket.addEventListener("error", (e) => {
 				console.error("Error in agent log socket: ", e);
 				displayError(
-					"Unable to watch the agent logs",
+					"Unable to watch agent logs",
 					"Please try refreshing the browser",
 				);
 				socket.close();