feat: Add Langfuse tracing support and UI enhancements

- Updated .env.example and README.md to include LANGFUSE_PROJECT_ID and LANGFUSE_PUBLIC_TRACES configurations.
- Enhanced session bootstrap payload to include Langfuse settings for tracing.
- Implemented UI components for displaying trace history and dropdown functionality.
- Updated main.js to manage trace dropdown interactions and render trace history.
- Added tests to validate Langfuse tracing behavior and ensure proper metadata handling.

.env.example

@@ -36,8 +36,10 @@ OLLAMA_API_KEY=ollama
 LANGFUSE_ENABLED=false
 LANGFUSE_HOST=https://cloud.langfuse.com
 LANGFUSE_BASE_URL=  # Optional alternative to LANGFUSE_HOST
+LANGFUSE_PROJECT_ID=  # Required for frontend deep links: project/<project_id>/...
 LANGFUSE_PUBLIC_KEY=
 LANGFUSE_SECRET_KEY=
+LANGFUSE_PUBLIC_TRACES=false  # Mark traces public so non-members can open shared links
 LANGFUSE_TRACE_FINALIZE_TIMEOUT_MS=8000
 LANGFUSE_POST_TOOL_RESPONSE_TIMEOUT_MS=30000
 LANGFUSE_MAX_PENDING_TRACE_TASKS=200

README.md

@@ -167,12 +167,22 @@ LLM_PROVIDER=ollama
 LANGFUSE_ENABLED=true
 LANGFUSE_HOST=https://cloud.langfuse.com
 # LANGFUSE_BASE_URL=https://us.cloud.langfuse.com  # optional alternative
+LANGFUSE_PROJECT_ID=clkpwwm0m000gmm094odg11gi
 LANGFUSE_PUBLIC_KEY=pk-lf-...
 LANGFUSE_SECRET_KEY=sk-lf-...
+LANGFUSE_PUBLIC_TRACES=false
 ```
 
 Each finalized user transcript creates a new trace with spans `stt`, `llm`, and `tts`.
 The Streamlit client generates a new `session_id` on each Connect click and sends it to the agent.
+The header includes a live traces dropdown that updates as finalized turns arrive.
+Each entry shows the full `trace_id`, local created-at time, and an `Open Trace` link to:
+`https://cloud.langfuse.com/project/<project_id>/traces/<trace_id>`.
+
+Notes:
+
+- `LANGFUSE_PROJECT_ID` is required to build trace deep links in the UI.
+- Session pages are intentionally not linked from the frontend because they are project-member scoped in Langfuse Cloud.
 
 ### LLM runtime resilience
 

src/agent/traces/turn_tracer.py

