fix(web): use keyed Fragment in DMChat message mapping

This commit is contained in:
2026-07-27 08:49:41 -04:00
parent d9b3162f1c
commit 4e48815b91
+3 -4
View File
@@ -1,4 +1,4 @@
import { useEffect, useRef, useState, useCallback, memo } from "react"; import { useEffect, useRef, useState, useCallback, memo, Fragment } from "react";
import { useParams } from "react-router-dom"; import { useParams } from "react-router-dom";
import { useConversationStore, type ConversationMessage } from "../stores/conversation.ts"; import { useConversationStore, type ConversationMessage } from "../stores/conversation.ts";
import { useAuthStore } from "../stores/auth.ts"; import { useAuthStore } from "../stores/auth.ts";
@@ -330,9 +330,8 @@ export function DMChat() {
const lastReadId = id ? convStates[id] : undefined; const lastReadId = id ? convStates[id] : undefined;
const showDivider = lastReadId && msg.id === lastReadId && i < messages.length - 1; const showDivider = lastReadId && msg.id === lastReadId && i < messages.length - 1;
return ( return (
<> <Fragment key={msg.id}>
<DMMessageItem <DMMessageItem
key={msg.id}
msg={msg} msg={msg}
onAddReaction={handleAddReaction} onAddReaction={handleAddReaction}
activeReactionMessageId={activeReactionMessageId} activeReactionMessageId={activeReactionMessageId}
@@ -349,7 +348,7 @@ export function DMChat() {
<span className="flex-1 border-t border-gb-red"></span> <span className="flex-1 border-t border-gb-red"></span>
</div> </div>
)} )}
</> </Fragment>
); );
})} })}
<div ref={bottomRef} /> <div ref={bottomRef} />