@oar-sh/oar 0.9.1 → 0.9.3

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

@@ -43,6 +43,8 @@ function insertEmojiAtCaret(emoji) {
   input.selectionEnd = nextCaret;
   autoResize(input);
   input.focus();
+  // Runs the composer's input pipeline, which saves the draft.
+  input.dispatchEvent(new Event('input', { bubbles: true }));
 }
 
 function handleEmojiChoice(emoji) {

package/server/public/app/font-scaling.js

@@ -1,3 +1,5 @@
+import { captureTranscriptAnchor, restoreTranscriptAnchor } from './transcript-viewport-anchor.mjs';
+
 const FONT_SCALE_STORAGE_KEY = 'copilot_font_scale';
 const FONT_SCALE_MIN = 0.5;
 const FONT_SCALE_MAX = 1.5;
@@ -53,41 +55,6 @@ function normalizeFontScaleSelectValue(raw = '') {
   return clampFontScale(numeric);
 }
 
-function getMessageViewportAnchor() {
-  const container = document.getElementById('messages');
-  if (!container) return null;
-  const containerRect = container.getBoundingClientRect();
-  const messages = Array.from(container.querySelectorAll('.msg[data-message-id]'));
-  for (const message of messages) {
-    const rect = message.getBoundingClientRect();
-    if (rect.bottom <= containerRect.top || rect.top >= containerRect.bottom) continue;
-    const messageId = String(message.dataset.messageId || '').trim();
-    if (!messageId) continue;
-    return {
-      messageId,
-      offsetTop: rect.top - containerRect.top,
-    };
-  }
-  return null;
-}
-
-function restoreMessageViewportAnchor(anchor) {
-  if (!anchor?.messageId) return;
-  const container = document.getElementById('messages');
-  if (!container) return;
-  const messageId = String(anchor.messageId || '').trim();
-  if (!messageId) return;
-  const message = Array.from(container.querySelectorAll('.msg[data-message-id]'))
-    .find((node) => String(node?.dataset?.messageId || '').trim() === messageId);
-  if (!message) return;
-  const containerRect = container.getBoundingClientRect();
-  const rect = message.getBoundingClientRect();
-  const delta = rect.top - containerRect.top - Number(anchor.offsetTop || 0);
-  if (Math.abs(delta) > 0.5) {
-    container.scrollTop += delta;
-  }
-}
-
 export function syncFontScaleSelect() {
   const select = document.getElementById('font-scale-select');
   if (!select) return;
@@ -117,7 +84,7 @@ export function setFontScale(nextScale, { persist = true, preserveMessageAnchor
     syncFontScaleSelect();
     return normalized;
   }
-  const anchor = preserveMessageAnchor ? getMessageViewportAnchor() : null;
+  const anchor = preserveMessageAnchor ? captureTranscriptAnchor(document.getElementById('messages')) : null;
   fontScaleValue = normalized;
   document.documentElement.style.setProperty('--font-scale', normalized.toFixed(4));
   document.documentElement.style.setProperty('--font-scale-percent', `${Math.round(normalized * 100)}%`);
@@ -125,7 +92,7 @@ export function setFontScale(nextScale, { persist = true, preserveMessageAnchor
   syncFontScaleSelect();
   if (anchor) {
     requestAnimationFrame(() => {
-      restoreMessageViewportAnchor(anchor);
+      restoreTranscriptAnchor(document.getElementById('messages'), anchor);
     });
   }
   return normalized;

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

@@ -36,7 +36,7 @@ import {
   loadGrokSettings,
   loadOpenAISettings,
 } from './api-client.js';
-import { renderMessages, restoreInFlightThinking, focusConversationMessageById, flushConversationDraft, hydrateConversationDraft } from './conversation-view.js';
+import { renderMessages, restoreInFlightThinking, focusConversationMessageById, flushConversationDraft, hydrateConversationDraft, beginConversationDraftSwitch } from './conversation-view.js';
 import { setBackgroundTasksConversation, setConversationBackgroundTasks } from './background-tasks-view.mjs';
 import { mergeConversationPreviews } from './preview-cards.mjs';
 import { loadRelayQuestions, getPendingQuestionCountsByConversation } from './ask-user-view.js';
@@ -47,15 +47,23 @@ import { shouldApplyConversationLoad } from './activity-replay-state.mjs';
 import { createInfiniteLoader } from './infinite-loader.js';
 import {
   buildNewConversationModelChoices,
+  newConversationContextTierState,
   reasoningChoicesForProviderModel,
   resolvePreferredReasoningEffort,
 } from './new-conversation-model-choice.mjs';
+import { buildCatalogModelOptions } from './model-selector-options.mjs';
 import { isReasoningOffUnsupported, reasoningEffortOptionLabel, reasoningEffortOptionTitle } from './reasoning-effort-labels.mjs';
 import {
   conversationProviderIndicatorKey,
   conversationProviderIndicatorLabel,
 } from './conversation-provider-indicator.mjs';
 import { leaveStatusView } from './status-view.mjs';
+import {
+  normalizeConversationFilter,
+  filterConversations,
+  drainRemainingPages,
+  describeFilterMatchCount,
+} from './conversation-list-filter.mjs';
 
 const PROCESSING_DOT_FRAMES = ['   ', '.  ', '.. ', '...'];
 const PROCESSING_DOT_INTERVAL_MS = 1000;
@@ -72,9 +80,13 @@ const CLAUDE_LONG_CONTEXT_PATTERN = /\[1m\]$/i;
 const OPENAI_IMAGE_SIZE_STORAGE_KEY = 'copilot_openai_image_size';
 const NEW_CHAT_CWD_STORAGE_KEY = 'copilot_new_chat_cwd';
 const NEW_CHAT_CUSTOM_CWD_VALUE = '__custom__';
+const CONV_FILTER_DEBOUNCE_MS = 220;
 let processingDotFrame = 0;
 let processingDotTimer = null;
 let lastConvListHtml = '';
+let conversationListFilterText = '';
+let conversationFilterDrainActive = false;
+let conversationFilterGeneration = 0;
 let openConversationVersion = 0;
 let newConversationInFlight = false;
 
@@ -271,6 +283,11 @@ export async function refreshConversations(options = {}) {
   });
   renderConvList();
   updateCompactButton();
+  // A reset bumps the loader version, which aborts any in-flight filter drain;
+  // restart it so an active filter keeps covering the unloaded pages.
+  if (normalizeConversationFilter(conversationListFilterText)) {
+    void drainConversationListForFilter();
+  }
 }
 
 export function renderConvList() {
@@ -280,9 +297,19 @@ export function renderConvList() {
     if (updatedAtDelta !== 0) return updatedAtDelta;
     return String(b?.id || '').trim().localeCompare(String(a?.id || '').trim());
   });
+  const activeFilter = normalizeConversationFilter(conversationListFilterText);
+  const visible = activeFilter ? filterConversations(sorted, activeFilter) : sorted;
   const pendingByConversation = getPendingQuestionCountsByConversation();
   let hasProcessingConversation = false;
   const footerHtml = (() => {
+    if (activeFilter) {
+      // While a filter is active the drain loads older pages by itself; a
+      // "scroll for more" hint would point at a gesture that does nothing, and
+      // "Searching…" must only show while something is actually loading.
+      return (conversationFilterDrainActive || conversationListPaginationState.isLoading)
+        ? '<div class="conv-list-footer">Searching older conversations…</div>'
+        : '';
+    }
     if (conversationListPaginationState.isLoading) {
       return '<div class="conv-list-footer">Loading older conversations…</div>';
     }
@@ -291,10 +318,14 @@ export function renderConvList() {
     }
     return '';
   })();
-  if (sorted.length === 0) {
+  if (visible.length === 0) {
     ensureProcessingDotTimer(false);
-    list.innerHTML = '<div style="padding:12px;color:var(--muted);font-size:0.85rem;text-align:center">No conversations yet</div>';
+    const emptyText = activeFilter && sorted.length > 0
+      ? 'No conversations match your filter'
+      : 'No conversations yet';
+    list.innerHTML = `<div style="padding:12px;color:var(--muted);font-size:0.85rem;text-align:center">${emptyText}</div>${footerHtml}`;
     lastConvListHtml = '';
+    scheduleConversationListBoundaryCheck();
     return;
   }
   const conversationView = (conversation) => {
@@ -310,7 +341,7 @@ export function renderConvList() {
     if (processing) hasProcessingConversation = true;
     return { visualState, processing };
   };
-  const listHtml = `${sorted.map((c) => {
+  const listHtml = `${visible.map((c) => {
     const view = conversationView(c);
     const processingDots = view.processing ? PROCESSING_DOT_FRAMES[processingDotFrame] : '';
     const providerIndicatorLabel = conversationProviderIndicatorLabel(c);
@@ -425,6 +456,7 @@ export async function openConversation(id, options = {}) {
     await flushConversationDraft(previousConversationId);
     window.clearImageEditTarget?.();
   }
+  const switchingConversation = !!nextConversationId && previousConversationId !== nextConversationId;
   const capturedVersion = ++openConversationVersion;
   setCurrentConv(id);
   if (repoBrowserState.activeRoot === 'workspace') {
@@ -438,7 +470,13 @@ export async function openConversation(id, options = {}) {
     repoBrowserState.error = '';
   }
   closeSidebar();
-  clearAttachments();
+  // Reopening the conversation on screen (session bind, clicking it again, a
+  // push or search jump) must leave its composer alone: emptied attachments
+  // would read as a user edit and be saved, dropping them from the draft.
+  if (switchingConversation) {
+    clearAttachments();
+    beginConversationDraftSwitch(nextConversationId);
+  }
   document.getElementById('chat-title').textContent = conversations[id]?.title || id;
   if (didLeaveStatusView) {
     restoreInFlightThinking(null);
@@ -640,6 +678,32 @@ function populateNewConversationSizeSelect(providerType = 'github', selectedMode
   if (status) status.textContent = 'Image size used for generated outputs in this chat.';
 }
 
+// Read-only: the composer chip is the only place a tier is chosen (see
+// newConversationContextTierState), so this just tells the user what the
+// picked model gives them before the chat exists.
+function populateNewConversationContextRow(providerType = 'github', selectedModel = '') {
+  const select = document.getElementById('new-conversation-context-select');
+  const row = document.getElementById('new-conversation-context-row');
+  if (!select || !row) return;
+  const { visible, options } = newConversationContextTierState(newConversationCatalogCache || {}, {
+    provider: normalizeNewConversationProviderType(providerType),
+    modelId: selectedModel,
+  });
+  select.innerHTML = '';
+  if (!visible) {
+    row.style.display = 'none';
+    return;
+  }
+  for (const tier of options) {
+    const option = document.createElement('option');
+    option.value = tier.value;
+    option.textContent = tier.label;
+    select.appendChild(option);
+  }
+  select.value = options[0].value;
+  row.style.display = 'block';
+}
+
 async function populateNewConversationReasoningSelect(selectedModel = '') {
   const select = document.getElementById('new-conversation-reasoning-select');
   const status = document.getElementById('new-conversation-reasoning-status');
@@ -727,29 +791,25 @@ async function populateNewConversationModelSelect(providerType = 'github') {
   const target = document.getElementById('new-conversation-model-select');
   if (!target) return false;
   target.innerHTML = '';
-  const source = document.getElementById('model-select');
-  const sourceLabelByValue = new Map(
-    Array.from(source?.options || []).map((option) => [
-      String(option.value || '').trim(),
-      String(option.textContent || option.value || '').trim(),
-    ]),
-  );
   const catalog = newConversationCatalogCache || await loadModelCatalog();
   if (!catalog || !Array.isArray(catalog.models)) return false;
   const normalizedProvider = normalizeNewConversationProviderType(providerType);
+  const eligibleModels = catalog.models
+    .map((modelId) => String(modelId || '').trim())
+    .filter((modelId) => modelMatchesNewConversationProvider(catalog, modelId, normalizedProvider))
+    .filter((modelId) => (
+      normalizedProvider !== 'openai-image' || isOpenAIImageModelId(modelId)
+    ));
+  // The same builder the composer's #model-select uses, on the same catalog,
+  // so the two pickers agree on order and wording by construction. The modal
+  // used to borrow labels from the composer, which is scoped to the OPEN
+  // conversation's provider and so knew nothing about the models of another.
+  const hasAuto = eligibleModels.some((modelId) => modelId.toLowerCase() === 'auto');
   const choices = buildNewConversationModelChoices(
-    catalog.models
-      .filter((modelId) => modelMatchesNewConversationProvider(catalog, modelId, normalizedProvider))
-      .filter((modelId) => (
-        normalizedProvider !== 'openai-image' || isOpenAIImageModelId(modelId)
-      ))
-      .map((modelId) => {
-        const value = String(modelId || '').trim();
-        return {
-          value,
-          label: sourceLabelByValue.get(value) || value,
-        };
-      }),
+    buildCatalogModelOptions(eligibleModels, {
+      metadataByModel: catalog.modelMetadataByModel || {},
+      annotateContextWindow: normalizedProvider !== 'claude',
+    }).filter((option) => hasAuto || option.value.toLowerCase() !== 'auto'),
   );
   for (const choice of choices) {
     const option = document.createElement('option');
@@ -767,6 +827,7 @@ async function populateNewConversationModelSelect(providerType = 'github') {
   updateNewConversationProviderHelp(normalizedProvider);
   syncNewConversationReasoningLabel(normalizedProvider);
   populateNewConversationSizeSelect(normalizedProvider, target.value);
+  populateNewConversationContextRow(normalizedProvider, target.value);
   await populateNewConversationReasoningSelect(target.value);
   return true;
 }
@@ -939,6 +1000,7 @@ async function openNewConversationModelModal() {
     modelSelect.addEventListener('change', () => {
       const provider = String(document.getElementById('new-conversation-provider-select')?.value || '').trim();
       populateNewConversationSizeSelect(provider, modelSelect.value);
+      populateNewConversationContextRow(provider, modelSelect.value);
       void populateNewConversationReasoningSelect(modelSelect.value);
     });
   }
@@ -1119,11 +1181,115 @@ export function initConversationListLazyLoading() {
   scheduleConversationListBoundaryCheck();
 }
 
+// A title filter has to search conversations that only exist on unloaded pages,
+// so an active filter drains the remaining pages in the background. Each page
+// re-renders via applyPage, so matches appear as they load.
+// A filter change aborts the running drain and starts a fresh one, so the new
+// filter gets a full retry budget.
+async function drainConversationListForFilter() {
+  if (conversationFilterDrainActive) return;
+  conversationFilterDrainActive = true;
+  const generation = conversationFilterGeneration;
+  renderConvList();
+  try {
+    await drainRemainingPages(
+      conversationListLoader,
+      () => generation === conversationFilterGeneration
+        && !!normalizeConversationFilter(conversationListFilterText),
+    );
+  } finally {
+    conversationFilterDrainActive = false;
+    const filterActive = !!normalizeConversationFilter(conversationListFilterText);
+    if (filterActive && generation !== conversationFilterGeneration) {
+      void drainConversationListForFilter();
+    } else {
+      // The "Searching older conversations…" footer keys off the drain flag.
+      renderConvList();
+      if (filterActive) announceConversationFilterResults();
+    }
+  }
+}
+
+// Announced only when the (debounced) filter applies and when its drain ends,
+// not on every page render, so screen readers are not flooded while typing.
+// Unchanged text is not rewritten: refresh-triggered drains (session bind,
+// reconnect) must not re-announce without a user action.
+function announceConversationFilterResults() {
+  const status = document.getElementById('conv-filter-status');
+  if (!status) return;
+  const activeFilter = normalizeConversationFilter(conversationListFilterText);
+  let text = '';
+  if (activeFilter) {
+    const count = filterConversations(Object.values(conversations), activeFilter).length;
+    if (!conversationListLoader.getState().hasMore) {
+      text = describeFilterMatchCount(count);
+    } else if (conversationFilterDrainActive) {
+      text = `${describeFilterMatchCount(count)} so far, searching older conversations`;
+    } else {
+      // The drain gave up with pages left, so the search is not complete.
+      text = describeFilterMatchCount(count, { loadedOnly: true });
+    }
+  }
+  if (status.textContent !== text) status.textContent = text;
+}
+
+function setConversationListFilter(text) {
+  const next = String(text ?? '');
+  if (next === conversationListFilterText) return;
+  conversationListFilterText = next;
+  conversationFilterGeneration += 1;
+  const list = getConversationListElement();
+  if (list) list.scrollTop = 0;
+  renderConvList();
+  if (normalizeConversationFilter(next)) void drainConversationListForFilter();
+  announceConversationFilterResults();
+}
+
+export function initConversationFilter() {
+  const input = document.getElementById('conv-filter-input');
+  const clearButton = document.getElementById('conv-filter-clear');
+  if (!input || input.dataset.filterBound === '1') return;
+  input.dataset.filterBound = '1';
+  let debounceTimer = null;
+  const syncClearButton = () => {
+    if (clearButton) clearButton.hidden = input.value === '';
+  };
+  const applyFilterNow = () => {
+    if (debounceTimer) {
+      clearTimeout(debounceTimer);
+      debounceTimer = null;
+    }
+    syncClearButton();
+    setConversationListFilter(input.value);
+  };
+  input.addEventListener('input', () => {
+    syncClearButton();
+    if (debounceTimer) clearTimeout(debounceTimer);
+    debounceTimer = setTimeout(applyFilterNow, CONV_FILTER_DEBOUNCE_MS);
+  });
+  input.addEventListener('keydown', (event) => {
+    if (event.key !== 'Escape' || input.value === '') return;
+    event.stopPropagation();
+    input.value = '';
+    applyFilterNow();
+  });
+  clearButton?.addEventListener('click', () => {
+    input.value = '';
+    applyFilterNow();
+    input.focus();
+  });
+  syncClearButton();
+}
+
 export async function deleteConv(e, id) {
   e.stopPropagation();
   if (!confirm('Delete this conversation?')) return;
   const result = await deleteConversationApi(id);
   if (!result) return;
+  if (result.ok === false) {
+    showTransientRelayNotice(String(result.message || '').trim() || 'This conversation could not be deleted.', 6000);
+    return;
+  }
   delete conversations[id];
   renderConvList();
   if (currentConvId === id) {

package/server/public/app/model-selector-options.mjs

@@ -1,6 +1,152 @@
+import { tokenLabel } from './context-tier-options.mjs';
+
+/**
+ * The composer placeholder, decided by the MODEL FAMILY of the current
+ * selection (maintainer's rule: the hint names who answers, whatever runtime serves
+ * it — claude-* through Cursor's catalog still reads "Message Claude…").
+ * Provider only breaks ties: Auto/empty follows the conversation's bound
+ * provider, unknown families on the OpenAI BYOK provider read OpenAI, and
+ * everything else falls back to the historical Copilot text.
+ */
+export function composerPlaceholderFor({ modelId = '', providerType = '' } = {}) {
+  const provider = String(providerType || '').trim().toLowerCase();
+  const id = String(modelId || '').trim().toLowerCase().replace(/\[[^\]]*\]$/, '');
+  const providerFallback = () => {
+    if (provider === 'claude') return 'Message Claude…';
+    if (provider === 'grok') return 'Message Grok…';
+    if (provider === 'openai' || provider === 'openai-byok') return 'Message OpenAI…';
+    if (provider === 'cursor') return 'Message Cursor…';
+    return 'Message Copilot…';
+  };
+  if (!id || id === 'auto') return providerFallback();
+  if (id.startsWith('claude-')) return 'Message Claude…';
+  if (id.startsWith('grok-')) return 'Message Grok…';
+  if (id.startsWith('gpt-')) return 'Message GPT…';
+  if (id.startsWith('gemini-')) return 'Message Gemini…';
+  // Composer is Cursor's house model family.
+  if (id.startsWith('composer-')) return 'Message Cursor…';
+  return providerFallback();
+}
+
+/**
+ * Human label for a model id, tuned to fit narrow composer selects.
+ *
+ * Claude ids drop the redundant "claude-" prefix (Opus/Sonnet/Haiku/Fable are
+ * unmistakably Claude), join hyphenated version parts with dots, and drop
+ * trailing -YYYYMMDD snapshot dates: `claude-fable-5-1` -> "Fable 5.1",
+ * `claude-haiku-4-5-20251001` -> "Haiku 4.5". A bracketed capability suffix
+ * survives verbatim: `claude-opus-5[1m]` -> "Opus 5 [1m]".
+ */
+export function humanizeModelLabel(modelId = '') {
+  const text = String(modelId || '').trim();
+  if (!text) return '';
+  if (/^gpt-/i.test(text)) {
+    return text
+      .replace(/^gpt-/i, 'GPT-')
+      .replace(/-codex$/i, ' Codex')
+      .replace(/-mini$/i, ' Mini');
+  }
+  if (/^claude-/i.test(text)) {
+    const suffixMatch = /\[([^\]]+)\]$/.exec(text);
+    const base = suffixMatch ? text.slice(0, suffixMatch.index) : text;
+    const parts = base
+      .replace(/^claude-/i, '')
+      .split('-')
+      .filter((part, index, all) => !(index === all.length - 1 && /^\d{8}$/.test(part)));
+    const words = [];
+    for (const part of parts) {
+      const isNumeric = /^\d+(\.\d+)?$/.test(part);
+      if (isNumeric && words.length && words[words.length - 1].isNumeric) {
+        words[words.length - 1].text += `.${part}`;
+      } else {
+        words.push({ text: isNumeric ? part : part.charAt(0).toUpperCase() + part.slice(1), isNumeric });
+      }
+    }
+    const label = words.map((word) => word.text).join(' ');
+    return suffixMatch ? `${label} [${suffixMatch[1]}]` : label;
+  }
+  if (/^gemini-/i.test(text)) {
+    return text
+      .replace(/^gemini-/i, 'Gemini ')
+      .split('-')
+      .map((part) => (/^\d+(\.\d+)?$/.test(part) ? part : (part.charAt(0).toUpperCase() + part.slice(1))))
+      .join(' ');
+  }
+  return text;
+}
+
+const VARIANT_EFFORT_SUFFIX = /^(.*)-(none|minimal|low|medium|high|xhigh|max)$/i;
+
+// "gpt-5-high" style ids carry the effort as a suffix; the label shows it in
+// parentheses and the metadata lookup uses the base id.
+export function splitModelVariantId(modelVariantId = '') {
+  const value = String(modelVariantId || '').trim();
+  if (!value) return { baseModelId: '', reasoningEffort: null };
+  const match = value.match(VARIANT_EFFORT_SUFFIX);
+  if (!match) return { baseModelId: value, reasoningEffort: null };
+  return {
+    baseModelId: String(match[1] || '').trim(),
+    reasoningEffort: String(match[2] || '').trim().toLowerCase(),
+  };
+}
+
+// Server catalogs key metadata by the id they publish; stored preferences and
+// variant ids may differ only in case.
+export function modelMetadataFor(modelId = '', metadataByModel = {}) {
+  const map = metadataByModel && typeof metadataByModel === 'object' ? metadataByModel : {};
+  const { baseModelId } = splitModelVariantId(modelId);
+  if (!baseModelId) return null;
+  const direct = map[baseModelId];
+  if (direct && typeof direct === 'object') return direct;
+  const lower = baseModelId.toLowerCase();
+  const key = Object.keys(map).find((candidate) => candidate.toLowerCase() === lower);
+  return key && map[key] && typeof map[key] === 'object' ? map[key] : null;
+}
+
+// Number(null) is 0, which would put every unindexed model first.
+function finiteIndexOrNull(value) {
+  if (value === null || value === undefined || value === '') return null;
+  const index = Number(value);
+  return Number.isFinite(index) && index >= 0 ? index : null;
+}
+
+export function catalogOrderFor(modelId = '', metadataByModel = {}) {
+  return finiteIndexOrNull(modelMetadataFor(modelId, metadataByModel)?.catalogIndex);
+}
+
+// Runtime display name when the catalog has one ("GPT-5.4 mini"), otherwise
+// the compact humanized id; variant ids keep their "(effort)" tail.
+export function catalogModelLabel(modelId = '', metadataByModel = {}, { autoValue = 'auto' } = {}) {
+  const value = String(modelId || '').trim();
+  if (value.toLowerCase() === String(autoValue || 'auto').trim().toLowerCase()) return 'Auto';
+  const { baseModelId, reasoningEffort } = splitModelVariantId(value);
+  if (!baseModelId) return value;
+  const displayName = String(modelMetadataFor(value, metadataByModel)?.displayName || '').trim();
+  const baseLabel = displayName || humanizeModelLabel(baseModelId);
+  return reasoningEffort ? `${baseLabel} (${reasoningEffort})` : baseLabel;
+}
+
+export function contextWindowSuffix(modelId = '', metadataByModel = {}) {
+  const metadata = modelMetadataFor(modelId, metadataByModel);
+  if (!metadata) return '';
+  const real = Number(metadata.contextWindowTokens);
+  const tokens = Number.isFinite(real) && real > 0 ? real : Number(metadata.defaultContextLimitTokens);
+  return Number.isFinite(tokens) && tokens > 0 ? ` · ${tokenLabel(tokens)}` : '';
+}
+
+/**
+ * Auto first, then the server's catalog order where it supplies one
+ * (orderFor → finite index), then everything else alphabetically by bare
+ * label. Copilot's canonical order therefore wins for Copilot models while
+ * SDK-only catalogs (no index) keep the alphabetical list they always had.
+ * suffixFor is applied after sorting and after collision detection so the
+ * sort key and the "same label" check never see the window annotation.
+ */
 export function normalizeModelSelectorOptions(models = [], {
   autoValue = 'auto',
   labelFor = (modelId) => modelId,
+  orderFor = () => null,
+  suffixFor = () => '',
 } = {}) {
   const normalizedAuto = String(autoValue || 'auto').trim() || 'auto';
   const values = Array.from(new Set(
@@ -8,7 +154,10 @@ export function normalizeModelSelectorOptions(models = [], {
       .map((modelId) => String(modelId || '').trim())
       .filter(Boolean),
   )).filter((modelId) => modelId.toLowerCase() !== normalizedAuto.toLowerCase());
+  const orderOf = (modelId) => finiteIndexOrNull(orderFor(modelId)) ?? Number.POSITIVE_INFINITY;
   values.sort((left, right) => {
+    const indexOrder = orderOf(left) - orderOf(right);
+    if (indexOrder) return indexOrder;
     const labelOrder = String(labelFor(left) || left).localeCompare(
       String(labelFor(right) || right),
       undefined,
@@ -16,10 +165,45 @@ export function normalizeModelSelectorOptions(models = [], {
     );
     return labelOrder || left.localeCompare(right);
   });
-  return [
+  const options = [
     { value: normalizedAuto, label: String(labelFor(normalizedAuto) || normalizedAuto) },
     ...values.map((value) => ({ value, label: String(labelFor(value) || value) })),
   ];
+  // Date-stripping in humanizeModelLabel can collapse an alias and its dated
+  // snapshot ("claude-fable-5-1" + "claude-fable-5-1-20251103") into the same
+  // label; two indistinguishable rows are worse than one ugly one, so
+  // colliding labels fall back to the raw id.
+  const labelCounts = new Map();
+  for (const option of options) {
+    labelCounts.set(option.label, (labelCounts.get(option.label) || 0) + 1);
+  }
+  return options.map((option) => {
+    const label = labelCounts.get(option.label) > 1 ? option.value : option.label;
+    const suffix = option.value === normalizedAuto ? '' : String(suffixFor(option.value) || '');
+    return { value: option.value, label: `${label}${suffix}` };
+  });
+}
+
+/**
+ * The one option list both pickers render (composer #model-select and the
+ * New Chat modal), so they cannot disagree on order or wording. Callers filter
+ * by provider afterwards; annotateContextWindow is off for Claude SDK
+ * conversations, whose window the merged metadata does not know (see
+ * buildContextTierOptions).
+ */
+export function buildCatalogModelOptions(models = [], {
+  autoValue = 'auto',
+  metadataByModel = {},
+  annotateContextWindow = true,
+} = {}) {
+  return normalizeModelSelectorOptions(models, {
+    autoValue,
+    labelFor: (modelId) => catalogModelLabel(modelId, metadataByModel, { autoValue }),
+    orderFor: (modelId) => catalogOrderFor(modelId, metadataByModel),
+    suffixFor: annotateContextWindow
+      ? (modelId) => contextWindowSuffix(modelId, metadataByModel)
+      : () => '',
+  });
 }
 
 export function modelSelectorOptionsEqual(currentOptions = [], nextOptions = []) {

package/server/public/app/new-conversation-model-choice.mjs

@@ -1,3 +1,7 @@
+import { nearestSupportedReasoningEffort } from './conversation-preferences.mjs';
+import { buildContextTierOptions, UNKNOWN_WINDOW_LABEL } from './context-tier-options.mjs';
+import { modelMetadataFor } from './model-selector-options.mjs';
+
 export function shouldPromptForNewConversationModel({ provider = '' } = {}) {
   const normalizedProvider = String(provider || '').trim().toLowerCase();
   return normalizedProvider === 'openai'
@@ -54,14 +58,30 @@ export function reasoningChoicesForProviderModel(catalog = {}, {
   return normalizeReasoningEfforts(catalog?.reasoningByModel?.[normalizedModelId] || []);
 }
 
+// Same clamp as the composer (nearestSupportedReasoningEffort) so a remembered
+// tier lands on the same rung whichever picker starts the chat.
 export function resolvePreferredReasoningEffort(efforts = [], preferredValues = []) {
-  const normalizedEfforts = normalizeReasoningEfforts(efforts);
-  if (!normalizedEfforts.length) return '';
-  const candidates = Array.isArray(preferredValues) ? preferredValues : [preferredValues];
-  for (const candidate of candidates) {
-    const value = String(candidate || '').trim().toLowerCase();
-    if (value && normalizedEfforts.includes(value)) return value;
-  }
-  const firstNonNone = normalizedEfforts.find((value) => value !== 'none');
-  return firstNonNone || normalizedEfforts[0];
+  return nearestSupportedReasoningEffort(
+    Array.isArray(preferredValues) ? preferredValues : [preferredValues],
+    normalizeReasoningEfforts(efforts),
+  );
+}
+
+/**
+ * The read-only context row of the New Chat modal. Only Copilot chats show it:
+ * the modal has no tier preference to persist (the composer's long_context
+ * choice is stored only as a Claude "[1m]" id), so it mirrors what the composer
+ * chip will read for the chosen model and hides when no window is known
+ * ("auto", stale metadata).
+ */
+export function newConversationContextTierState(catalog = {}, { provider = '', modelId = '' } = {}) {
+  const providerKey = normalizeProviderKey(provider);
+  if (providerKey !== 'github') return { visible: false, options: [] };
+  const options = buildContextTierOptions({
+    modelId,
+    providerType: providerKey,
+    metadata: modelMetadataFor(modelId, catalog?.modelMetadataByModel || {}) || {},
+  });
+  const known = options.filter((option) => option.label !== UNKNOWN_WINDOW_LABEL);
+  return { visible: known.length > 0, options: known };
 }