@oar-sh/oar 0.9.6 → 0.9.7

package/server/public/app/context-menu.mjs

@@ -0,0 +1,140 @@
+// A context menu for the conversation list: right-click on a desktop, a long
+// press on a phone. One menu at a time, closed by a pointer-down outside it,
+// Escape, a scroll or a resize, like a native menu; flipped at the screen
+// edge rather than clipped. The entries are buttons, so keyboard users get
+// focus on the first one.
+
+const LONG_PRESS_MS = 500;
+const LONG_PRESS_SLOP_PX = 10;
+
+/** A horizontal rule between groups. */
+export const MENU_SEPARATOR = null;
+
+let closeOpenMenu = null;
+
+function esc(value) {
+  return String(value ?? '')
+    .replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;');
+}
+
+/** Close the open menu, if any. */
+export function closeContextMenu() {
+  closeOpenMenu?.();
+}
+
+/**
+ * Open a menu at viewport coordinates. `items`: `{ label, onSelect, danger?,
+ * disabled?, id? }`, or MENU_SEPARATOR between groups. Returns the menu node.
+ */
+export function openContextMenu(x, y, items, { documentRef = document, windowRef = window } = {}) {
+  closeOpenMenu?.();
+  const menu = documentRef.createElement('div');
+  menu.className = 'context-menu';
+  menu.setAttribute('role', 'menu');
+
+  const close = () => {
+    if (closeOpenMenu !== close) return;
+    closeOpenMenu = null;
+    documentRef.removeEventListener('pointerdown', onOutside, true);
+    documentRef.removeEventListener('keydown', onKey, true);
+    windowRef.removeEventListener('resize', close);
+    windowRef.removeEventListener('scroll', close, true);
+    menu.remove();
+  };
+  const onOutside = (event) => {
+    if (!menu.contains(event.target)) close();
+  };
+  const onKey = (event) => {
+    if (event.key === 'Escape') {
+      event.stopPropagation();
+      close();
+      return;
+    }
+    if (event.key !== 'ArrowDown' && event.key !== 'ArrowUp') return;
+    const buttons = [...menu.querySelectorAll('button:not([disabled])')];
+    if (!buttons.length) return;
+    const index = buttons.indexOf(documentRef.activeElement);
+    const next = event.key === 'ArrowDown'
+      ? buttons[(index + 1) % buttons.length]
+      : buttons[(index <= 0 ? buttons.length : index) - 1];
+    next.focus();
+    event.preventDefault();
+  };
+
+  for (const item of items) {
+    if (item === MENU_SEPARATOR) {
+      const rule = documentRef.createElement('div');
+      rule.className = 'context-menu-sep';
+      rule.setAttribute('role', 'separator');
+      menu.append(rule);
+      continue;
+    }
+    if (!item) continue;
+    const entry = documentRef.createElement('button');
+    entry.type = 'button';
+    entry.className = `context-menu-item${item.danger ? ' context-menu-item-danger' : ''}`;
+    entry.setAttribute('role', 'menuitem');
+    if (item.id) entry.dataset.menuItem = String(item.id);
+    entry.innerHTML = esc(item.label);
+    entry.disabled = item.disabled === true;
+    entry.addEventListener('click', (event) => {
+      event.preventDefault();
+      event.stopPropagation();
+      close();
+      item.onSelect?.();
+    });
+    menu.append(entry);
+  }
+
+  documentRef.body.append(menu);
+  // Positioned after insertion so the measured size is the real one.
+  const rect = menu.getBoundingClientRect();
+  const left = Math.max(4, Math.min(x, windowRef.innerWidth - rect.width - 4));
+  const top = Math.max(4, Math.min(y, windowRef.innerHeight - rect.height - 4));
+  menu.style.left = `${left}px`;
+  menu.style.top = `${top}px`;
+
+  closeOpenMenu = close;
+  documentRef.addEventListener('pointerdown', onOutside, true);
+  documentRef.addEventListener('keydown', onKey, true);
+  windowRef.addEventListener('resize', close);
+  windowRef.addEventListener('scroll', close, true);
+  queueMicrotask(() => menu.querySelector('button:not([disabled])')?.focus());
+  return menu;
+}
+
+/**
+ * Long-press as the touch equivalent of right-click, on every descendant of
+ * `root` that matches `selector`. Android fires no `contextmenu` for a long
+ * press on a non-selectable element. Cancelled by movement, so it never fires
+ * mid-scroll; mouse pointers are left to the real `contextmenu` event.
+ * `handler(target, x, y)`.
+ */
+export function bindLongPress(root, selector, handler, { setTimeoutImpl = setTimeout, clearTimeoutImpl = clearTimeout } = {}) {
+  let timer = null;
+  let startX = 0;
+  let startY = 0;
+  const cancel = () => {
+    if (timer !== null) clearTimeoutImpl(timer);
+    timer = null;
+  };
+  root.addEventListener('pointerdown', (event) => {
+    if (event.pointerType === 'mouse') return;
+    const target = event.target?.closest?.(selector);
+    if (!target || !root.contains(target)) return;
+    startX = event.clientX;
+    startY = event.clientY;
+    cancel();
+    timer = setTimeoutImpl(() => {
+      timer = null;
+      handler(target, startX, startY);
+    }, LONG_PRESS_MS);
+  }, { passive: true });
+  root.addEventListener('pointermove', (event) => {
+    if (Math.abs(event.clientX - startX) > LONG_PRESS_SLOP_PX || Math.abs(event.clientY - startY) > LONG_PRESS_SLOP_PX) cancel();
+  }, { passive: true });
+  for (const name of ['pointerup', 'pointercancel', 'pointerleave']) {
+    root.addEventListener(name, cancel, { passive: true });
+  }
+  return cancel;
+}

