From 9e2fbbe494edece7789934970da931ca701b8b74 Mon Sep 17 00:00:00 2001
From: Yuri Kuznetsov <yurikuzn@users.noreply.github.com>
Date: Thu, 16 Jun 2022 10:48:00 +0300
Subject: [PATCH] fix stream fetch-new race condition

---
 client/src/views/stream/record/list.js | 29 +++++++++++++++++++++++++-
 1 file changed, 28 insertions(+), 1 deletion(-)

diff --git a/client/src/views/stream/record/list.js b/client/src/views/stream/record/list.js
index 1473ecfd7e..40867725e0 100644
--- a/client/src/views/stream/record/list.js
+++ b/client/src/views/stream/record/list.js
@@ -39,11 +39,18 @@ define('views/stream/record/list', 'views/record/list-expanded', function (Dep)
 
             Dep.prototype.setup.call(this);
 
+            this.isRenderingNew = false;
+
             this.listenTo(this.collection, 'sync', (c, r, options) => {
                 if (!options.fetchNew) {
                     return;
                 }
 
+                if (this.isRenderingNew) {
+                    // Prevent race condition.
+                    return;
+                }
+
                 let lengthBeforeFetch = options.lengthBeforeFetch || 0;
 
                 if (lengthBeforeFetch === 0) {
@@ -56,15 +63,35 @@ define('views/stream/record/list', 'views/record/list-expanded', function (Dep)
 
                 let rowCount = this.collection.length - lengthBeforeFetch;
 
+                if (rowCount === 0) {
+                    return;
+                }
+
+                this.isRenderingNew = true;
+
                 for (let i = rowCount - 1; i >= 0; i--) {
                     let model = this.collection.at(i);
 
                     this.buildRow(i, model, view => {
                         view.getHtml(html => {
+                            if (i === 0) {
+                                this.isRenderingNew = false;
+                            }
+
                             let $row = $(this.getRowContainerHtml(model.id));
 
+                            // Prevent a race condition issue.
+                            let $existingRow = this.$el.find(`[data-id="${model.id}"]`);
+
+                            if ($existingRow.length) {
+                                $row = $existingRow;
+                            }
+
                             $row.append(html);
-                            $list.prepend($row);
+
+                            if (!$existingRow.length) {
+                                $list.prepend($row);
+                            }
 
                             view._afterRender();