From b4ef6b6c77e796d793594555f092175f4f17a527 Mon Sep 17 00:00:00 2001
From: gatzjames <jamesgatzos@gmail.com>
Date: Wed, 7 Sep 2022 17:28:10 +0200
Subject: [PATCH 1/2] Reverse the event log order in the view and subscribe to
 messages after the latest

---
 packages/insomnia/src/main/network/websocket.ts            | 4 ++--
 .../context/websocket-client/use-ws-connection-events.ts   | 7 ++++++-
 2 files changed, 8 insertions(+), 3 deletions(-)

diff --git a/packages/insomnia/src/main/network/websocket.ts b/packages/insomnia/src/main/network/websocket.ts
index 18f9fbdbdd6..4354ef200fd 100644
--- a/packages/insomnia/src/main/network/websocket.ts
+++ b/packages/insomnia/src/main/network/websocket.ts
@@ -96,7 +96,7 @@ const dispatchWebSocketEvent = (target: Electron.WebContents, eventChannel: stri
   // Otherwise, append to send queue for this event channel.
   const sendQueue = sendQueueMap.get(eventChannel);
   if (sendQueue) {
-    sendQueue.push(wsEvent);
+    sendQueue.unshift(wsEvent);
   } else {
     sendQueueMap.set(eventChannel, [wsEvent]);
   }
@@ -433,7 +433,7 @@ const findMany = async (
   }
   const body = await fs.promises.readFile(response.bodyPath);
   return body.toString().split('\n').filter(e => e?.trim())
-    .map(e => JSON.parse(e)) || [];
+    .map(e => JSON.parse(e)).reverse() || [];
 };
 
 /**
diff --git a/packages/insomnia/src/ui/context/websocket-client/use-ws-connection-events.ts b/packages/insomnia/src/ui/context/websocket-client/use-ws-connection-events.ts
index 01a331803ad..8ada2d7a430 100644
--- a/packages/insomnia/src/ui/context/websocket-client/use-ws-connection-events.ts
+++ b/packages/insomnia/src/ui/context/websocket-client/use-ws-connection-events.ts
@@ -23,12 +23,17 @@ export function useWebSocketConnectionEvents({ responseId }: { responseId: strin
       if (isMounted) {
         setEvents(allEvents);
       }
+
+      const afterLatestEvent = (event: WebSocketEvent) => {
+        return event.timestamp > allEvents[0].timestamp;
+      };
+
       // Subscribe to new events and update the state.
       unsubscribe = window.main.on(`webSocket.${responseId}.event`,
         (_, events: WebSocketEvent[]) => {
           console.log('received events', events);
           if (isMounted) {
-            setEvents(allEvents => allEvents.concat(events));
+            setEvents(allEvents => events.filter(afterLatestEvent).concat(allEvents));
           }
 
           // Wait to give the CTS signal until we've rendered a frame.

From 9afe1564b785f92d3e589a7f9809bae6f2c7825b Mon Sep 17 00:00:00 2001
From: gatzjames <jamesgatzos@gmail.com>
Date: Thu, 8 Sep 2022 09:42:06 +0200
Subject: [PATCH 2/2] handle empty event list

---
 packages/insomnia/src/main/network/websocket.ts        |  6 +++++-
 .../websocket-client/use-ws-connection-events.ts       | 10 +++++++---
 2 files changed, 12 insertions(+), 4 deletions(-)

diff --git a/packages/insomnia/src/main/network/websocket.ts b/packages/insomnia/src/main/network/websocket.ts
index 4354ef200fd..4fc7895c720 100644
--- a/packages/insomnia/src/main/network/websocket.ts
+++ b/packages/insomnia/src/main/network/websocket.ts
@@ -96,6 +96,7 @@ const dispatchWebSocketEvent = (target: Electron.WebContents, eventChannel: stri
   // Otherwise, append to send queue for this event channel.
   const sendQueue = sendQueueMap.get(eventChannel);
   if (sendQueue) {
+    // Add the event to the top of queue so that the latest message is first.
     sendQueue.unshift(wsEvent);
   } else {
     sendQueueMap.set(eventChannel, [wsEvent]);
@@ -433,7 +434,10 @@ const findMany = async (
   }
   const body = await fs.promises.readFile(response.bodyPath);
   return body.toString().split('\n').filter(e => e?.trim())
-    .map(e => JSON.parse(e)).reverse() || [];
+    // Parse the message
+    .map(e => JSON.parse(e))
+    // Reverse the list of messages so that we get the latest message first
+    .reverse() || [];
 };
 
 /**
diff --git a/packages/insomnia/src/ui/context/websocket-client/use-ws-connection-events.ts b/packages/insomnia/src/ui/context/websocket-client/use-ws-connection-events.ts
index 8ada2d7a430..0098948a8b9 100644
--- a/packages/insomnia/src/ui/context/websocket-client/use-ws-connection-events.ts
+++ b/packages/insomnia/src/ui/context/websocket-client/use-ws-connection-events.ts
@@ -24,8 +24,12 @@ export function useWebSocketConnectionEvents({ responseId }: { responseId: strin
         setEvents(allEvents);
       }
 
-      const afterLatestEvent = (event: WebSocketEvent) => {
-        return event.timestamp > allEvents[0].timestamp;
+      const afterLatestEvent = (event: WebSocketEvent, prevEvents: WebSocketEvent[]) => {
+        if (prevEvents.length === 0) {
+          return true;
+        }
+
+        return event.timestamp > prevEvents[0]?.timestamp;
       };
 
       // Subscribe to new events and update the state.
@@ -33,7 +37,7 @@ export function useWebSocketConnectionEvents({ responseId }: { responseId: strin
         (_, events: WebSocketEvent[]) => {
           console.log('received events', events);
           if (isMounted) {
-            setEvents(allEvents => events.filter(afterLatestEvent).concat(allEvents));
+            setEvents(prevEvents => events.filter(event => afterLatestEvent(event, prevEvents)).concat(prevEvents));
           }
 
           // Wait to give the CTS signal until we've rendered a frame.