package/server/public/app/context-tier-options.mjs

@@ -55,6 +55,10 @@ export function buildContextTierOptions({
   const meta = metadata && typeof metadata === 'object' ? metadata : {};
   const defaultLabel = tokenLabel(defaultWindowTokens(meta));
   const provider = String(providerType || '').trim().toLowerCase();
+  // A cloud session has no tier to choose and its window is not in the merged
+  // metadata either (that number is Copilot's): one blank default, as for a
+  // Claude model whose window is unknown.
+  if (provider === 'claude-cloud') return [{ value: 'default', label: UNKNOWN_WINDOW_LABEL }];
   const claudeTierList = provider === 'claude' ? claudeTiersForModel(modelId, claudeTiers) : null;
   if (claudeTierList) {
     return claudeTierList

package/server/public/app/conversation-origin-ui.js

@@ -0,0 +1,27 @@
+// The header's "via agent · “title”" line: the conversation on screen was
+// started by an agent in another conversation on this relay, and the line
+// opens that conversation. Derived from the conversation record alone, so the
+// one sync function is idempotent and runs with every header sync. A
+// conversation another relay's agent created has no header line (its sidebar
+// marker is all there is), and neither has one a person started.
+
+import { conversations, currentConvId, IS_SHARED_VIEW } from './store.js';
+import { renderConversationHeaderOriginHtml } from './remote-relay-origin-view.mjs';
+
+let renderedHtml = '';
+
+export function syncConversationOriginHeader() {
+  const line = document.getElementById('chat-title-origin');
+  if (!line) return;
+  const id = String(currentConvId || '').trim();
+  const conversation = id ? (conversations[id] || null) : null;
+  const html = conversation
+    ? renderConversationHeaderOriginHtml(conversation, { conversations, linkable: !IS_SHARED_VIEW })
+    : '';
+  // This runs on every list render; the button must not be rebuilt under a tap.
+  if (html !== renderedHtml) {
+    line.innerHTML = html;
+    renderedHtml = html;
+  }
+  line.hidden = !html;
+}

package/server/public/app/conversation-provider-indicator.mjs

@@ -23,23 +23,39 @@ export function isConversationUsingGrokProvider(conversation = null) {
   return resolveConversationProviderType(conversation) === 'grok';
 }
 
-// An unresolved provider stays unlabelled rather than defaulting to Copilot, so
-// a conversation the client has not loaded yet cannot claim the wrong provider.
-export function conversationProviderIndicatorLabel(conversation = null) {
+// Its own provider, never a flavour of `claude`: the session runs in a sandbox
+// at Anthropic, so nothing that is true of a local Claude worker (modes,
+// effort, steering, a working directory) may be assumed for it.
+export function isConversationUsingClaudeCloudProvider(conversation = null) {
+  return resolveConversationProviderType(conversation) === 'claude-cloud';
+}
+
+// The marker that tells a cloud chat from a local Claude one at a glance.
+const CLAUDE_CLOUD_MARKER = '☁';
+
+function conversationProviderName(conversation = null) {
   const providerType = resolveConversationProviderType(conversation);
   if (providerType === 'openai') return 'OpenAI';
   if (providerType === 'claude') return 'Claude';
+  if (providerType === 'claude-cloud') return 'Claude Cloud';
   if (providerType === 'cursor') return 'Cursor';
   if (providerType === 'grok') return 'Grok';
   if (providerType === 'github' || providerType === 'github-copilot') return 'Copilot';
   return '';
 }
 
+// An unresolved provider stays unlabelled rather than defaulting to Copilot, so
+// a conversation the client has not loaded yet cannot claim the wrong provider.
+export function conversationProviderIndicatorLabel(conversation = null) {
+  const name = conversationProviderName(conversation);
+  return isConversationUsingClaudeCloudProvider(conversation) ? `${CLAUDE_CLOUD_MARKER} ${name}` : name;
+}
+
 // A question card names the runtime that asks, the way the list pill names it.
 // Unresolved reads plain "Question": every card used to say "Copilot question",
 // Claude's and Cursor's included.
 export function questionCardHeadLabel(conversation = null) {
-  const provider = conversationProviderIndicatorLabel(conversation);
+  const provider = conversationProviderName(conversation);
   return provider ? `${provider} question` : 'Question';
 }
 
@@ -50,6 +66,7 @@ const SESSION_LOCK_LABELS = {
   claude: 'Claude SDK',
   cursor: 'Cursor SDK',
   grok: 'Grok',
+  'claude-cloud': `${CLAUDE_CLOUD_MARKER} Claude Cloud`,
 };
 
 export function isOpenAIImageModelId(modelId = '') {
@@ -66,6 +83,7 @@ export function sessionLockProviderKey({ providerType = '', model = '' } = {}) {
   }
   if (normalized === 'openai-image' || normalized === 'openai-image-byok') return 'openai-image';
   if (normalized === 'claude' || normalized === 'claude-agent-sdk' || normalized === 'anthropic') return 'claude';
+  if (normalized === 'claude-cloud') return 'claude-cloud';
   if (normalized === 'cursor') return 'cursor';
   if (normalized === 'grok' || normalized === 'xai' || normalized === 'xai-grok') return 'grok';
   if (normalized === 'github' || normalized === 'github-copilot') return 'github';

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

@@ -49,7 +49,7 @@ import {
   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';
+import { sendMessage as sendMessageApi, cancelConversationTurn, cancelQueuedConversationTurn, cancelSubagentRun, compactConversation as compactConversationApi, scheduleContextUsageRefresh, loadConversation as loadConversationApi, loadSharedConversation, updateConversationDraft as updateConversationDraftApi, updateMessageShareVisibility, launchSessionWorker } from './api-client.js';
 import { enqueueOutboxRequest, registerOutboxSync } from './sync-outbox.mjs';
 import { linkifyWorkspaceMentionsInNode, parseAppFileHref, renderMarkdownPreview, rewriteLocalAssetUrlsInNode } from './router.js';
 import { renderAttachmentMarkup, removeComposerAttachments, uploadAttachments, setComposerAttachments, setRepoBrowserSessionInfo, openDriveFilePreview, openWorkspaceFilePreview, openUploadedAttachmentViewer } from './attachments-view.js';
@@ -546,6 +546,7 @@ function syncSendButtonState() {
     steeringSupported: conversationSupportsSteering(currentConvId),
     steeringHeld: steeringHold.held,
     steeringHoldReason: steeringHold.reason,
+    archived: conversations[String(currentConvId || '').trim()]?.archived === true,
   });
   btn.disabled = state.disabled;
   btn.dataset.action = state.action;
@@ -1283,6 +1284,15 @@ function createMessageNode(msg, msgId = null, force = false) {
   const steerMarkerClass = msg.role === 'assistant' ? STEER_MARKER_CLASS_BY_KIND[messageKind] : null;
   if (steerMarkerClass) div.classList.add(steerMarkerClass);
   const isStoppedSteer = msg.role === 'assistant' && messageKind === 'stopped';
+  // The relay's note while this session's worker cannot be started
+  // (worker-launch-note-service.mjs), rewritten in place as the episode goes
+  // on. Once the relay has stopped trying, the note carries Retry: a launch
+  // for once the cause is fixed.
+  const isWorkerLaunchNote = msg.role === 'assistant' && messageKind.startsWith('worker-launch-');
+  if (isWorkerLaunchNote) div.classList.add('msg-worker-launch', `msg-${messageKind}`);
+  const workerLaunchActionsHtml = (!IS_SHARED_VIEW && msgId && messageKind === 'worker-launch-stopped')
+    ? `<div class="msg-bubble-actions"><button type="button" class="bubble-action-btn" data-action="retry-worker-launch" data-message-id="${escHtml(msgId)}" title="Start the worker for this conversation again now">Retry</button></div>`
+    : '';
   // A turn answered by a different provider than the conversation is bound to
   // (e.g. the Copilot relay answering a Cursor conversation) must be visible,
   // not silent: it ran on another plan than the header indicates.
@@ -1404,13 +1414,14 @@ 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.
+  // Shared viewers get the badge without the link to the other relay (or, for
+  // an agent on this relay, to the conversation it runs in).
   const originBadgeHtml = remoteOrigin
-    ? renderRemoteOriginBadgeHtml(remoteOrigin, { linkable: !IS_SHARED_VIEW })
+    ? renderRemoteOriginBadgeHtml(remoteOrigin, { linkable: !IS_SHARED_VIEW, conversations })
     : '';
 
   div.innerHTML = `
-    <div class="${bubbleClass}">${shareVisibilityActionHtml}${thoughtsHtml}${originBadgeHtml}${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}${workerLaunchActionsHtml}</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');
@@ -1812,6 +1823,19 @@ function openStopTurnConfirmation(conversationId, messageId) {
   }, { once: true });
 }
 
+/** The Stop confirmation for a conversation's running turn, from outside the bubble (the sidebar menu). */
+export function openStopTurnConfirmationForConversation(conversationId) {
+  const turn = getActiveTurnForConversation(conversationId);
+  if (!turn?.messageId) return false;
+  openStopTurnConfirmation(conversationId, turn.messageId);
+  return true;
+}
+
+/** Whether a turn of this conversation is running as far as this page knows. */
+export function conversationHasActiveTurn(conversationId) {
+  return !!getActiveTurnForConversation(conversationId);
+}
+
 export function collapseThinkingThoughts() {
   const panel = document.getElementById('thinking-thoughts');
   if (!(panel instanceof HTMLDetailsElement)) return;
@@ -2773,6 +2797,55 @@ function releaseStoppedSteerResendsOf(messageId) {
   }
 }
 
+// Retry on the worker-launch note: ask the relay for a launch now. The relay
+// rewrites the note itself — the worker started, or the launches are
+// exhausted again — so the button only has to report a refused request.
+async function retryWorkerLaunch(conversationId, noteId) {
+  const conversationKey = String(conversationId || '').trim();
+  const id = String(noteId || '').trim();
+  if (!conversationKey || !id) return;
+  const btn = document.querySelector(`.bubble-action-btn[data-message-id="${CSS.escape(id)}"][data-action="retry-worker-launch"]`);
+  if (btn?.disabled) return;
+  const sdkSessionId = String(conversations[conversationKey]?.sdkSessionId || '').trim();
+  if (!sdkSessionId) {
+    showTransientRelayNotice('This conversation has no session to start a worker for.');
+    return;
+  }
+  if (btn) {
+    btn.disabled = true;
+    btn.textContent = 'Retrying…';
+  }
+  try {
+    // apiFetch answers null for a refused request (the route says 409 with
+    // the reason) as for a network failure: both re-arm the button.
+    const result = await launchSessionWorker(sdkSessionId);
+    if (!result || result.ok === false) throw new Error(String(result?.error || 'the relay refused the launch'));
+  } catch (error) {
+    showTransientRelayNotice(`The worker could not be started: ${error?.message || error}`);
+    if (btn) {
+      btn.disabled = false;
+      btn.textContent = 'Retry';
+    }
+  }
+}
+
+// A message the relay rewrote in place (the worker-launch note): the bubble is
+// rebuilt where it stands, so the transcript keeps its order. False when the
+// message is not on the page.
+export function replaceRenderedMessage(msg, msgId) {
+  const el = getMessagesElement();
+  const id = String(msgId || '').trim();
+  if (!el || !id) return false;
+  const existing = el.querySelector(`[data-message-id="${CSS.escape(id)}"]`);
+  if (!existing) return false;
+  const placeholder = document.createComment('replacing');
+  existing.replaceWith(placeholder);
+  seenMessageIds.delete(id);
+  const fresh = createMessageNode(msg, id, true);
+  placeholder.replaceWith(fresh || existing);
+  return Boolean(fresh);
+}
+
 async function resendStoppedSteer(conversationId, markerId) {
   const conversationKey = String(conversationId || '').trim();
   const id = String(markerId || '').trim();
@@ -3112,6 +3185,12 @@ function handleBubbleActionClick(event) {
     void resendStoppedSteer(currentConvId, messageId);
   }
 
+  if (action === 'retry-worker-launch' && messageId) {
+    event.preventDefault();
+    event.stopPropagation();
+    void retryWorkerLaunch(currentConvId, messageId);
+  }
+
   if (action === 'stop-subagent' && subagentRunId) {
     event.preventDefault();
     event.stopPropagation();

package/server/public/app/cwd-picker.js

@@ -23,6 +23,7 @@ import {
   buildKnownCwdOptions as buildKnownCwdOptionsFromInputs,
   normalizeKnownCwdPath,
 } from './known-cwd-options.mjs';
+import { buildCloudLineModel, cloudHeaderLabel, isClaudeCloudConversation } from './claude-cloud-ui.mjs';
 
 export { normalizeKnownCwdPath };
 
@@ -462,6 +463,17 @@ export function syncChatHeaderWorkspaceLabel() {
   const labelEl = document.getElementById('chat-title-cwd');
   if (!labelEl) return;
   const convId = String(currentConvId || '').trim();
+  const conversation = convId ? (conversations?.[convId] || null) : null;
+  if (isClaudeCloudConversation(conversation)) {
+    // A cloud chat runs on a clone at Anthropic, so the line names the
+    // repository instead of a folder on the relay host.
+    const label = cloudHeaderLabel(conversation.cloud);
+    labelEl.hidden = !label;
+    labelEl.textContent = label;
+    if (label) labelEl.title = buildCloudLineModel(conversation.cloud)?.repoUrl || label;
+    else labelEl.removeAttribute('title');
+    return;
+  }
   const cwd = getSelectedConversationCurrentCwd();
   if (!convId || !cwd) {
     labelEl.hidden = true;