refactor(chat-view): optimize message rendering by pre-computing owne…

…rship checks (#2761)
zer0-os · Mar 10, 2025 · 5032af6 · 5032af6
1 parent e13bdfd
commit 5032af6
Showing 1 changed file with 6 additions and 4 deletions.
diff --git a/src/components/chat-view-container/chat-view.tsx b/src/components/chat-view-container/chat-view.tsx
@@ -138,17 +138,19 @@ export class ChatView extends React.Component<Properties, State> {
       if (message.isAdmin) {
         return <AdminMessageContainer key={message.optimisticId || message.id} message={message} />;
       } else {
+        const isUserOwner = this.isUserOwnerOfMessage(message);
+        const isUserOwnerOfParentMessage = this.isUserOwnerOfMessage(message.parentMessage);
         const messageRenderProps = getMessageRenderProps(
           index,
           groupMessages.length,
           this.props.isOneOnOne,
-          this.isUserOwnerOfMessage(message)
+          isUserOwner
         );
         return (
           <div
             key={message.optimisticId || message.id}
             className={classNames('messages__message-row', {
-              'messages__message-row--owner': this.isUserOwnerOfMessage(message),
+              'messages__message-row--owner': isUserOwner,
             })}
           >
             <div {...cn('group-message', messageRenderProps.position)}>
@@ -159,15 +161,15 @@ export class ChatView extends React.Component<Properties, State> {
                 onImageClick={this.openLightbox}
                 messageId={message.id}
                 updatedAt={message.updatedAt}
-                isOwner={this.isUserOwnerOfMessage(message)}
+                isOwner={isUserOwner}
                 isHidden={message.isHidden}
                 onDelete={this.props.deleteMessage}
                 onEdit={this.props.editMessage}
                 onReply={this.props.onReply}
                 onReportUser={this.props.onReportUser}
                 onInfo={this.openMessageInfo}
                 parentMessageText={message.parentMessageText}
-                parentSenderIsCurrentUser={this.isUserOwnerOfMessage(message.parentMessage)}
+                parentSenderIsCurrentUser={isUserOwnerOfParentMessage}
                 parentSenderFirstName={message.parentMessage?.sender?.firstName}
                 parentSenderLastName={message.parentMessage?.sender?.lastName}
                 parentMessageMediaUrl={message?.parentMessageMedia?.url}