Sanitizer: a newsletter's <title> showed as a line above the body

<title> is not an allowed tag, so nh3 unwrapped it and kept its text —
"mailer", "Email template" or the subject rendered before the content.
It is now dropped with its content, both in the sanitized HTML and in the
text derived from HTML-only mail (snippet and search). SANITIZER_VERSION
goes to 4 so stored bodies re-sanitize from the raw blob on next render.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

backend/app/indexer/mime.py

@@ -83,7 +83,14 @@ def _addresses(msg: EmailMessage, header: str) -> list[dict[str, str]]:
 
 def _html_to_text(html: str) -> str:
     """Derive plain text from HTML by stripping all tags (SPEC §6.4 nh3 strip)."""
-    return nh3.clean(html, tags=set(), attributes={}, strip_comments=True)
+    return nh3.clean(
+        html,
+        tags=set(),
+        attributes={},
+        strip_comments=True,
+        # The document <title> is not body text; unwrapped it would lead the snippet.
+        clean_content_tags={"script", "style", "title"},
+    )
 
 
 def _get_body_content(msg: EmailMessage, subtype: str) -> str | None:

backend/app/indexer/sanitize.py

@@ -17,7 +17,7 @@ import nh3
 
 # Bump when the sanitization policy changes; body_parts.sanitizer_v records it so a
 # render re-sanitizes stale content from the raw blob (SPEC §10.4).
-SANITIZER_VERSION = 3
+SANITIZER_VERSION = 4
 
 _ALLOWED_TAGS: set[str] = {
     # structure
@@ -218,8 +218,10 @@ def sanitize_html(
         link_rel="noopener noreferrer nofollow",
         strip_comments=True,
         # nh3 strips <script>/<style> *content* by default; we allow <style> (above)
-        # and sanitize its CSS ourselves, so only script content is stripped here.
-        clean_content_tags={"script"},
+        # and sanitize its CSS ourselves, so its content stays. <title> is dropped
+        # with its text: as a disallowed tag nh3 would unwrap it, and the document
+        # title ("mailer", the subject) would render as a line above the body.
+        clean_content_tags={"script", "title"},
         attribute_filter=attribute_filter,
     )
     cleaned = _sanitize_style_elements(cleaned, allow_remote_images, state)

backend/tests/indexer/test_mime.py

@@ -75,6 +75,13 @@ def test_html_only_derives_text() -> None:
     assert "<b>" not in parsed.text_body  # tags stripped for indexing text
 
 
+def test_html_only_text_skips_document_title() -> None:
+    parsed = parse_message(
+        _build(text=None, html="<html><head><title>mailer</title></head><p>Hello</p></html>")
+    )
+    assert parsed.snippet == "Hello"
+
+
 def test_multipart_alternative_prefers_html_for_display() -> None:
     parsed = parse_message(_build(text="text version", html="<p>html version</p>"))
     assert parsed.html_body is not None

backend/tests/indexer/test_sanitize.py

@@ -17,6 +17,19 @@ def test_scripts_and_handlers_are_removed() -> None:
     assert "hi" in result.html
 
 
+def test_document_title_is_not_rendered() -> None:
+    # Newsletters put "mailer" or the subject in <title>; unwrapping the tag would
+    # show it as a stray line above the body. Hidden preheaders keep their style.
+    html = (
+        "<html><head><title>mailer</title></head><body>"
+        '<span style="display:none">preview</span><p>Hi</p></body></html>'
+    )
+    result = sanitize_html(html, MID)
+    assert "mailer" not in result.html
+    assert '<span style="display:none">preview</span>' in result.html
+    assert "<p>Hi</p>" in result.html
+
+
 def test_remote_image_is_blocked_and_flagged() -> None:
     html = '<p>see <img src="http://tracker.example/pixel.gif"> this</p>'
     result = sanitize_html(html, MID)

frontend/src/components/list/MessageList.tsx

@@ -33,6 +33,28 @@ function initials(p: Address | undefined): string {
   return name.slice(0, 2).toUpperCase();
 }
 
+// Past this many characters the sender column switches to first names only.
+const SENDERS_FULL_MAX = 25;
+
+// The sender column's text: full names joined, or — when that would run past
+// SENDERS_FULL_MAX — each sender's first word ("Alice Smith" -> "Alice", a bare
+// address -> its local part). The user's own accounts are always `me`.
+export function senderNames(
+  senders: Address[],
+  isMe: (a: Address) => boolean,
+  me: string,
+): string {
+  const full = senders.map((a) => (isMe(a) ? me : a.name || a.email)).join(", ");
+  if (full.length <= SENDERS_FULL_MAX) return full;
+  return senders
+    .map((a) => {
+      if (isMe(a)) return me;
+      const name = a.name.trim();
+      return name ? name.split(/\s+/)[0] : a.email.split("@")[0];
+    })
+    .join(", ");
+}
+
 // Monocolor paperclip (inherits currentColor) — replaces the old emoji.
 function Paperclip() {
   return (
@@ -137,9 +159,7 @@ export function MessageList({
           // with the user's own accounts shown as "me" — so a thread you started
           // and someone answered reads "me, Alice". Recipients are not listed.
           const senders = thread.senders.length ? thread.senders : thread.participants.slice(0, 1);
-          const names = senders.length
-            ? senders.map((a) => (isMe(a) ? t("mail.me") : a.name || a.email)).join(", ")
-            : "(no one)";
+          const names = senders.length ? senderNames(senders, isMe, t("mail.me")) : "(no one)";
           // The avatar is the other side of the conversation where there is one.
           const primary = senders.find((a) => !isMe(a)) ?? senders[0];
           // The badge still counts everyone involved — the name is narrowed, the

frontend/src/test/senderNames.test.ts

@@ -0,0 +1,32 @@
+import { describe, expect, it } from "vitest";
+
+import { senderNames } from "../components/list/MessageList";
+import type { Address } from "../lib/types";
+
+const me = (a: Address) => a.email === "me@example.com";
+const addr = (name: string, email: string): Address => ({ name, email });
+
+describe("senderNames", () => {
+  it("keeps full names while they fit in 25 characters", () => {
+    const out = senderNames(
+      [addr("Alice Smith", "alice@x.com"), addr("", "me@example.com")],
+      me,
+      "me",
+    );
+    expect(out).toBe("Alice Smith, me");
+  });
+
+  it("falls back to first words past 25 characters, keeping me", () => {
+    const out = senderNames(
+      [
+        addr("Alice Smith", "alice@x.com"),
+        addr("Lukas R", "me@example.com"),
+        addr("Bob van der Berg", "bob@x.com"),
+        addr("", "carol.jones@y.com"),
+      ],
+      me,
+      "me",
+    );
+    expect(out).toBe("Alice, me, Bob, carol.jones");
+  });
+});