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>

frontend/src/components/MessageContent.tsx

@@ -1,5 +1,6 @@
 import Markdown from 'markdown-to-jsx'
 import type { ReactNode } from 'react'
+import { Link } from 'react-router-dom'
 import { EMOJI_SHORTCODES } from '../lib/emojiShortcodes'
 
 interface MessageContentProps {
@@ -9,6 +10,13 @@ interface MessageContentProps {
   // component for markdown file previews, where "@mentioning a person"
   // doesn't apply.
   memberUsernames?: Set<string>
+  // #47: room-name -> id, scoped to rooms the *viewer* belongs to (not the
+  // sender, and not every site room) -- resolving purely against the
+  // viewer's own room list means a reference to a private room the viewer
+  // isn't in quietly renders as plain text instead of a link, the same way
+  // an @mention of someone outside the room does. Optional for the same
+  // reason memberUsernames is (FilePreviewModal reuse).
+  myRooms?: Map<string, string>
 }
 
 interface MarkdownImageLinkProps {
@@ -38,12 +46,22 @@ interface MarkdownLinkProps {
 // highlightMentions (below) turns a validated @username into a
 // `[@username](mention:username)` link so markdown-to-jsx parses it as a
 // normal link node -- this override is what turns that back into a styled
-// span instead of an actual anchor. Everything else renders as a real link,
-// same as before mentions existed.
+// span instead of an actual anchor. highlightRoomReferences does the same
+// trick for #roomname, but a room reference *is* meant to be navigable, so
+// it becomes a real (client-side-routed) Link instead of an inert span.
+// Everything else renders as a real external link, same as before mentions
+// existed.
 function MarkdownLink({ href, children }: MarkdownLinkProps) {
   if (href?.startsWith('mention:')) {
     return <span className="message-mention">{children}</span>
   }
+  if (href?.startsWith('room:')) {
+    return (
+      <Link to={`/rooms/${href.slice('room:'.length)}`} className="message-room-reference">
+        {children}
+      </Link>
+    )
+  }
   return (
     <a href={href} target="_blank" rel="noopener noreferrer">
       {children}
@@ -118,6 +136,40 @@ function highlightMentions(text: string, memberUsernames: Set<string>): string {
     .join('\n')
 }
 
+const ROOM_REFERENCE_PATTERN = /#([a-zA-Z0-9_.-]+)/g
+
+// Same trick as highlightMentions, targeting #roomname instead of
+// @username -- turns a validated reference into `[#roomname](room:id)` so
+// the `a` override above renders it as a real link. Kept in sync with
+// backend/app/services/room_reference_service.py's matching pattern (which
+// decides what actually gets stored server-side; this is purely a display-
+// time lookup against rooms the viewer already knows about).
+function highlightRoomReferences(text: string, myRooms: Map<string, string>): string {
+  if (myRooms.size === 0) return text
+  const lines = text.split('\n')
+  let inFence = false
+  return lines
+    .map((line) => {
+      if (/^\s*```/.test(line)) {
+        inFence = !inFence
+        return line
+      }
+      if (inFence) return line
+      return line
+        .split(/(`+[^`]*`+)/g)
+        .map((part, i) =>
+          i % 2 === 0
+            ? part.replace(ROOM_REFERENCE_PATTERN, (match, roomName) => {
+                const roomId = myRooms.get(roomName)
+                return roomId ? `[${match}](room:${roomId})` : match
+              })
+            : part,
+        )
+        .join('')
+    })
+    .join('\n')
+}
+
 // CommonMark treats a single newline as a soft break (rendered as a space),
 // not a visible line break -- only a trailing double-space or blank line
 // produces one. The Composer's Shift+Enter has always inserted a plain
@@ -154,7 +206,8 @@ export const MARKDOWN_OPTIONS = {
   },
 }
 
-export function MessageContent({ content, memberUsernames }: MessageContentProps) {
+export function MessageContent({ content, memberUsernames, myRooms }: MessageContentProps) {
   const withMentions = memberUsernames ? highlightMentions(content, memberUsernames) : content
-  return <Markdown options={MARKDOWN_OPTIONS}>{preserveLineBreaks(convertShortcodes(withMentions))}</Markdown>
+  const withRoomRefs = myRooms ? highlightRoomReferences(withMentions, myRooms) : withMentions
+  return <Markdown options={MARKDOWN_OPTIONS}>{preserveLineBreaks(convertShortcodes(withRoomRefs))}</Markdown>
 }