From c96f8997fe2a2d2b63483f6ef9acd3ee4c507ab5 Mon Sep 17 00:00:00 2001
From: Danny Avila <danny@librechat.ai>
Date: Fri, 12 Dec 2025 20:09:52 -0500
Subject: [PATCH] fix: Add key prop to MeasuredRow components in Conversations
 for improved rendering

- Updated MeasuredRow components to include a key prop for better performance and to prevent rendering issues during list updates.
- Ensured consistent handling of item types within the Conversations component.
---
 client/src/components/Conversations/Conversations.tsx | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/client/src/components/Conversations/Conversations.tsx b/client/src/components/Conversations/Conversations.tsx
index 63ee52ee9b..64b804b2d6 100644
--- a/client/src/components/Conversations/Conversations.tsx
+++ b/client/src/components/Conversations/Conversations.tsx
@@ -250,7 +250,7 @@ const Conversations: FC<ConversationsProps> = ({
 
       if (item.type === 'loading') {
         return (
-          <MeasuredRow {...rowProps}>
+          <MeasuredRow key={key} {...rowProps}>
             <LoadingSpinner />
           </MeasuredRow>
         );
@@ -258,7 +258,7 @@ const Conversations: FC<ConversationsProps> = ({
 
       if (item.type === 'favorites') {
         return (
-          <MeasuredRow {...rowProps}>
+          <MeasuredRow key={key} {...rowProps}>
             <FavoritesList
               isSmallScreen={isSmallScreen}
               toggleNav={toggleNav}
@@ -270,7 +270,7 @@ const Conversations: FC<ConversationsProps> = ({
 
       if (item.type === 'chats-header') {
         return (
-          <MeasuredRow {...rowProps}>
+          <MeasuredRow key={key} {...rowProps}>
             <ChatsHeader
               isExpanded={isChatsExpanded}
               onToggle={() => setIsChatsExpanded(!isChatsExpanded)}
@@ -285,7 +285,7 @@ const Conversations: FC<ConversationsProps> = ({
         // Without favorites: [chats-header, first-header] → index 1
         const firstHeaderIndex = shouldShowFavorites ? 2 : 1;
         return (
-          <MeasuredRow {...rowProps}>
+          <MeasuredRow key={key} {...rowProps}>
             <DateLabel groupName={item.groupName} isFirst={index === firstHeaderIndex} />
           </MeasuredRow>
         );
@@ -293,7 +293,7 @@ const Conversations: FC<ConversationsProps> = ({
 
       if (item.type === 'convo') {
         return (
-          <MeasuredRow {...rowProps}>
+          <MeasuredRow key={key} {...rowProps}>
             <MemoizedConvo conversation={item.convo} retainView={moveToTop} toggleNav={toggleNav} />
           </MeasuredRow>
         );