From 6dcceb81ac777ff80615bc3599a2504b42761c3a Mon Sep 17 00:00:00 2001
From: Fedor Indutny <79877362+indutny-signal@users.noreply.github.com>
Date: Tue, 17 Aug 2021 11:41:12 -0700
Subject: [PATCH] Use stable keys for rendering timeline

---
 ts/components/conversation/Timeline.tsx | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/ts/components/conversation/Timeline.tsx b/ts/components/conversation/Timeline.tsx
index 7cf0fd5a89b..77b98442962 100644
--- a/ts/components/conversation/Timeline.tsx
+++ b/ts/components/conversation/Timeline.tsx
@@ -680,6 +680,7 @@ export class Timeline extends React.PureComponent<PropsType, StateType> {
     const typingBubbleRow = this.getTypingBubbleRow();
     let rowContents: ReactNode;
 
+    let stableKey = key;
     if (haveOldest && row === 0) {
       rowContents = (
         <div data-row={row} style={styleWithWidth} role="row">
@@ -725,6 +726,7 @@ export class Timeline extends React.PureComponent<PropsType, StateType> {
         );
       }
       const messageId = items[itemIndex];
+      stableKey = messageId;
 
       rowContents = (
         <div
@@ -745,7 +747,7 @@ export class Timeline extends React.PureComponent<PropsType, StateType> {
       <CellMeasurer
         cache={this.cellSizeCache}
         columnIndex={0}
-        key={key}
+        key={stableKey}
         parent={parent}
         rowIndex={index}
         width={this.mostRecentWidth}