@oar-sh/oar 0.9.3 → 0.9.4

package/server/public/app/action-confirmations.js

@@ -5,16 +5,26 @@ import {
   openSummaryModal,
   closeSummaryModal,
   setSummaryModalLoading,
+  renderSummaryModalContent,
+  summaryModalState,
   showTransientRelayNotice,
 } from './store.js';
 import {
   killSessionWorker,
   requestRelayRestart,
   requestHostSuspend,
+  getHostSuspendState,
+  cancelHostSuspend,
   requestQueueEmpty,
   refreshWorkspaceRootHints,
 } from './api-client.js';
 import { isSuspendHostActionVisible } from './settings-modal.js';
+import {
+  applyHostSuspendState,
+  describeHostSuspendBlocker,
+  formatCountdown,
+  isHostSuspendPending,
+} from './host-suspend-ui.js';
 
 let killSessionInFlight = false;
 let restartRelayInFlight = false;
@@ -129,22 +139,111 @@ export function openEmptyQueueConfirmation() {
   });
 }
 
+const SUSPEND_MODAL_KIND = 'suspend-host';
+
+/**
+ * Body of the Suspend host modal for one activity snapshot. Pure so the three
+ * shapes (idle, busy, already pending) are unit-testable without a DOM.
+ */
+export function renderSuspendHostModalBody({ state = null, blockers = [], supported = true } = {}) {
+  const list = Array.isArray(blockers) ? blockers : [];
+  const items = list.map((b) => `<li>${escHtml(describeHostSuspendBlocker(b))}</li>`).join('');
+  if (!supported) {
+    return `
+      <p>Host suspend is only available when the relay runs on Windows.</p>
+      <div class="summary-modal-actions">
+        <button class="chat-title-action-btn" type="button" onclick="closeSummaryModal()">Close</button>
+      </div>`;
+  }
+  if (isHostSuspendPending(state)) {
+    const status = String(state?.status || '');
+    const countdown = status === 'countdown' ? formatCountdown(state.fireAt) : null;
+    const headline = status === 'suspending'
+      ? '<p>The host is suspending now.</p>'
+      : status === 'countdown'
+        ? `<p>Everything is idle. The host suspends in <strong>${escHtml(countdown || 'a moment')}</strong> unless you cancel.</p>`
+        : '<p>A suspend is already queued. The PC will not go to sleep until these finish, then after 2 minutes of quiet:</p>';
+    return `
+      ${headline}
+      ${items ? `<ul class="suspend-host-blockers">${items}</ul>` : ''}
+      <div class="summary-modal-actions">
+        <button class="chat-title-action-btn danger-btn" type="button" onclick="cancelQueuedHostSuspend()"${status === 'suspending' ? ' disabled data-keep-disabled="1"' : ''}>Cancel queued suspend</button>
+        <button class="chat-title-action-btn" type="button" onclick="closeSummaryModal()">Close</button>
+      </div>`;
+  }
+  if (!list.length) {
+    return `
+      <p>Put this PC to sleep?</p>
+      <p>Nothing is running. The host suspends <strong>30 seconds</strong> after you confirm; a banner with a countdown lets you cancel until then.</p>
+      <div class="summary-modal-actions">
+        <button class="chat-title-action-btn" type="button" onclick="confirmSuspendHost()">💤 Suspend host</button>
+        <button class="chat-title-action-btn" type="button" onclick="closeSummaryModal()">Cancel</button>
+      </div>`;
+  }
+  return `
+    <p><strong>Agents are still active.</strong> The PC will not suspend until these finish, then after 2 minutes of quiet:</p>
+    <ul class="suspend-host-blockers">${items}</ul>
+    <p>You can cancel the queued suspend from the banner or this menu at any time.</p>
+    <div class="summary-modal-actions">
+      <button class="chat-title-action-btn" type="button" onclick="confirmSuspendHost()">💤 Suspend when idle</button>
+      <button class="chat-title-action-btn" type="button" onclick="closeSummaryModal()">Cancel</button>
+    </div>`;
+}
+
+async function loadSuspendHostModal() {
+  const result = await getHostSuspendState();
+  if (summaryModalState.kind !== SUSPEND_MODAL_KIND) return;
+  if (!result?.ok) {
+    renderSummaryModalContent({
+      title: 'Suspend host',
+      subtitle: 'Suspend-to-RAM once agents are done',
+      kind: SUSPEND_MODAL_KIND,
+      refresh: loadSuspendHostModal,
+      bodyHtml: `
+        <div class="summary-error">Could not read what is running right now.</div>
+        <div class="summary-modal-actions">
+          <button class="chat-title-action-btn" type="button" onclick="closeSummaryModal()">Close</button>
+        </div>`,
+    });
+    return;
+  }
+  if (result.state) applyHostSuspendState(result.state);
+  renderSummaryModalContent({
+    title: 'Suspend host',
+    subtitle: isHostSuspendPending(result.state) ? 'Suspend queued' : 'Suspend-to-RAM once agents are done',
+    kind: SUSPEND_MODAL_KIND,
+    refresh: loadSuspendHostModal,
+    bodyHtml: renderSuspendHostModalBody({
+      state: result.state,
+      blockers: result.blockers,
+      supported: result.supported !== false,
+    }),
+  });
+}
+
 export function openSuspendHostConfirmation() {
-  if (!isSuspendHostActionVisible()) return;
+  if (!isSuspendHostActionVisible() && !isHostSuspendPending()) return;
   menuDeps.lockChatActionsMenuShield(350);
   menuDeps.closeChatActionsMenu();
   openSummaryModal({
     title: 'Suspend host',
-    subtitle: 'Requests suspend-to-RAM',
-    kind: 'suspend-host',
-    bodyHtml: `
-      <p>Put this PC to sleep now?</p>
-      <p>This requests suspend-to-RAM immediately.</p>
-      <div class="summary-modal-actions">
-        <button class="chat-title-action-btn" type="button" onclick="confirmSuspendHost()">💤 Suspend host</button>
-        <button class="chat-title-action-btn" type="button" onclick="closeSummaryModal()">Cancel</button>
-      </div>
-    `,
+    subtitle: 'Suspend-to-RAM once agents are done',
+    kind: SUSPEND_MODAL_KIND,
+    refresh: loadSuspendHostModal,
+    bodyHtml: '<div class="summary-loading">Checking what is still running…</div>',
+  });
+  setSummaryModalLoading(true);
+  loadSuspendHostModal().catch(() => {
+    if (summaryModalState.kind !== SUSPEND_MODAL_KIND) return;
+    renderSummaryModalContent({
+      title: 'Suspend host',
+      kind: SUSPEND_MODAL_KIND,
+      bodyHtml: `
+        <div class="summary-error">Could not read what is running right now.</div>
+        <div class="summary-modal-actions">
+          <button class="chat-title-action-btn" type="button" onclick="closeSummaryModal()">Close</button>
+        </div>`,
+    });
   });
   window.setTimeout(() => {
     const modal = document.getElementById('summary-modal');
@@ -152,7 +251,7 @@ export function openSuspendHostConfirmation() {
     const ariaVisible = String(modal?.getAttribute('aria-hidden') || 'true') === 'false';
     const displayVisible = modal ? window.getComputedStyle(modal).display !== 'none' : false;
     if (classVisible && ariaVisible && displayVisible) return;
-    const confirmed = window.confirm('Put this PC to sleep now?\n\nThis requests suspend-to-RAM.');
+    const confirmed = window.confirm('Put this PC to sleep once all agents are done?\n\nThe suspend is queued and fires after everything has been idle.');
     if (!confirmed) return;
     confirmSuspendHost().catch(() => {});
   }, 90);
@@ -170,9 +269,37 @@ export async function confirmSuspendHost() {
     });
     closeSummaryModal();
     if (!result?.ok) {
-      alert('Failed to suspend host');
+      alert('Failed to queue host suspend');
+      return;
+    }
+    if (result.state) applyHostSuspendState(result.state);
+    const status = String(result.state?.status || '');
+    if (result.alreadyPending) {
+      showTransientRelayNotice('A host suspend is already queued.', 5000);
+    } else if (status === 'countdown') {
+      showTransientRelayNotice('Host suspend queued: everything is idle, sleeping in 30 seconds. Cancel from the banner.', 7000);
+    } else {
+      showTransientRelayNotice('Host suspend queued: the PC sleeps once all agents are done.', 7000);
+    }
+  } finally {
+    suspendHostInFlight = false;
+    setSummaryModalLoading(false);
+  }
+}
+
+export async function cancelQueuedHostSuspend() {
+  if (suspendHostInFlight) return;
+  suspendHostInFlight = true;
+  setSummaryModalLoading(true);
+  try {
+    const result = await cancelHostSuspend();
+    closeSummaryModal();
+    if (!result?.ok) {
+      alert('Failed to cancel the queued host suspend');
       return;
     }
+    if (result.state) applyHostSuspendState(result.state);
+    showTransientRelayNotice(result.cancelled ? 'Queued host suspend cancelled.' : 'No host suspend was pending.', 4000);
   } finally {
     suspendHostInFlight = false;
     setSummaryModalLoading(false);
@@ -263,5 +390,6 @@ export function initActionConfirmations({
   window.confirmKillCurrentSession = confirmKillCurrentSession;
   window.confirmRestartWebRelay = confirmRestartWebRelay;
   window.confirmSuspendHost = confirmSuspendHost;
+  window.cancelQueuedHostSuspend = cancelQueuedHostSuspend;
   window.confirmEmptyQueue = confirmEmptyQueue;
 }

package/server/public/app/api-client.js

@@ -457,6 +457,91 @@ export async function updatePwaAppNameSetting(appName) {
   });
 }
 
+// ─── Remote relays (Settings → Relays) ───────────────────────────────────────
+// Adding a relay has several distinct refusals the form has to tell apart
+// (needs a token, this is this relay, bad address), so these calls hand back
+// the relay's JSON body on failure too — `{ ok:false, status, code, error }` —
+// instead of apiFetch's bare null. They never throw; null only when network
+// requests are paused.
+
+async function remoteRelayRequest(path, { method = 'GET', body = undefined, timeoutMs = REQUEST_TIMEOUT_MS } = {}) {
+  if (!networkRequestsEnabled) return null;
+  try {
+    const response = await fetch(`${BASE}${path}`, {
+      signal: requestTimeoutSignal(timeoutMs),
+      method,
+      headers: {
+        'Content-Type': 'application/json',
+        ...authHeaders(),
+      },
+      ...(body === undefined ? {} : { body: JSON.stringify(body) }),
+    });
+    const payload = await response.json().catch(() => null);
+    noteFetchSuccess();
+    const result = payload && typeof payload === 'object' && !Array.isArray(payload) ? payload : {};
+    if (!response.ok) {
+      return {
+        ...result,
+        ok: false,
+        status: response.status,
+        error: String(result.error || `Request failed (${response.status})`),
+      };
+    }
+    return { ok: true, ...result, status: response.status };
+  } catch (error) {
+    noteFetchFailure(path, error);
+    return { ok: false, status: 0, code: 'NETWORK', error: toErrorMessage(error) };
+  }
+}
+
+function remoteRelayPath(id, suffix = '') {
+  return `/api/remote-relays/${encodeURIComponent(String(id || '').trim())}${suffix}`;
+}
+
+/** `{ relays, self }`; never carries tokens. Null on any failure. */
+export async function loadRemoteRelays() {
+  return apiFetch('/api/remote-relays');
+}
+
+/**
+ * Probes and saves a remote relay, and (pairBack) asks it to add this relay.
+ * The probe and the pair-back are two remote round trips of up to 15 s each,
+ * hence the long timeout.
+ */
+export async function addRemoteRelay({ url, token = '', pairBack = true, selfUrl = '' } = {}) {
+  const body = { url: String(url || '').trim(), pairBack: pairBack !== false };
+  const trimmedToken = String(token || '').trim();
+  if (trimmedToken) body.token = trimmedToken;
+  const trimmedSelfUrl = String(selfUrl || '').trim();
+  if (trimmedSelfUrl) body.selfUrl = trimmedSelfUrl;
+  return remoteRelayRequest('/api/remote-relays', { method: 'POST', body, timeoutMs: LONG_REQUEST_TIMEOUT_MS });
+}
+
+/** `patch`: any of `{ permission, url, token, tokenMode }`. */
+export async function updateRemoteRelay(id, patch = {}) {
+  return remoteRelayRequest(remoteRelayPath(id), { method: 'PATCH', body: patch || {} });
+}
+
+export async function removeRemoteRelay(id) {
+  return remoteRelayRequest(remoteRelayPath(id), { method: 'DELETE' });
+}
+
+export async function checkRemoteRelay(id) {
+  return remoteRelayRequest(remoteRelayPath(id, '/check'), { method: 'POST', body: {}, timeoutMs: LONG_REQUEST_TIMEOUT_MS });
+}
+
+/** `{ publicUrl, inboundEnabled }` for this relay. */
+export async function loadRemoteRelaySettings() {
+  return apiFetch('/api/settings/remote-relays');
+}
+
+export async function updateRemoteRelaySettings(patch = {}) {
+  const body = {};
+  if (typeof patch.publicUrl === 'string') body.publicUrl = patch.publicUrl.trim();
+  if (typeof patch.inboundEnabled === 'boolean') body.inboundEnabled = patch.inboundEnabled;
+  return remoteRelayRequest('/api/settings/remote-relays', { method: 'POST', body });
+}
+
 export async function loadUpdateState() {
   return apiFetch('/api/update/state');
 }
@@ -876,6 +961,24 @@ export async function requestHostSuspend(body = {}) {
   });
 }
 
