Ensure that message heights are always recomputed

ts/components/conversation/Timeline.tsx

@@ -81,6 +81,7 @@ export type PropsDataType = {
   isNearBottom?: boolean;
   items: ReadonlyArray<string>;
   loadCountdownStart?: number;
+  messageHeightChangeBaton?: unknown;
   messageHeightChangeIndex?: number;
   oldestUnreadIndex?: number;
   resetCounter: number;
@@ -132,7 +133,7 @@ export type PropsActionsType = {
   acknowledgeGroupMemberNameCollisions: (
     groupNameCollisions: Readonly<GroupNameCollisionsWithIdsByTitle>
   ) => void;
-  clearChangedMessages: (conversationId: string) => unknown;
+  clearChangedMessages: (conversationId: string, baton: unknown) => unknown;
   clearInvitedUuidsForNewlyCreatedGroup: () => void;
   closeContactSpoofingReview: () => void;
   setLoadCountdownStart: (
@@ -1031,6 +1032,7 @@ export class Timeline extends React.PureComponent<PropsType, StateType> {
       isIncomingMessageRequest,
       items,
       messageHeightChangeIndex,
+      messageHeightChangeBaton,
       oldestUnreadIndex,
       resetCounter,
       scrollToIndex,
@@ -1088,7 +1090,7 @@ export class Timeline extends React.PureComponent<PropsType, StateType> {
 
     if (isNumber(messageHeightChangeIndex)) {
       resizeStartRow = this.fromItemIndexToRow(messageHeightChangeIndex);
-      clearChangedMessages(id);
+      clearChangedMessages(id, messageHeightChangeBaton);
     }
 
     if (

ts/state/ducks/conversations.ts

@@ -622,6 +622,7 @@ export type ClearChangedMessagesActionType = {
   type: 'CLEAR_CHANGED_MESSAGES';
   payload: {
     conversationId: string;
+    baton: unknown;
   };
 };
 export type ClearSelectedMessageActionType = {
@@ -1691,12 +1692,14 @@ function setRecentMediaItems(
   };
 }
 function clearChangedMessages(
-  conversationId: string
+  conversationId: string,
+  baton: unknown
 ): ClearChangedMessagesActionType {
   return {
     type: 'CLEAR_CHANGED_MESSAGES',
     payload: {
       conversationId,
+      baton,
     },
   };
 }
@@ -3048,10 +3051,14 @@ export function reducer(
   }
   if (action.type === 'CLEAR_CHANGED_MESSAGES') {
     const { payload } = action;
-    const { conversationId } = payload;
+    const { conversationId, baton } = payload;
     const existingConversation = state.messagesByConversation[conversationId];
 
-    if (!existingConversation) {
+    if (
+      !existingConversation ||
+      existingConversation.heightChangeMessageIds !== baton
+    ) {
+      log.warn('CLEAR_CHANGED_MESSAGES used expired baton');
       return state;
     }
 

ts/state/selectors/conversations.ts

@@ -888,6 +888,7 @@ export function _conversationMessagesSelector(
     loadCountdownStart,
     items,
     isNearBottom,
+    messageHeightChangeBaton: heightChangeMessageIds,
     messageHeightChangeIndex:
       isNumber(messageHeightChangeIndex) && messageHeightChangeIndex >= 0
         ? messageHeightChangeIndex