Add #roomname references in chat messages (#47)

Mirrors the existing @-mention system's shape: a regex finds #roomname
tokens, extract_referenced_room_ids validates them against rooms the
*sender* actually belongs to (mirrors mentions' "must be a real member"
rule -- referencing a private room the sender isn't in would otherwise
leak its existence), and a MessageRoomReference join row is stored per
match in create_message. No notification/unread layer, unlike mentions --
referencing a room has no "you were referenced" semantics.

Rendering is the same markdown-link rewrite trick MessageContent.tsx
already uses for mentions (#username -> [#username](mention:username)),
but resolved against the *viewer's* own room list (threaded down from
ChatShellPage's room state through ChatPane/MessageList) rather than the
stored server-side reference -- a reference to a room the current viewer
isn't in quietly renders as plain text instead of a link, same as an
@mention of someone outside the room does. The href scheme renders a
real react-router Link instead of mentions' inert span, since a room
reference is meant to be navigable.

mention_service.strip_code_spans (was _strip_code_spans) is now shared
between both extraction paths rather than private to one module.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
ksmithandClaude Sonnet 5 committed 2026-08-17 19:03:18 -06:00
1 parent 8716fc5356
commit 12264b4d18
12 files changed
+305 -12

No files matched your search

+8
View File
@@ -9,6 +9,7 @@ import './ChatPane.css'
interface ChatPaneProps {
room: MyRoomItem
rooms: MyRoomItem[]
members: RoomMember[]
isMobile: boolean
onBack: () => void
@@ -20,6 +21,7 @@ interface ChatPaneProps {
export function ChatPane({
room,
rooms,
members,
isMobile,
onBack,
@@ -192,6 +194,11 @@ export function ChatPane({
[history, live],
)
// #47: name -> id for every room this user belongs to, so #roomname
// references can resolve to a real link -- deliberately the viewer's own
// rooms, not the sender's (see MessageContent.tsx's myRooms prop comment).
const myRooms = useMemo(() => new Map(rooms.map((r) => [r.name, r.id])), [rooms])
const connected = socket.connected
const send = useCallback(
(content: string, imageId?: string, fileId?: string) => socket.send(room.id, content, imageId, fileId),
@@ -246,6 +253,7 @@ export function ChatPane({
roomId={room.id}
messages={messages}
members={members}
myRooms={myRooms}
onEdit={sendEdit}
onReact={sendReaction}
/>