feat: add DM mode support to ChatHeader with recipient info

Adds dmMode option (hides member-list toggle), exposes hashEl in refs,
and adds updateChatHeaderForDm helper that swaps # for @, sets username
and status when a DM recipient is active.
This commit is contained in:
jevb
2026-03-27 11:46:49 +01:00
parent a90018f2c7
commit cf77deed5d
@@ -3,7 +3,7 @@
* and member-list toggle.
*/
import { createElement, appendChildren } from "@lib/dom";
import { createElement, appendChildren, setText } from "@lib/dom";
import { createIcon } from "@lib/icons";
// ---------------------------------------------------------------------------
@@ -11,6 +11,7 @@ import { createIcon } from "@lib/icons";
// ---------------------------------------------------------------------------
export interface ChatHeaderRefs {
readonly hashEl: HTMLSpanElement;
readonly nameEl: HTMLSpanElement;
readonly topicEl: HTMLSpanElement;
}
@@ -19,6 +20,7 @@ export interface ChatHeaderOptions {
readonly onTogglePins: () => void;
readonly onToggleMembers: () => void;
readonly onSearchFocus?: () => void;
readonly dmMode?: boolean;
}
// ---------------------------------------------------------------------------
@@ -64,8 +66,28 @@ export function buildChatHeader(
});
membersToggle.appendChild(createIcon("users", 18));
membersToggle.addEventListener("click", () => opts.onToggleMembers());
if (opts.dmMode === true) {
membersToggle.style.display = "none";
}
appendChildren(tools, searchInput, pinBtn, membersToggle);
appendChildren(header, hash, nameEl, divider, topicEl, tools);
return { element: header, refs: { nameEl, topicEl } };
return { element: header, refs: { hashEl: hash, nameEl, topicEl } };
}
// ---------------------------------------------------------------------------
// DM mode helper
// ---------------------------------------------------------------------------
export function updateChatHeaderForDm(
refs: ChatHeaderRefs,
recipient: { username: string; status: string } | null,
): void {
if (recipient !== null) {
setText(refs.hashEl, "@");
setText(refs.nameEl, recipient.username);
setText(refs.topicEl, recipient.status);
} else {
setText(refs.hashEl, "#");
}
}