+export async function getHostSuspendState() {
+  return apiFetch('/api/host/suspend');
+}
+
+export async function cancelHostSuspend(body = {}) {
+  return apiFetch('/api/host/suspend/cancel', {
+    method: 'POST',
+    body: JSON.stringify({ requestedBy: 'localhost-api', ...(body || {}) }),
+  });
+}
+
+export async function cancelRelayRestart(body = {}) {
+  return apiFetch('/api/relay/shutdown/cancel', {
+    method: 'POST',
+    body: JSON.stringify({ requestedBy: 'localhost-api', ...(body || {}) }),
+  });
+}
+
 export async function requestQueueEmpty(body = {}) {
   return apiFetch('/api/queue/empty', {
     method: 'POST',

package/server/public/app/bootstrap.js

@@ -119,6 +119,14 @@ import { loadRepoBrowserTree, openRepoBrowser, closeRepoBrowser, setRepoBrowserS
 import { handleAttachmentInput, retryAttachmentUpload, openAnnotateEditorForPending, openAnnotateEditorForPreview, handleComposerPaste, handleComposerDrop, refreshComposerAttachmentWarning, removeAttachment, clearAttachments, openUploadedAttachmentViewer, setFilePreviewMode, toggleFilePreviewHtml, copyFilePreviewImage, closeFilePreview, goBackFilePreview, openWorkspaceFilePreview, openWorkspaceFilePreviewFromRepo, setRepoBrowserRoot, setRepoBrowserViewMode, toggleRepoBrowserHidden, toggleRepoBrowserHeavy, refreshRepoBrowser, focusRepoTree, setRepoCurrentPath, confirmRepoBrowserCwdPick } from './attachments-view.js';
 import { initEmojiPicker, toggleEmojiPicker } from './emoji-view.js';
 import { initSlashAutocomplete } from './slash-autocomplete.mjs';
+import { initMentionAutocomplete } from './mention-autocomplete.mjs';
+import { consumeConversationDeepLink } from './conversation-deep-link.mjs';
+import {
+  addRemoteRelayFromForm,
+  saveRemoteRelayPublicUrl,
+  showRemoteRelayTokenField,
+  toggleRemoteRelayInbound,
+} from './remote-relays-settings.js';
 import { dataTransferHasFiles } from './composer-paste.mjs';
 import { isReasoningOffUnsupported, reasoningEffortOptionLabel, reasoningEffortOptionTitle } from './reasoning-effort-labels.mjs';
 import {
@@ -301,7 +309,9 @@ import {
   confirmEmptyQueue,
   openSuspendHostConfirmation,
   confirmSuspendHost,
+  cancelQueuedHostSuspend,
 } from './action-confirmations.js';
+import { applyPendingActionsFromStatus, initHostSuspendUi } from './host-suspend-ui.js';
 import {
   startClaudeRelogin,
   submitClaudeLoginCodeFromInput,
@@ -698,13 +708,10 @@ function initPushNotificationClientHooks() {
   });
 }
 
+// ?push_conv=<id> (a notification tap) and ?conv=<id> (another relay's
+// provenance badge links here) both open that conversation once.
 function consumePushConversationDeepLink() {
-  const url = new URL(window.location.href);
-  const conversationId = String(url.searchParams.get('push_conv') || '').trim();
-  if (!conversationId) return '';
-  url.searchParams.delete('push_conv');
-  history.replaceState(null, document.title, `${url.pathname}${url.search}${url.hash}`);
-  return conversationId;
+  return consumeConversationDeepLink();
 }
 
 function handleForegroundTransition(reason, { immediate = false } = {}) {
@@ -3242,6 +3249,7 @@ async function refreshSessionWorkerStatus() {
   const status = await refreshWorkspaceRootHints();
   if (!status) return;
   syncQueueStatusMenuEntry(status);
+  applyPendingActionsFromStatus(status);
   if (setSessionWorkerStatesFromStatusPayload(status.sessionWorker)) {
     renderConvList();
     // A worker steering snapshot may have changed; the composer's Steer
@@ -3950,6 +3958,7 @@ async function initApp() {
   syncQueueStatusMenuEntry();
   if (!sharedMode) {
     syncSuspendHostVisibility();
+    initHostSuspendUi();
   }
   setupViewportTracking();
   bindChatSelectionGuard();
@@ -4185,6 +4194,7 @@ async function initApp() {
   initChatTitleCopy();
   initEmojiPicker();
   initSlashAutocomplete();
+  initMentionAutocomplete();
   initConversationListLazyLoading();
   initConversationFilter();
   initConversationHistoryLazyLoading();
@@ -4317,6 +4327,10 @@ window.togglePushOnThisDevice = togglePushOnThisDevice;
 window.updatePushPreferencesFromControls = updatePushPreferencesFromControls;
 window.openSettingsModal = openSettingsModal;
 window.closeSettingsModal = closeSettingsModal;
+window.addRemoteRelayFromForm = addRemoteRelayFromForm;
+window.showRemoteRelayTokenField = showRemoteRelayTokenField;
+window.saveRemoteRelayPublicUrl = saveRemoteRelayPublicUrl;
+window.toggleRemoteRelayInbound = toggleRemoteRelayInbound;
 window.doAuth = doAuth;
 window.initApp = initApp;
 window.connectSocket = connectSocket;
@@ -4413,6 +4427,7 @@ window.openSuspendHostConfirmation = openSuspendHostConfirmation;
 window.confirmKillCurrentSession = confirmKillCurrentSession;
 window.confirmRestartWebRelay = confirmRestartWebRelay;
 window.confirmSuspendHost = confirmSuspendHost;
+window.cancelQueuedHostSuspend = cancelQueuedHostSuspend;
 window.confirmEmptyQueue = confirmEmptyQueue;
 window.openMessageSearchModal = openMessageSearchModal;
 window.closeMessageSearchModal = closeMessageSearchModal;

package/server/public/app/conversation-deep-link.mjs

@@ -0,0 +1,42 @@
+// Links that open one conversation when the app loads:
+//   ?push_conv=<id>  a notification tap (sw.js opens a fresh window with it)
+//   ?conv=<id>       a link from another relay's provenance badge
+//                    (remoteConversationUrl in shared/remote-relay-contract.mjs)
+// Both are consumed once and stripped from the address bar, so a reload does
+// not jump back to that conversation.
+
+export const CONVERSATION_DEEP_LINK_PARAMS = Object.freeze(['push_conv', 'conv']);
+
+/**
+ * Reads the conversation a URL asks for. `cleanedPath` is the URL to put back
+ * in the address bar (path + remaining query + hash), or null when the URL
+ * carried none of the parameters and needs no rewrite.
+ */
+export function readConversationDeepLink(href) {
+  let url;
+  try {
+    url = new URL(String(href || ''));
+  } catch {
+    return { conversationId: '', cleanedPath: null };
+  }
+  let conversationId = '';
+  let found = false;
+  for (const param of CONVERSATION_DEEP_LINK_PARAMS) {
+    if (!url.searchParams.has(param)) continue;
+    found = true;
+    const value = String(url.searchParams.get(param) || '').trim();
+    if (!conversationId && value) conversationId = value;
+    url.searchParams.delete(param);
+  }
+  return {
+    conversationId,
+    cleanedPath: found ? `${url.pathname}${url.search}${url.hash}` : null,
+  };
+}
+
+/** Reads and strips the deep link from the current location. */
+export function consumeConversationDeepLink({ location = window.location, history = window.history, title = document.title } = {}) {
+  const { conversationId, cleanedPath } = readConversationDeepLink(location?.href);
+  if (cleanedPath !== null) history?.replaceState?.(null, title, cleanedPath);
+  return conversationId;
+}

package/server/public/app/conversation-view.js

@@ -45,6 +45,8 @@ import {
   imageEditTarget,
   setImageEditTarget as setStoredImageEditTarget,
   getSessionWorkerState,
+  openSummaryModal,
+  closeSummaryModal,
 } from './store.js';
 import { getPendingQuestionCountsByConversation } from './ask-user-view.js';
 import { sendMessage as sendMessageApi, cancelConversationTurn, cancelQueuedConversationTurn, cancelSubagentRun, compactConversation as compactConversationApi, scheduleContextUsageRefresh, loadConversation as loadConversationApi, loadSharedConversation, updateConversationDraft as updateConversationDraftApi, updateMessageShareVisibility } from './api-client.js';
@@ -55,6 +57,9 @@ import { buildWorkflowRunCard } from './background-tasks-view.mjs';
 import { parsePreviewCommand, runPreviewCommand } from './preview-command.mjs';
 import { buildTranscriptPreviewCard } from './preview-cards.mjs';
 import { closeSlashAutocomplete, handleSlashAutocompleteKey, updateSlashAutocomplete } from './slash-autocomplete.mjs';
+import { closeMentionAutocomplete, handleMentionAutocompleteKey, updateMentionAutocomplete } from './mention-autocomplete.mjs';
+import { renderRemoteOriginBadgeHtml } from './remote-relay-origin-view.mjs';
+import { stripRemoteRelayDisplayArtifacts } from './relay-prompt-sanitizer.mjs';
 import { evaluateUnknownCommandGuard } from './slash-commands.mjs';
 import { attachCodeCopyButtons } from './code-copy.mjs';
 import { relayErrorCtaActions } from './relay-error-ctas.mjs';
@@ -102,6 +107,16 @@ import {
   shouldApplyIncomingDraftToComposer,
 } from './conversation-draft-sync.mjs';
 import { isChatInteractionHeld, selectionIntersectsNode } from './selection-guard.mjs';
+import {
+  applyThinkingFollow,
+  getThinkingFollowMode,
+  initThinkingFollow,
+  observeThinkingBubble,
+  renderThinkingFollowButtonsHtml,
+  syncThinkingFollowButtons,
+  toggleThinkingFollowMode,
+  unobserveThinkingBubble,
+} from './thinking-follow.js';
 import { buildInFlightSnapshotKey } from './in-flight-snapshot.mjs';
 import { computeStablePrefixLength, planListPatch } from './streaming-dom-patch.mjs';
 import { prefixToolActivityEmoji } from './tool-activity-emoji.mjs';
@@ -1212,8 +1227,18 @@ function createMessageNode(msg, msgId = null, force = false) {
     seenMessageIds.add(msgId);
   }
 
+  // A prompt another relay's agent sent carries `origin`: its header line is
+  // hidden (the badge below says the same), and a stray remote-relay mention
+  // hint never shows on any user bubble.
+  const remoteOrigin = (msg?.role === 'user' && msg?.origin && typeof msg.origin === 'object') ? msg.origin : null;
+  if (msg?.role === 'user') {
+    const displayText = stripRemoteRelayDisplayArtifacts(msg.text, { origin: remoteOrigin });
+    if (displayText !== String(msg.text ?? '')) msg = { ...msg, text: displayText };
+  }
+
   const div = document.createElement('div');
   div.className = `msg ${msg.role}`;
+  if (remoteOrigin) div.classList.add('msg-from-remote-relay');
   if (msgId) div.dataset.messageId = msgId;
   const fingerprint = buildLiveMessageFingerprint({
     ...(msg && typeof msg === 'object' ? msg : {}),
@@ -1376,8 +1401,13 @@ function createMessageNode(msg, msgId = null, force = false) {
     ? `<div class="msg-bubble-actions"><button type="button" class="bubble-action-btn" data-action="resend-stopped-steer" data-message-id="${escHtml(msgId)}" title="Send this message again as a new turn"${resendState ? ' disabled' : ''}>${resendLabel}</button></div>`
     : '';
 
+  // Shared viewers get the badge without the link to the other relay.
+  const originBadgeHtml = remoteOrigin
+    ? renderRemoteOriginBadgeHtml(remoteOrigin, { linkable: !IS_SHARED_VIEW })
+    : '';
+
   div.innerHTML = `
-    <div class="${bubbleClass}">${shareVisibilityActionHtml}${thoughtsHtml}${content}${relayErrorCtaHtml}${attachmentHtml}${activityHtml}${subagentHtml}${workflowRunsHtml}${previewCardsHtml}${userBubbleActionsHtml}${stoppedSteerActionsHtml}</div>
+    <div class="${bubbleClass}">${shareVisibilityActionHtml}${thoughtsHtml}${originBadgeHtml}${content}${relayErrorCtaHtml}${attachmentHtml}${activityHtml}${subagentHtml}${workflowRunsHtml}${previewCardsHtml}${userBubbleActionsHtml}${stoppedSteerActionsHtml}</div>
     <div class="msg-label">${label}${modelTag}${reasoningTag}${modeTag}${autoTag}${continuationTag}${crossProviderTag}${usageTurnTag}${usageRemainingTag}${usageStaleTag} · ${fmtDate(msg.timestamp)}</div>`;
 
   const bubble = div.querySelector('.msg-bubble');
@@ -1699,10 +1729,14 @@ export function showThinking(messageId = null, autoScroll = true) {
       stopBtn.classList.toggle('stopping', stopping);
     }
     anchorThinkingBubble(existing, nextMessageId || existing.dataset.messageId);
-    if (autoScroll) scrollBottom();
+    syncThinkingFollowButtons(existing, getThinkingFollowMode());
+    observeThinkingBubble(existing);
+    if (getThinkingFollowMode()) applyThinkingFollow();
+    else if (autoScroll) scrollBottom();
     return;
   }
   existing?.remove();
+  unobserveThinkingBubble();
   const div = document.createElement('div');
   div.className = 'msg assistant';
   div.id = 'thinking-indicator';
@@ -1712,9 +1746,12 @@ export function showThinking(messageId = null, autoScroll = true) {
   const stopBtnHtml = (!IS_SHARED_VIEW && nextMessageId)
     ? `<button type="button" class="bubble-action-btn${isCancelInFlight ? ' stopping' : ''}" data-action="stop-turn" data-message-id="${escHtml(nextMessageId)}"${isCancelInFlight ? ' disabled' : ''}>${isCancelInFlight ? 'Stopping…' : 'Stop'}</button>`
     : '';
+  // Stop stays left; the follow buttons (💭 thoughts, 📃 answer, 🛠️ tools)
+  // sit on the right. See thinking-follow.js.
+  const followBtnsHtml = renderThinkingFollowButtonsHtml(getThinkingFollowMode());
   div.innerHTML = `
     <div class="thinking-bubble">
-      <div class="thinking-bubble-header">${stopBtnHtml}</div>
+      <div class="thinking-bubble-header">${stopBtnHtml}${followBtnsHtml}</div>
       <details id="thinking-thoughts" class="thinking-thoughts-panel" open>
         <summary>💭 Thoughts</summary>
         <div class="thinking-thoughts-list"></div>
@@ -1727,15 +1764,49 @@ export function showThinking(messageId = null, autoScroll = true) {
   anchorThinkingBubble(div, nextMessageId);
   renderThinkingThoughts();
   renderThinkingStream();
-  if (autoScroll) scrollBottom();
+  observeThinkingBubble(div);
+  if (getThinkingFollowMode()) applyThinkingFollow();
+  else if (autoScroll) scrollBottom();
 }
 
 export function removeThinking() {
   thinkingMessageId = null;
   lastInFlightSnapshotKey = '';
+  unobserveThinkingBubble();
   document.getElementById('thinking-indicator')?.remove();
 }
 
+// Stop is one tap away on a sticky header, so a stray touch must not kill a
+// long turn: confirm first, then run the existing stop path.
+function openStopTurnConfirmation(conversationId, messageId) {
+  const convId = String(conversationId || '').trim();
+  const id = String(messageId || '').trim();
+  if (!convId || !id) return;
+  if (bubbleCancelInFlight.has(id)) return;
+  openSummaryModal({
+    title: 'Stop this turn?',
+    subtitle: 'The agent stops after its current step',
+    kind: 'stop-turn',
+    bodyHtml: `
+      <p>Stop the running turn? Work already done stays; anything the agent was about to do is cut short.</p>
+      <div class="summary-modal-actions">
+        <button class="chat-title-action-btn danger-btn" type="button" data-stop-turn-confirm="1">⏹ Stop turn</button>
+        <button class="chat-title-action-btn" type="button" data-stop-turn-cancel="1">Keep running</button>
+      </div>
+    `,
+  });
+  const body = document.getElementById('summary-modal-body');
+  body?.querySelector('[data-stop-turn-confirm]')?.addEventListener('click', (event) => {
+    event.preventDefault();
+    closeSummaryModal();
+    void stopTurnByMessageId(convId, id);
+  }, { once: true });
+  body?.querySelector('[data-stop-turn-cancel]')?.addEventListener('click', (event) => {
+    event.preventDefault();
+    closeSummaryModal();
+  }, { once: true });
+}
+
 export function collapseThinkingThoughts() {
   const panel = document.getElementById('thinking-thoughts');
   if (!(panel instanceof HTMLDetailsElement)) return;
@@ -2919,7 +2990,7 @@ function runRelayErrorCta(cta) {
 }
 
 function handleBubbleActionClick(event) {
-  const btn = event.target.closest('.bubble-action-btn, .msg-share-visibility-btn');
+  const btn = event.target.closest('.bubble-action-btn, .msg-share-visibility-btn, .thinking-follow-btn');
   if (!btn) return;
   const action = btn.dataset.action;
   const messageId = btn.dataset.messageId;
@@ -2944,7 +3015,15 @@ function handleBubbleActionClick(event) {
   if (action === 'stop-turn' && messageId) {
     event.preventDefault();
     event.stopPropagation();
-    void stopTurnByMessageId(currentConvId, messageId);
+    openStopTurnConfirmation(currentConvId, messageId);
+  }
+
+  if (action === 'follow-thinking') {
+    event.preventDefault();
+    event.stopPropagation();
+    const mode = toggleThinkingFollowMode(currentConvId, btn.dataset.follow);
+    syncThinkingFollowButtons(document, mode);
+    if (mode) applyThinkingFollow({ force: true });
   }
 
   if (action === 'cancel-queued' && messageId) {
@@ -2997,6 +3076,7 @@ export function initBubbleActionHandlers() {
   if (!messagesEl) return;
   messagesEl.addEventListener('click', handleBubbleActionClick);
   messagesEl.addEventListener('click', handleEmbeddedImageClick);
+  initThinkingFollow({ getCurrentConversationId: () => currentConvId });
 }
 
 export function appendMessage(msg, scroll = true, msgId = null, force = false, insertAfterId = null, trackHistory = true) {
@@ -3342,6 +3422,7 @@ export async function sendMessage() {
   }
   if (!hasDraft) return;
   closeSlashAutocomplete();
+  closeMentionAutocomplete();
 
   // Warn-once typo guard: a message that looks like a command but matches none
   // would otherwise burn an agent turn as plain text.
@@ -3589,6 +3670,12 @@ export async function sendMessage() {
       };
       window.syncAutoModelAvailability?.();
     }
+    // Adopting the conversation can grow the composer (session-lock note,
+    // warning banner), which shrinks the transcript under a pane that was
+    // pinned to the newest message. Re-pin now rather than after the draft
+    // save's round trip below, or the new bubble sits under the composer
+    // for as long as that request takes.
+    if (viewingSendConversation()) scrollBottom();
     const persistedConversationId = String(r.conversationId || targetConversationId || '').trim();
     if (persistedConversationId) {
       restorableDraftByConversation.delete(persistedConversationId);
@@ -3661,12 +3748,16 @@ export async function sendMessage() {
 // menu in sync with the caret. Cheap no-op for non-slash text.
 export function updateComposerSlashMenu(input) {
   updateSlashAutocomplete(input, { conversationId: currentConvId });
+  // Second, so it sees the slash menu's verdict: the @relay popup never opens
+  // over an open slash menu, and at most one of them ever handles keys.
+  updateMentionAutocomplete(input);
 }
 
 export function handleKey(e) {
   // The open menu owns navigation keys; Ctrl/Cmd+Enter still falls through to
-  // send because the menu never consumes it.
+  // send because neither menu consumes it.
   if (handleSlashAutocompleteKey(e, e.target)) return;
+  if (handleMentionAutocompleteKey(e, e.target)) return;
   if (e.key === 'Enter' && (e.ctrlKey || e.metaKey)) {
     e.preventDefault();
     sendMessage();