@@ -1997,6 +1997,7 @@ def _set_root_attributes(
         "langfuse.trace.name": "turn",
         "langfuse.trace.input": turn.user_transcript,
         "langfuse.trace.output": trace_output,
+        "langfuse.trace.public": bool(settings.langfuse.LANGFUSE_PUBLIC_TRACES),
         "langfuse.trace.metadata.room_id": turn.room_id,
         "langfuse.trace.metadata.participant_id": turn.participant_id,
         "langfuse.trace.metadata.turn_id": turn.turn_id,

src/api/session_bootstrap.py

@@ -36,6 +36,10 @@ class SessionBootstrapPayload:
     session_id: str
     dispatch_id: str | None
     dispatch_worker_id: str | None
+    langfuse_enabled: bool
+    langfuse_host: str | None
+    langfuse_project_id: str | None
+    langfuse_public_traces: bool
 
 
 def build_session_bootstrap_payload() -> SessionBootstrapPayload:
@@ -85,6 +89,9 @@ def _build_session_bootstrap_payload_once() -> SessionBootstrapPayload:
             assigned_worker_id = state.worker_id
             break
 
+    langfuse_host = _normalize_langfuse_host()
+    langfuse_project_id = _normalize_langfuse_project_id()
+
     payload = SessionBootstrapPayload(
         room_name=room_name,
         token=token_data.token,
@@ -92,6 +99,14 @@ def _build_session_bootstrap_payload_once() -> SessionBootstrapPayload:
         session_id=session_id,
         dispatch_id=getattr(dispatch, "id", None),
         dispatch_worker_id=assigned_worker_id,
+        langfuse_enabled=bool(
+            settings.langfuse.LANGFUSE_ENABLED
+            and langfuse_host
+            and langfuse_project_id
+        ),
+        langfuse_host=langfuse_host,
+        langfuse_project_id=langfuse_project_id,
+        langfuse_public_traces=bool(settings.langfuse.LANGFUSE_PUBLIC_TRACES),
     )
     logger.info(
         "Prepared session bootstrap payload room=%s participant=%s dispatch_id=%s worker_id=%s",
@@ -103,6 +118,22 @@ def _build_session_bootstrap_payload_once() -> SessionBootstrapPayload:
     return payload
 
 
+def _normalize_langfuse_host() -> str | None:
+    host = settings.langfuse.LANGFUSE_HOST or settings.langfuse.LANGFUSE_BASE_URL
+    if not isinstance(host, str):
+        return None
+    normalized = host.strip().rstrip("/")
+    return normalized or None
+
+
+def _normalize_langfuse_project_id() -> str | None:
+    project_id = settings.langfuse.LANGFUSE_PROJECT_ID
+    if not isinstance(project_id, str):
+        return None
+    normalized = project_id.strip()
+    return normalized or None
+
+
 def _is_retryable_bootstrap_error(exc: Exception) -> bool:
     if isinstance(exc, livekit_api.TwirpError):
         return exc.code in RETRYABLE_TWIRP_CODES

src/core/settings.py

@@ -196,7 +196,7 @@ class LLMSettings(CoreSettings):
         description="OpenAI-compatible Ollama endpoint",
     )
     OLLAMA_MODEL: str = Field(
-        default= "ministral-3:8b", #"qwen3:8b" #"qwen3.5:4b", #"ministral-3:8b", #"qwen2.5:7b"
+        default= "kimi-k2.5", #"ministral-3:8b", #"qwen2.5:7b" #"qwen3:8b" #"qwen3.5:4b",
         description="Ollama model tag",
     )
     OLLAMA_API_KEY: Optional[str] = Field(
@@ -262,6 +262,14 @@ class LangfuseSettings(CoreSettings):
         default=None,
         description="Alternative to LANGFUSE_HOST",
     )
+    LANGFUSE_PROJECT_ID: Optional[str] = Field(
+        default="cmlrbwznk04ogad07cosnpxoh",
+        description="Langfuse project ID used to build UI deep links",
+    )
+    LANGFUSE_PUBLIC_TRACES: bool = Field(
+        default=True,
+        description="Mark emitted Langfuse traces as public for shareable URLs",
+    )
     LANGFUSE_TRACE_FINALIZE_TIMEOUT_MS: float = Field(
         default=8000.0,
         ge=0.0,

src/ui/index.html

@@ -63,6 +63,11 @@
         align-items: center;
         gap: 12px;
       }
+      .header-right {
+        display: flex;
+        align-items: center;
+        gap: 10px;
+      }
       .logo {
         font-size: 18px;
         font-weight: 700;
@@ -164,6 +169,119 @@
         background: rgba(239, 68, 68, 0.1);
         border-color: rgba(239, 68, 68, 0.5);
       }
+      .trace-dropdown {
+        position: relative;
+        min-width: 360px;
+      }
+      .trace-dropdown-toggle {
+        width: 100%;
+        border-radius: 10px;
+        border: 1px solid var(--border);
+        background: var(--bg-tertiary);
+        color: var(--text-primary);
+        padding: 8px 10px;
+        font-size: 11px;
+        font-weight: 600;
+        line-height: 1;
+        display: inline-flex;
+        align-items: center;
+        justify-content: space-between;
+        gap: 8px;
+        cursor: pointer;
+        transition: border-color 0.2s, background 0.2s;
+      }
+      .trace-dropdown-toggle:hover:not(:disabled) {
+        border-color: rgba(108, 143, 255, 0.45);
+        background: var(--bg-card);
+      }
+      .trace-dropdown-toggle:disabled {
+        opacity: 0.45;
+        cursor: not-allowed;
+      }
+      .trace-dropdown-label {
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+      .trace-dropdown-chevron {
+        width: 14px;
+        height: 14px;
+        color: var(--text-secondary);
+        flex-shrink: 0;
+        transition: transform 0.2s ease;
+      }
+      .trace-dropdown-toggle[aria-expanded="true"] .trace-dropdown-chevron {
+        transform: rotate(180deg);
+      }
+      .trace-dropdown-menu {
+        position: absolute;
+        top: calc(100% + 6px);
+        right: 0;
+        width: min(520px, 78vw);
+        max-height: 320px;
+        overflow-y: auto;
+        border-radius: 10px;
+        border: 1px solid var(--border-light);
+        background: #111725;
+        box-shadow: 0 10px 32px rgba(0, 0, 0, 0.35);
+        z-index: 60;
+        padding: 8px;
+      }
+      .trace-dropdown-empty {
+        font-size: 11px;
+        color: var(--text-muted);
+        padding: 8px;
+      }
+      .trace-dropdown-list {
+        display: flex;
+        flex-direction: column;
+        gap: 6px;
+      }
+      .trace-entry {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        gap: 8px;
+        padding: 8px;
+        border-radius: 8px;
+        border: 1px solid rgba(108, 143, 255, 0.18);
+        background: rgba(108, 143, 255, 0.05);
+      }
+      .trace-entry-meta {
+        min-width: 0;
+        display: flex;
+        flex-direction: column;
+        gap: 3px;
+      }
+      .trace-entry-id {
+        font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
+        font-size: 11px;
+        color: var(--text-primary);
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+      .trace-entry-time {
+        font-size: 10px;
+        color: var(--text-secondary);
+      }
+      .trace-entry-open {
+        flex-shrink: 0;
+        padding: 6px 9px;
+        border-radius: 7px;
+        border: 1px solid rgba(108, 143, 255, 0.5);
+        color: #b8c9ff;
+        text-decoration: none;
+        background: rgba(108, 143, 255, 0.08);
+        font-size: 10px;
+        font-weight: 700;
+        text-transform: uppercase;
+        letter-spacing: 0.05em;
+      }
+      .trace-entry-open:hover {
+        border-color: rgba(108, 143, 255, 0.7);
+        color: #d7e1ff;
+      }
 
       /* Main layout — single column, top to bottom */
       .main {
@@ -663,6 +781,20 @@
       }
 
       @media (max-width: 1100px) {
+        .header {
+          flex-wrap: wrap;
+          align-items: flex-start;
+          gap: 10px;
+        }
+        .header-right {
+          width: 100%;
+          justify-content: space-between;
+          flex-wrap: wrap;
+        }
+        .trace-dropdown {
+          flex: 1;
+          min-width: 280px;
+        }
         .pipeline-stage-row {
           grid-template-columns: repeat(2, minmax(0, 1fr));
         }
@@ -692,6 +824,35 @@
         }
       }
       @media (max-width: 700px) {
+        .header {
+          padding: 12px 14px;
+        }
+        .header-left {
+          width: 100%;
+          justify-content: space-between;
+        }
+        .header-right {
+          width: 100%;
+          flex-direction: column;
+          align-items: stretch;
+          gap: 8px;
+        }
+        .trace-dropdown {
+          width: 100%;
+          min-width: 0;
+        }
+        .trace-dropdown-menu {
+          left: 0;
+          right: 0;
+          width: 100%;
+        }
+        .controls {
+          width: 100%;
+        }
+        .controls button {
+          flex: 1;
+          justify-content: center;
+        }
         .waveform-section {
           min-height: 160px;
           padding: 14px 14px 10px;
@@ -762,19 +923,40 @@
           <span id="status">Idle</span>
         </div>
       </div>
-      <div class="controls">
-        <button id="connect" class="btn-primary">
-          <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14"/><path d="m12 5 7 7-7 7"/></svg>
-          Connect
-        </button>
-        <button id="disconnect" class="btn-danger" disabled>
-          <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="18" height="18" rx="2"/></svg>
-          Disconnect
-        </button>
-        <button id="mute" disabled>
-          <svg id="mic-icon" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><path d="M12 2a3 3 0 0 0-3 3v7a3 3 0 0 0 6 0V5a3 3 0 0 0-3-3Z"/><path d="M19 10v2a7 7 0 0 1-14 0v-2"/><line x1="12" x2="12" y1="19" y2="22"/></svg>
-          Mute
-        </button>
+      <div class="header-right">
+        <div class="trace-dropdown" id="trace-dropdown">
+          <button
+            type="button"
+            class="trace-dropdown-toggle"
+            id="trace-dropdown-toggle"
+            aria-expanded="false"
+            aria-controls="trace-dropdown-menu"
+            disabled
+          >
+            <span class="trace-dropdown-label" id="trace-dropdown-label">Connect to initialize trace links.</span>
+            <svg class="trace-dropdown-chevron" viewBox="0 0 16 16" fill="none" aria-hidden="true">
+              <path d="M4 6l4 4 4-4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
+            </svg>
+          </button>
+          <div class="trace-dropdown-menu" id="trace-dropdown-menu" hidden>
+            <div class="trace-dropdown-empty" id="trace-dropdown-empty">No traces yet.</div>
+            <div class="trace-dropdown-list" id="trace-dropdown-list"></div>
+          </div>
+        </div>
+        <div class="controls">
+          <button id="connect" class="btn-primary">
+            <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14"/><path d="m12 5 7 7-7 7"/></svg>
+            Connect
+          </button>
+          <button id="disconnect" class="btn-danger" disabled>
+            <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="18" height="18" rx="2"/></svg>
+            Disconnect
+          </button>
+          <button id="mute" disabled>
+            <svg id="mic-icon" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><path d="M12 2a3 3 0 0 0-3 3v7a3 3 0 0 0 6 0V5a3 3 0 0 0-3-3Z"/><path d="M19 10v2a7 7 0 0 1-14 0v-2"/><line x1="12" x2="12" y1="19" y2="22"/></svg>
+            Mute
+          </button>
+        </div>
       </div>
     </div>
 

src/ui/main.js

@@ -59,10 +59,198 @@ const toolDescEl = document.getElementById("live-tool-desc");
 const toolListEl = document.getElementById("live-tool-list");
 const postToolStageRowEl = document.getElementById("post-tool-stage-row");
 const totalTurnCardEl = document.getElementById("total-turn-card");
+const traceDropdownEl = document.getElementById("trace-dropdown");
+const traceDropdownToggleEl = document.getElementById("trace-dropdown-toggle");
+const traceDropdownLabelEl = document.getElementById("trace-dropdown-label");
+const traceDropdownMenuEl = document.getElementById("trace-dropdown-menu");
+const traceDropdownListEl = document.getElementById("trace-dropdown-list");
+const traceDropdownEmptyEl = document.getElementById("trace-dropdown-empty");
 let activeLiveSpeechId = null;
 let liveTurnValues = createEmptyLiveTurnValues();
 let toolPhaseExpanded = true;
 let toolTurnActive = false;
+let langfuseEnabled = false;
+let langfuseHost = null;
+let langfuseProjectId = null;
+let traceHistory = [];
+const TRACE_HISTORY_LIMIT = 100;
+
+function normalizeNonEmptyString(value) {
+  if (typeof value !== "string") return null;
+  const trimmed = value.trim();
+  return trimmed.length > 0 ? trimmed : null;
+}
+
+function normalizeLangfuseHost(value) {
+  const normalized = normalizeNonEmptyString(value);
+  if (!normalized) return null;
+  const withoutSlash = normalized.replace(/\/+$/, "");
+  if (!/^https?:\/\//i.test(withoutSlash)) return null;
+  return withoutSlash;
+}
+
+function buildLangfuseTraceUrl(host, projectId, traceId) {
+  return `${host}/project/${encodeURIComponent(projectId)}/traces/${encodeURIComponent(traceId)}`;
+}
+
+function formatTraceCreatedAtLocal(epochSeconds) {
+  if (typeof epochSeconds !== "number" || !Number.isFinite(epochSeconds)) {
+    return "--";
+  }
+  const date = new Date(epochSeconds * 1000);
+  if (Number.isNaN(date.getTime())) {
+    return "--";
+  }
+  return date.toLocaleString(undefined, {
+    year: "numeric",
+    month: "2-digit",
+    day: "2-digit",
+    hour: "2-digit",
+    minute: "2-digit",
+    second: "2-digit",
+  });
+}
+
+function closeTraceDropdown() {
+  if (traceDropdownMenuEl) {
+    traceDropdownMenuEl.hidden = true;
+  }
+  if (traceDropdownToggleEl) {
+    traceDropdownToggleEl.setAttribute("aria-expanded", "false");
+  }
+}
+
+function renderTraceHistory() {
+  if (!traceDropdownListEl || !traceDropdownEmptyEl) return;
+  traceDropdownListEl.innerHTML = "";
+  if (traceHistory.length === 0) {
+    traceDropdownEmptyEl.hidden = false;
+    return;
+  }
+
+  traceDropdownEmptyEl.hidden = true;
+  traceHistory.forEach((item) => {
+    const row = document.createElement("div");
+    row.className = "trace-entry";
+
+    const meta = document.createElement("div");
+    meta.className = "trace-entry-meta";
+
+    const idEl = document.createElement("span");
+    idEl.className = "trace-entry-id";
+    idEl.textContent = item.traceId;
+    idEl.title = item.traceId;
+
+    const timeEl = document.createElement("span");
+    timeEl.className = "trace-entry-time";
+    timeEl.textContent = `Created at ${formatTraceCreatedAtLocal(item.createdAt)}`;
+
+    const openLink = document.createElement("a");
+    openLink.className = "trace-entry-open";
+    openLink.href = item.traceUrl;
+    openLink.target = "_blank";
+    openLink.rel = "noopener noreferrer";
+    openLink.textContent = "Open Trace";
+
+    meta.appendChild(idEl);
+    meta.appendChild(timeEl);
+    row.appendChild(meta);
+    row.appendChild(openLink);
+    traceDropdownListEl.appendChild(row);
+  });
+}
+
+function updateTraceDropdownUI() {
+  const hasLinkConfig = Boolean(langfuseEnabled && langfuseHost && langfuseProjectId);
+  let label = "Connect to initialize trace links.";
+  let toggleDisabled = true;
+
+  if (!langfuseEnabled) {
+    label = "Langfuse tracing is disabled for this session.";
+  } else if (!hasLinkConfig) {
+    label = "Langfuse host/project is missing.";
+  } else if (traceHistory.length === 0) {
+    label = "Waiting for first trace...";
+    toggleDisabled = false;
+  } else {
+    label = `Traces (${traceHistory.length})`;
+    toggleDisabled = false;
+  }
+
+  if (traceDropdownLabelEl) {
+    traceDropdownLabelEl.textContent = label;
+  }
+
+  if (traceDropdownToggleEl) {
+    traceDropdownToggleEl.disabled = toggleDisabled;
+    if (toggleDisabled) {
+      closeTraceDropdown();
+    }
+  }
+
+  if (traceDropdownEmptyEl) {
+    if (!langfuseEnabled) {
+      traceDropdownEmptyEl.textContent = "Langfuse tracing is disabled.";
+    } else if (!hasLinkConfig) {
+      traceDropdownEmptyEl.textContent = "Langfuse host/project is missing; links unavailable.";
+    } else {
+      traceDropdownEmptyEl.textContent = "No traces yet.";
+    }
+  }
+
+  renderTraceHistory();
+}
+
+function resetTracePanel() {
+  langfuseEnabled = false;
+  langfuseHost = null;
+  langfuseProjectId = null;
+  traceHistory = [];
+  closeTraceDropdown();
+  updateTraceDropdownUI();
+}
+
+function configureTracePanelFromBootstrap(bootstrap) {
+  langfuseEnabled = bootstrap && bootstrap.langfuse_enabled === true;
+  langfuseHost = normalizeLangfuseHost(bootstrap ? bootstrap.langfuse_host : null);
+  langfuseProjectId = normalizeNonEmptyString(bootstrap ? bootstrap.langfuse_project_id : null);
+  traceHistory = [];
+  closeTraceDropdown();
+  updateTraceDropdownUI();
+}
+
+function handleTraceUpdate(payload) {
+  if (!payload || payload.type !== "trace_update") return;
+  if (!currentSessionId) return;
+
+  const payloadSessionId = normalizeNonEmptyString(payload.session_id);
+  if (payloadSessionId && payloadSessionId !== currentSessionId) return;
+
+  const traceId = normalizeNonEmptyString(payload.trace_id);
+  if (!traceId) return;
+
+  if (!(langfuseEnabled && langfuseHost && langfuseProjectId)) {
+    updateTraceDropdownUI();
+    return;
+  }
+
+  const timestampRaw = (typeof payload.timestamp === "number" && Number.isFinite(payload.timestamp))
+    ? payload.timestamp
+    : (Date.now() / 1000);
+  const timestamp = timestampRaw > 1e12 ? (timestampRaw / 1000) : timestampRaw;
+  const traceUrl = buildLangfuseTraceUrl(langfuseHost, langfuseProjectId, traceId);
+
+  traceHistory = traceHistory.filter((item) => item.traceId !== traceId);
+  traceHistory.unshift({
+    traceId,
+    traceUrl,
+    createdAt: timestamp,
+  });
+  if (traceHistory.length > TRACE_HISTORY_LIMIT) {
+    traceHistory = traceHistory.slice(0, TRACE_HISTORY_LIMIT);
+  }
+  updateTraceDropdownUI();
+}
 
 function createEmptyLiveTurnValues() {
   return {
@@ -363,6 +551,30 @@ window.addEventListener('DOMContentLoaded', () => {
   }
   setToolPhaseExpanded(true);
   clearToolPipelineView();
+  if (traceDropdownToggleEl) {
+    traceDropdownToggleEl.addEventListener("click", () => {
+      if (!traceDropdownMenuEl) return;
+      const nextOpen = traceDropdownMenuEl.hidden;
+      traceDropdownMenuEl.hidden = !nextOpen;
+      traceDropdownToggleEl.setAttribute("aria-expanded", nextOpen ? "true" : "false");
+    });
+  }
+  document.addEventListener("click", (event) => {
+    if (!traceDropdownEl) return;
+    if (!traceDropdownEl.contains(event.target)) {
+      closeTraceDropdown();
+    }
+  });
+  document.addEventListener("keydown", (event) => {
+    if (event.key === "Escape") {
+      closeTraceDropdown();
+    }
+  });
+  if (traceDropdownListEl) {
+    traceDropdownListEl.addEventListener("click", () => {
+      closeTraceDropdown();
+    });
+  }
 });
 
 function setStatus(text, state) {
@@ -618,6 +830,7 @@ async function connectToRoom() {
 
     currentSessionId = bootstrap.session_id || crypto.randomUUID();
     currentRoomName = bootstrap.room_name || null;
+    configureTracePanelFromBootstrap(bootstrap);
 
     if (!bootstrap.token) {
       throw new Error("Session bootstrap did not return a token");
@@ -664,6 +877,7 @@ async function connectToRoom() {
       localTrack = null;
       currentSessionId = null;
       currentRoomName = null;
+      resetTracePanel();
       muted = false;
       resetMuteButton();
       if (remoteAudioTrack) {
@@ -695,6 +909,8 @@ async function connectToRoom() {
             renderTurn(metricsData);
           } else if (metricsData.type === "turn_pipeline_summary") {
             renderTurnPipelineSummary(metricsData);
+          } else if (metricsData.type === "trace_update") {
+            handleTraceUpdate(metricsData);
           }
         } catch (error) {
           console.error("Failed to parse metrics:", error);
@@ -734,6 +950,7 @@ async function connectToRoom() {
     }
     currentSessionId = null;
     currentRoomName = null;
+    resetTracePanel();
     muted = false;
     resetMuteButton();
     if (remoteAudioTrack) {
@@ -795,6 +1012,7 @@ async function disconnectRoom() {
     if (disconnectSeq === activeConnectionSeq) {
       currentSessionId = null;
       currentRoomName = null;
+      resetTracePanel();
       muted = false;
       resetMuteButton();
       cleanupWave();
@@ -866,6 +1084,7 @@ setConnectionState(CONNECTION_STATES.IDLE);
 setHandoffCardVisible(false);
 setTotalCardMode(false);
 clearToolPipelineView();
+resetTracePanel();
 
 connectBtn.addEventListener("click", () => {
   connectToRoom().catch((error) => {

tests/test_langfuse_turn_tracing.py

@@ -277,6 +277,11 @@ def test_turn_trace_has_required_metadata_and_spans(monkeypatch: pytest.MonkeyPa
 
     fake_tracer = _FakeTracer()
     monkeypatch.setattr(metrics_collector_module, "tracer", fake_tracer)
+    monkeypatch.setattr(
+        metrics_collector_module.settings.langfuse,
+        "LANGFUSE_PUBLIC_TRACES",
+        False,
+    )
 
     room = _FakeRoom()
     collector = MetricsCollector(
@@ -340,6 +345,7 @@ def test_turn_trace_has_required_metadata_and_spans(monkeypatch: pytest.MonkeyPa
     assert root.attributes["participant_id"] == "web-123"
     assert root.attributes["turn_id"]
     assert root.attributes["langfuse.trace.output"] == "hi, how can I help?"
+    assert root.attributes["langfuse.trace.public"] is False
     assert root.attributes["latency_ms.eou_delay"] == pytest.approx(1100.0)
     assert root.attributes["latency_ms.stt_finalization"] == pytest.approx(250.0)
     assert root.attributes["latency_ms.stt_total"] == pytest.approx(1350.0)
@@ -424,6 +430,50 @@ def test_turn_trace_has_required_metadata_and_spans(monkeypatch: pytest.MonkeyPa
     assert trace_updates[0]["trace_id"]
 
 
+def test_turn_trace_marks_public_when_langfuse_public_traces_enabled(
+    monkeypatch: pytest.MonkeyPatch,
+) -> None:
+    import src.agent.traces.metrics_collector as metrics_collector_module
+
+    fake_tracer = _FakeTracer()
+    monkeypatch.setattr(metrics_collector_module, "tracer", fake_tracer)
+    monkeypatch.setattr(
+        metrics_collector_module.settings.langfuse,
+        "LANGFUSE_PUBLIC_TRACES",
+        True,
+    )
+
+    room = _FakeRoom()
+    collector = MetricsCollector(
+        room=room,  # type: ignore[arg-type]
+        model_name="moonshine",
+        room_name=room.name,
+        room_id="RM123",
+        participant_id="web-123",
+        langfuse_enabled=True,
+    )
+
+    async def _run() -> None:
+        await collector.on_session_metadata(
+            session_id="session-public",
+            participant_id="web-123",
+        )
+        await collector.on_user_input_transcribed("hello", is_final=True)
+        await collector.on_metrics_collected(_make_stt_metrics("stt-public"))
+        await collector.on_metrics_collected(
+            _make_eou_metrics("speech-public", delay=0.8, transcription_delay=0.1)
+        )
+        await collector.on_metrics_collected(_make_llm_metrics("speech-public"))
+        await collector.on_conversation_item_added(role="assistant", content="hi")
+        await collector.on_metrics_collected(_make_tts_metrics("speech-public"))
+        await collector.wait_for_pending_trace_tasks()
+
+    asyncio.run(_run())
+
+    root = fake_tracer.spans[0]
+    assert root.attributes["langfuse.trace.public"] is True
+
+
 def test_turn_trace_includes_tool_spans_between_llm_and_tts(
     monkeypatch: pytest.MonkeyPatch,
 ) -> None:

tests/test_session_bootstrap.py

@@ -23,6 +23,11 @@ def test_build_session_bootstrap_payload_returns_fresh_room_and_session(
     monkeypatch: pytest.MonkeyPatch,
 ) -> None:
     captured_calls: list[dict[str, Any]] = []
+    monkeypatch.setattr(settings.langfuse, "LANGFUSE_ENABLED", True)
+    monkeypatch.setattr(settings.langfuse, "LANGFUSE_HOST", "https://cloud.langfuse.com/")
+    monkeypatch.setattr(settings.langfuse, "LANGFUSE_BASE_URL", None)
+    monkeypatch.setattr(settings.langfuse, "LANGFUSE_PROJECT_ID", "project-xyz")
+    monkeypatch.setattr(settings.langfuse, "LANGFUSE_PUBLIC_TRACES", True)
 
     def fake_create_room_token(*, room_name: str) -> LiveKitToken:
         return LiveKitToken(
@@ -62,6 +67,14 @@ def test_build_session_bootstrap_payload_returns_fresh_room_and_session(
     assert second.token == f"token-{second.room_name}"
     assert first.dispatch_worker_id == "worker-123"
     assert second.dispatch_worker_id == "worker-123"
+    assert first.langfuse_enabled is True
+    assert second.langfuse_enabled is True
+    assert first.langfuse_host == "https://cloud.langfuse.com"
+    assert second.langfuse_host == "https://cloud.langfuse.com"
+    assert first.langfuse_project_id == "project-xyz"
+    assert second.langfuse_project_id == "project-xyz"
+    assert first.langfuse_public_traces is True
+    assert second.langfuse_public_traces is True
 
     assert len(captured_calls) == 2
     for payload, call in ((first, captured_calls[0]), (second, captured_calls[1])):
@@ -98,6 +111,37 @@ def test_build_session_bootstrap_payload_handles_missing_worker_assignment(
     assert payload.dispatch_worker_id is None
 
 
+def test_build_session_bootstrap_payload_disables_langfuse_links_when_project_missing(
+    monkeypatch: pytest.MonkeyPatch,
+) -> None:
+    monkeypatch.setattr(settings.langfuse, "LANGFUSE_ENABLED", True)
+    monkeypatch.setattr(settings.langfuse, "LANGFUSE_HOST", "https://cloud.langfuse.com")
+    monkeypatch.setattr(settings.langfuse, "LANGFUSE_BASE_URL", None)
+    monkeypatch.setattr(settings.langfuse, "LANGFUSE_PROJECT_ID", "   ")
+    monkeypatch.setattr(settings.langfuse, "LANGFUSE_PUBLIC_TRACES", False)
+    monkeypatch.setattr(
+        session_bootstrap,
+        "create_room_token",
+        lambda *, room_name: LiveKitToken(
+            token=f"token-{room_name}",
+            room_name=room_name,
+            identity="web-test",
+        ),
+    )
+    monkeypatch.setattr(
+        session_bootstrap,
+        "ensure_agent_dispatched_sync",
+        lambda **_: _make_dispatch(dispatch_id="dispatch-1", worker_id="worker-1"),
+    )
+
+    payload = session_bootstrap.build_session_bootstrap_payload()
+
+    assert payload.langfuse_enabled is False
+    assert payload.langfuse_host == "https://cloud.langfuse.com"
+    assert payload.langfuse_project_id is None
+    assert payload.langfuse_public_traces is False
+
+
 def test_build_session_bootstrap_payload_retries_transient_failure(
     monkeypatch: pytest.MonkeyPatch,
 ) -> None: