feat: conversations on the left, the transcript on the right (#6)

src/lib/markdown.ts

@@ -15,14 +15,18 @@ import type { ChatTurn, ThreadMessage } from "./types";
 export const STREAMING_CURSOR = "▍";
 
 /**
- * Role markers for the transcript.
+ * Speaker labels.
  *
- * Emoji rather than icon images: Vicinae's markdown renderer is minimal and
- * there is no reliable way to inline an `icon://` reference into markdown, but
- * plain text always renders.
+ * Plain text, not icons. Vicinae's markdown renderer draws images as
+ * block-level, centred elements capped at 200px tall (`MdImage.qml`), and none
+ * of the candidate sources resolve inside markdown — `icon://person`, a raw
+ * icon slug, and a `file://` asset path were all tried and each one fell back
+ * to rendering the alt text as a caption. An icon therefore cannot sit inline
+ * beside a message the way a text label can. The dim/bright styling carries
+ * most of the distinction regardless.
  */
-export const USER_MARKER = "👤";
-export const ASSISTANT_MARKER = "✨";
+export const USER_LABEL = "You";
+export const ASSISTANT_LABEL = "Lam";
 
 /** Prefixes every line so a multi-line message stays one continuous quote block. */
 export function quote(text: string): string {
@@ -41,11 +45,11 @@ export function previewText(text: string, max: number): string {
 
 function renderMessage(message: ThreadMessage): string {
   if (message.role === "user") {
-    return `${USER_MARKER} **You**\n\n${quote(message.text)}`;
+    return `**${USER_LABEL}**\n\n${quote(message.text)}`;
   }
 
   const body = message.text.trim() || (message.isStreaming ? "_Thinking…_" : "_No response._");
-  const sections = [`${ASSISTANT_MARKER} **Lam**`, "", message.isStreaming ? `${body} ${STREAMING_CURSOR}` : body];
+  const sections = [`**${ASSISTANT_LABEL}**`, "", message.isStreaming ? `${body} ${STREAMING_CURSOR}` : body];
 
   if (message.error) {
     sections.push("", `**Error** — ${message.error}`);