From d740bba70a6f0ac15503f4f26c81b8d7f01be5b1 Mon Sep 17 00:00:00 2001
From: Ben Francis <ben@tola.me.uk>
Date: Mon, 21 Aug 2023 16:59:01 +0100
Subject: [PATCH] Only render things once - fixes #3103

---
 static/js/models/gateway-model.js | 23 +++++++++++++++++------
 1 file changed, 17 insertions(+), 6 deletions(-)

diff --git a/static/js/models/gateway-model.js b/static/js/models/gateway-model.js
index 896ca3eae..f6df82f18 100644
--- a/static/js/models/gateway-model.js
+++ b/static/js/models/gateway-model.js
@@ -22,7 +22,7 @@ class GatewayModel extends Model {
     this.groups = new Map();
     this.onMessage = this.onMessage.bind(this);
     this.queue = Promise.resolve(true);
-    this.connectWebSocket();
+    this.connectWebSockets();
     return this;
   }
 
@@ -137,16 +137,27 @@ class GatewayModel extends Model {
     }
   }
 
-  connectWebSocket() {
+  connectWebSockets() {
     const thingsHref = `${window.location.origin}/things?jwt=${API.jwt}`;
     const wsHref = thingsHref.replace(/^http/, 'ws');
-    this.ws = new ReopeningWebSocket(wsHref);
-    this.ws.addEventListener('open', this.refreshThings.bind(this));
-    this.ws.addEventListener('message', this.onMessage);
     const groupsHref = `${window.location.origin}/groups?jwt=${API.jwt}`;
     const groupsWsHref = groupsHref.replace(/^http/, 'ws');
+
+    this.ws = new ReopeningWebSocket(wsHref);
     this.groupsWs = new ReopeningWebSocket(groupsWsHref);
-    this.groupsWs.addEventListener('open', this.refreshThings.bind(this));
+
+    // Wait for things and groups sockets to open before showing Things
+    const thingsReady = new Promise((resolve) => {
+      this.ws.addEventListener('open', resolve);
+    });
+    const groupsReady = new Promise((resolve) => {
+      this.groupsWs.addEventListener('open', resolve);
+    });
+    Promise.all([thingsReady, groupsReady]).then(() => {
+      this.refreshThings();
+    });
+
+    this.ws.addEventListener('message', this.onMessage);
     this.groupsWs.addEventListener('message', this.onMessage);
   }