benya/Messenger
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

web: add jump-to-message navigation from thread panel
Some checks failed
CI / test (push) Has been cancelled
Details

Browse Source
This commit is contained in:
Alex
2026-03-08 22:42:24 +03:00
parent 16f3d91c3b
commit 10eb82c82d
2 changed files with 23 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
web/src/components/MessageList.tsx
View File

@@ -310,6 +310,11 @@ export function MessageList() {
container.scrollTo({ top: container.scrollHeight, behavior: "smooth" });
}
function jumpToMessageInChat(messageId: number) {
setFocusedMessage(chatId, messageId);
setThreadRootId(null);
}
async function ensureReactionsLoaded(messageId: number) {
if (reactionsByMessage[messageId]) {
return;
@@ -956,13 +961,26 @@ export function MessageList() {
const indent = Math.min(6, depth) * 14;
return (
<div
className={`rounded-xl border px-3 py-2 ${isRoot ? "border-sky-400/60 bg-sky-500/10" : "border-slate-700/70 bg-slate-800/60"}`}
className={`cursor-pointer rounded-xl border px-3 py-2 transition-colors ${isRoot ? "border-sky-400/60 bg-sky-500/10" : "border-slate-700/70 bg-slate-800/60 hover:bg-slate-800/80"}`}
key={`thread-${threadMessage.id}`}
onClick={() => jumpToMessageInChat(threadMessage.id)}
style={{ marginLeft: `${indent}px` }}
>
<p className={`mb-1 text-[11px] ${own ? "text-sky-300" : "text-slate-400"}`}>
{isRoot ? "Original message" : `Reply • level ${depth}`} • {formatTime(threadMessage.created_at)}
</p>
<div className="mb-1 flex items-center justify-between gap-2">
<p className={`text-[11px] ${own ? "text-sky-300" : "text-slate-400"}`}>
{isRoot ? "Original message" : `Reply • level ${depth}`} • {formatTime(threadMessage.created_at)}
</p>
<button
className="rounded bg-slate-700/80 px-2 py-1 text-[10px] font-semibold text-slate-200 hover:bg-slate-600"
onClick={(event) => {
event.stopPropagation();
jumpToMessageInChat(threadMessage.id);
}}
type="button"
>
Jump in chat
</button>
</div>
<div className={own ? "text-slate-100" : "text-slate-200"}>
{renderMessageContent(threadMessage, {
attachments: attachmentsByMessage[threadMessage.id] ?? [],