codex-overleaf-link 2.4.0 → 2.5.0

package/extension/src/content/activeTurnControl.js

@@ -98,6 +98,11 @@
         if (!journal?.terminal && !journal?.ownerLost) {
           continue;
         }
+        // Native completion can precede the owner's writeback and durable
+        // session save. A passive shared-history reader must not settle it.
+        if (options.requireOwnerLost === true && journal.ownerLost !== true) {
+          continue;
+        }
         const session = options.findSession?.(journal.sessionId);
         if (!session) {
           continue;
@@ -112,6 +117,9 @@
         if (!record) {
           continue;
         }
+        if (record.status === 'running') {
+          options.normalizeInterruptedRun?.(record);
+        }
         const reloadReports = (record.events || []).filter(event => event?.failure?.source === 'panel_reload');
         record.events = (record.events || []).filter(event => event?.failure?.source !== 'panel_reload');
         const lastSequence = Number(record.nativeEventSeq || 0);

package/extension/src/content/assetTransferBroker.js

@@ -9,38 +9,128 @@
 
   function create(deps = {}) {
     const { callPageBridge, sendBackgroundNative } = deps;
+    const now = deps.now || Date.now;
+    const delay = deps.delay || (ms => new Promise(resolve => setTimeout(resolve, ms)));
 
     async function applyOperations(input = {}) {
       const results = [];
-      let textBatch = [];
+      const deadlineAt = Number.isFinite(input.deadlineAt) && input.deadlineAt > 0 ? input.deadlineAt : null;
+      const invalidDeadline = input.deadlineAt !== undefined && deadlineAt === null;
+      const expired = () => invalidDeadline || (deadlineAt !== null && now() >= deadlineAt);
+      let textBatch = [], blocked = false;
+      function skipUndispatched(operations) {
+        const result = normalizeTextResult({ ok: false,
+          code: blocked ? 'writeback_tail_not_started' : 'writeback_deadline_exceeded',
+          error: blocked ? 'An earlier writeback is unconfirmed. This operation was not dispatched.'
+            : invalidDeadline ? 'The writeback deadline is invalid. This operation was not dispatched.'
+              : 'The writeback deadline has elapsed. This operation was not dispatched.',
+          changedDocument: false }, operations);
+        result.receiptUnconfirmed = false;
+        results.push(result);
+      }
       async function flushTextBatch() {
         if (!textBatch.length) return;
-        results.push(await callPageBridge('applyOperations', {
-          operations: textBatch,
+        const operations = textBatch;
+        textBatch = [];
+        if (blocked || expired()) { skipUndispatched(operations); return; }
+        const response = await callPageBridge('applyOperations', {
+          operations,
           baseFiles: input.baseFiles || [],
+          reviewingPolicy: input.reviewingPolicy || '',
+          ...(deadlineAt !== null ? { deadlineAt } : {}),
           requireReviewing: input.requireReviewing === true,
           requireEditing: input.requireEditing === true,
+          retryCreates: input.retryCreates === true,
           runProjectId: input.runProjectId || ''
-        }));
-        textBatch = [];
+        });
+        const recovered = response?.code === 'page_bridge_timeout' && response.requestId
+          ? await recoverTextReceipt(response, operations, input.runProjectId || '', deadlineAt)
+          : response;
+        const result = normalizeTextResult(recovered, operations);
+        results.push(result);
+        blocked = result.receiptUnconfirmed === true;
       }
       for (const operation of Array.isArray(input.operations) ? input.operations : []) {
+        if (blocked || expired()) {
+          skipUndispatched([operation]);
+          continue;
+        }
         if (!BINARY_TYPES.has(operation?.type)) {
           textBatch.push(operation);
           continue;
         }
         await flushTextBatch();
-        results.push(await applyBinaryOperation(operation, input));
+        if (blocked || expired()) {
+          skipUndispatched([operation]);
+          continue;
+        }
+        const binaryResult = await applyBinaryOperation(operation, input);
+        results.push(binaryResult);
+        blocked = binaryResult.receiptUnconfirmed === true;
       }
       await flushTextBatch();
       return mergeApplyResults(results);
     }
 
+    async function recoverTextReceipt(timeout, operations, runProjectId, deadlineAt = null) {
+      const budget = Number.isFinite(deps.receiptTimeoutMs) ? Math.max(0, deps.receiptTimeoutMs)
+        : Math.min(600000, Math.max(90000, operations.length * 60000));
+      const deadline = deadlineAt ?? (now() + budget);
+      let partial = {}, state = 'unavailable', recoveryError = '', first = true;
+      while (deadlineAt === null ? (first || now() <= deadline) : now() < deadline) {
+        first = false;
+        let receipt, transportFailed = false;
+        try {
+          receipt = await callPageBridge('getWritebackReceipt', { requestId: timeout.requestId, runProjectId,
+            ...(deadlineAt !== null ? { deadlineAt } : {}) });
+        } catch (error) {
+          if (error?.code === 'codex_cancelled' || error?.cancelled === true) throw error;
+          recoveryError = error?.message || String(error);
+          if (!isTransientReceiptFailure(error)) break;
+          transportFailed = true;
+        }
+        if (!transportFailed) {
+          if (receipt?.code === 'codex_cancelled' || receipt?.cancelled === true) {
+            throw responseError(receipt, 'codex_cancelled');
+          }
+          if (receipt?.ok !== true) {
+            recoveryError = receipt?.error?.message || receipt?.error || receipt?.reason
+              || 'Writeback receipt could not be read.';
+            if (!isTransientReceiptFailure(receipt)) break;
+          } else {
+            if (receipt.requestId !== timeout.requestId || receipt.runProjectId !== runProjectId) {
+              recoveryError = 'Writeback receipt identity could not be confirmed.';
+              break;
+            }
+            state = receipt.state;
+            if (receipt.result && typeof receipt.result === 'object') partial = receipt.result;
+            if (state === 'completed') {
+              if (!receipt.result || typeof receipt.result !== 'object') {
+                recoveryError = 'The completed writeback receipt has no result.';
+                break;
+              }
+              if (deadlineAt !== null && now() > deadline) break;
+              return { ...partial,
+                receiptRecovery: { requestId: timeout.requestId, recovered: true, initialError: timeout.error } };
+            }
+            if (state !== 'running') {
+              recoveryError = 'The original writeback receipt is no longer available.';
+              break;
+            }
+          }
+        }
+        if (now() >= deadline) break;
+        await delay(Math.min(deps.receiptPollMs || 500, Math.max(1, deadline - now())));
+      }
+      return { ...timeout, ...partial, ok: false, code: timeout.code, error: timeout.error,
+        requestId: timeout.requestId, receiptUnconfirmed: true, receiptState: state, recoveryError };
+    }
+
     async function applyBinaryOperation(operation, input) {
       const transferId = `asset_${Date.now().toString(36)}_${Math.random().toString(36).slice(2, 10)}`;
       const assetRef = operation.assetRef || null;
       const safeOperation = sanitizeOperation(operation);
-      let pageBegun = false;
+      let pageBegun = false, commitAttempted = false;
       try {
         const begin = await callPageBridge('binaryUploadBegin', {
           transferId,
@@ -66,6 +156,7 @@
         } else {
           throw codedError('binary_asset_payload_missing', 'Binary asset payload is unavailable.');
         }
+        commitAttempted = true;
         const committed = await callPageBridge('binaryUploadCommit', {
           transferId,
           runProjectId: input.runProjectId || ''
@@ -73,12 +164,37 @@
         if (!committed?.ok) throw responseError(committed, committed?.code || 'binary_upload_failed');
         return { ok: true, applied: [{ operation: safeOperation, result: committed }], skipped: [] };
       } catch (error) {
-        if (pageBegun) {
+        let changedDocument = error?.changedDocument === true
+          || (commitAttempted && error?.changedDocument !== false);
+        if (commitAttempted && changedDocument) {
+          const deadline = now() + 30000;
+          do {
+            const receipt = await callPageBridge('binaryUploadStatus', {
+              transferId, runProjectId: input.runProjectId || ''
+            }).catch(() => null);
+            if (!receipt?.ok || receipt.transferId !== transferId
+              || receipt.runProjectId !== input.runProjectId) break;
+            if (receipt.result?.ok === true) {
+              return { ok: true, applied: [{ operation: safeOperation, result: receipt.result }], skipped: [],
+                receiptRecovery: { transferId, recovered: true, initialError: error.message } };
+            }
+            if (receipt.state === 'completed' && receipt.changedDocument === false) {
+              changedDocument = false;
+              break;
+            }
+            if (now() >= deadline) break;
+            await delay(Math.min(500, Math.max(1, deadline - now())));
+          } while (now() <= deadline);
+        }
+        if (pageBegun && !commitAttempted) {
           await callPageBridge('binaryUploadAbort', { transferId, runProjectId: input.runProjectId || '' }).catch(() => null);
         }
         const code = error.code || 'binary_upload_failed';
         return {
           ok: false,
+          receiptUnconfirmed: changedDocument,
+          error: error.message || 'Binary asset upload failed.',
+          code,
           applied: [],
           skipped: [{
             operation: safeOperation,
@@ -87,8 +203,8 @@
               ok: false,
               code,
               reason: error.message || 'Binary asset upload failed.',
-              changedDocument: false,
-              failure: { code, stage: 'write', file: operation.path, changedDocument: false }
+              changedDocument,
+              failure: { code, stage: 'write', file: operation.path, changedDocument }
             }
           }]
         };
@@ -129,6 +245,42 @@
     return { applyOperations };
   }
 
+  function normalizeTextResult(response, operations) {
+    const result = response && typeof response === 'object' ? { ...response } : { ok: false };
+    result.applied = Array.isArray(result.applied) ? result.applied : [];
+    result.skipped = Array.isArray(result.skipped) ? result.skipped.slice() : [];
+    const key = operation => [operation?.type, operation?.path, operation?.to || ''].join('\0');
+    const known = new Map();
+    for (const entry of [...result.applied, ...result.skipped]) {
+      const id = key(entry.operation); known.set(id, (known.get(id) || 0) + 1);
+    }
+    const missing = [];
+    for (const operation of operations) {
+      const id = key(operation), count = known.get(id) || 0;
+      if (count) known.set(id, count - 1); else missing.push(operation);
+    }
+    if (!missing.length && (result.ok !== false || result.skipped.length)) return result;
+    const code = result.code || 'writeback_result_unconfirmed';
+    const error = typeof result.error === 'string' ? result.error
+      : result.error?.message || 'The page did not return a complete writeback result.';
+    const changedDocument = result.changedDocument !== false;
+    for (const operation of missing.length ? missing : [null]) {
+      const reason = changedDocument
+        ? 'Write status is unconfirmed; Overleaf may already contain changes. Check the project before retrying. ' + error
+        : error;
+      result.skipped.push({ operation, path: operation?.path || '', result: {
+        ok: false, code, reason, changedDocument, failure: {
+          code, stage: 'write', severity: 'warning', terminalState: 'needs_review', retryable: false,
+          file: operation?.path || '', userMessage: reason,
+          nextAction: 'Check the current Overleaf files and original writeback result before starting another write.',
+          changedDocument, evidence: { requestId: result.requestId || '', receiptState: result.receiptState || '',
+            transportError: error, recoveryError: result.recoveryError || '' }
+        }
+      } });
+    }
+    return { ...result, ok: false, code, error, receiptUnconfirmed: true };
+  }
+
   function mergeApplyResults(results) {
     const merged = { ok: true, applied: [], skipped: [], trackedChanges: [] };
     for (const result of results) {
@@ -139,8 +291,18 @@
       // recordUndoFromApply classify a successful Track write as legacy Undo,
       // which hides Accept and prevents the lifecycle from surviving reload.
       merged.trackedChanges.push(...(Array.isArray(result?.trackedChanges) ? result.trackedChanges : []));
+      if (result?.reviewingPolicy !== undefined) merged.reviewingPolicy = result.reviewingPolicy;
       if (result?.trackedChangeCaptures?.length) (merged.trackedChangeCaptures ||= []).push(...result.trackedChangeCaptures);
-      if (result?.ok !== true) merged.ok = false;
+      if (result?.ok !== true) {
+        merged.ok = false;
+        for (const key of ['code', 'error', 'failure', 'requestId', 'receiptState', 'recoveryError']) {
+          if (result?.[key] !== undefined && merged[key] === undefined) merged[key] = result[key];
+        }
+        if (result?.receiptUnconfirmed !== undefined) {
+          merged.receiptUnconfirmed = merged.receiptUnconfirmed === true || result.receiptUnconfirmed === true;
+        }
+      }
+      if (result?.receiptRecovery) (merged.receiptRecoveries ||= []).push(result.receiptRecovery);
     }
     if (merged.trackedChangeCaptures?.some(capture => capture.state !== 'observed')) merged.trackedChanges = [];
     if (merged.skipped.length) merged.ok = false;
@@ -160,11 +322,23 @@
     return safe;
   }
 
+  function isTransientReceiptFailure(value) {
+    const code = value?.code || value?.error?.code;
+    if (code) return ['page_bridge_timeout', 'page_bridge_unavailable', 'page_bridge_transport_error',
+      'page_bridge_disconnected', 'network_error', 'ETIMEDOUT', 'ECONNRESET', 'ECONNABORTED',
+      'EPIPE', 'ERR_NETWORK'].includes(code);
+    const message = value?.message || value?.error?.message || value?.error || '';
+    return /timed?\s*out|timeout|network|transport|bridge unavailable|port.*closed|receiving end|socket hang up/i.test(String(message));
+  }
+
   function responseError(response, fallbackCode) {
-    return codedError(
+    const error = codedError(
       response?.code || response?.error?.code || fallbackCode,
       response?.reason || response?.error?.message || response?.error || 'Asset transfer failed.'
     );
+    if (typeof response?.changedDocument === 'boolean') error.changedDocument = response.changedDocument;
+    error.stage = response?.failure?.stage || 'write';
+    return error;
   }
   function codedError(code, message) { const error = new Error(String(message || code)); error.code = code; return error; }
   return { create, mergeApplyResults };

package/extension/src/content/changeHistoryView.js

@@ -0,0 +1,175 @@
+(function initChangeHistoryView(root, factory) {
+  root.CodexOverleafModuleRegistry.define('ChangeHistoryView', ['ChangeHistoryModel'], factory);
+})(typeof globalThis !== 'undefined' ? globalThis : window, function changeHistoryViewFactory(Model) {
+  'use strict';
+  function create(deps) {
+    const { tx, StorageDb, getState, getCurrentProjectId, getAccountScopeId,
+      getSettingsPanelInstance, onHistoryRowJump, sanitizeText } = deps;
+    let generation = 0, owner = null, records = [], storedSessions = [], limit = 8, loading = false, error = '';
+    const container = () => getSettingsPanelInstance()?.container;
+    const make = (tag, className, text) => {
+      const element = document.createElement(tag); element.className = className;
+      if (text !== undefined) element.textContent = text;
+      return element;
+    };
+    function icon(kind) {
+      const node = make('span', 'codex-history-icon');
+      node.setAttribute('aria-hidden', 'true');
+      const paths = {
+        file: '<path d="M9 2H4v12h8V5L9 2Z M9 2v4h3 M6 9h4 M6 11h3"/>',
+        message: '<path d="M3 3h10v8H7l-4 3V3Z M5 6h6 M5 8h4"/>',
+        arrow: '<path d="M4 12 12 4 M5 4h7v7"/>'
+      };
+      node.innerHTML = '<svg viewBox="0 0 16 16" width="16" height="16" fill="none" stroke="currentColor" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round">' + paths[kind] + '</svg>';
+      return node;
+    }
+    function label(state) {
+      return ({
+        pending: tx('Pending review', '待接受'), accepted: tx('Accepted', '已接受'),
+        undone: tx('Undone', '已撤销'), attention: tx('Needs attention', '需检查'),
+        written: tx('Written', '已写入'), running: tx('In progress', '进行中'),
+        unchanged: tx('No file changes', '未修改文件'), unknown: tx('Status unavailable', '状态不可用')
+      })[state] || '';
+    }
+    function title(row) {
+      if (row.summary) return row.summary;
+      if (!row.hasWrites) return tx('Task without file changes', '未修改文件的任务');
+      if (row.status === 'attention') return row.paths.length === 1
+        ? tx('Check changes to ', '检查文件修改：') + row.paths[0] : tx('File changes need attention', '文件修改需要检查');
+      if (row.paths.length === 1) {
+        const verbs = { create: ['Created ', '新建 '], 'binary-create': ['Created ', '新建 '],
+          delete: ['Deleted ', '删除 '], move: ['Moved ', '移动 '], rename: ['Renamed ', '重命名 '] };
+        const verb = verbs[row.operation] || ['Updated ', '修改 '];
+        return tx(verb[0], verb[1]) + row.paths[0];
+      }
+      return row.paths.length ? tx('Changed ' + row.paths.length + ' files', '修改 ' + row.paths.length + ' 个文件')
+        : tx('Project file changes', '项目文件修改');
+    }
+    function when(value) {
+      const date = new Date(value);
+      if (!Number.isFinite(date.getTime())) return tx('Time unavailable', '时间不可用');
+      const locale = getState()?.locale === 'zh' ? 'zh-CN' : 'en';
+      const now = new Date(), yesterday = new Date(now); yesterday.setDate(now.getDate() - 1);
+      const day = date.toDateString() === now.toDateString() ? tx('Today', '今天')
+        : date.toDateString() === yesterday.toDateString() ? tx('Yesterday', '昨天')
+          : date.toLocaleDateString(locale, { month: 'short', day: 'numeric', ...(date.getFullYear() !== now.getFullYear() ? { year: 'numeric' } : {}) });
+      return day + ' ' + date.toLocaleTimeString(locale, { hour: '2-digit', minute: '2-digit', hour12: false });
+    }
+    function current(snapshot) {
+      return snapshot && snapshot.projectId === getCurrentProjectId()
+        && snapshot.accountScopeId === getAccountScopeId?.() && snapshot.container === container();
+    }
+    function message(list, content, retry = false) {
+      const empty = make('div', 'codex-history-empty', content);
+      if (retry) {
+        const button = make('button', 'codex-history-jump', tx('Try again', '重试'));
+        button.type = 'button'; button.addEventListener('click', load); empty.append(button);
+      }
+      list.replaceChildren(empty);
+    }
+    function render() {
+      const host = container(), list = host?.querySelector('[data-history-list]');
+      if (!list) return;
+      const search = host.querySelector('[data-history-filter]');
+      search.placeholder = tx('Search files or summaries', '搜索文件或修改摘要');
+      search.setAttribute('aria-label', search.placeholder);
+      const count = host.querySelector('[data-history-count]');
+      const toggle = host.querySelector('[data-history-include-empty]');
+      const includeLabel = host.querySelector('[data-history-include-label]');
+      const more = host.querySelector('[data-history-more]');
+      if (count) count.textContent = '';
+      if (more) more.hidden = true;
+      if (loading || error || !current(owner)) {
+        if (toggle?.parentElement) toggle.parentElement.hidden = true;
+        message(list, loading ? tx('Loading file changes…', '正在读取文件修改记录…')
+          : error || tx('Open this project again to load its history.', '重新打开本项目以读取历史记录。'), Boolean(error));
+        return;
+      }
+      const state = getState();
+      const projected = Model.project(records, {
+        projectId: owner.projectId, accountScopeId: owner.accountScopeId,
+        storedSessions, sessions: state.sessions, activeSessionId: state.activeSessionId, activeRuns: state.runs,
+        sanitizeText
+      });
+      const query = search.value.trim().toLowerCase();
+      const selected = host.querySelector('[data-history-status]')?.value || 'all';
+      const rows = projected.filter(row => (toggle?.checked || row.hasWrites)
+        && (selected === 'all' || row.status === selected)
+        && (!query || [title(row), ...row.paths].join(' ').toLowerCase().includes(query)));
+      if (count) count.textContent = tx(rows.length + ' records', rows.length + ' 条');
+      const noWrites = projected.filter(row => !row.hasWrites).length;
+      if (toggle?.parentElement) toggle.parentElement.hidden = noWrites === 0;
+      if (includeLabel) includeLabel.textContent = tx('Include ' + noWrites + ' tasks without file changes', '同时显示 ' + noWrites + ' 条未修改文件的任务');
+      list.replaceChildren();
+      if (!rows.length) {
+        message(list, query || selected !== 'all'
+          ? tx('No matching file changes. Try another file name or status.', '没有匹配的修改记录，可尝试其他文件名或状态。')
+          : tx('No file changes recorded for this project yet.', '本项目还没有已记录的文件修改。'));
+      }
+      for (const row of rows.slice(0, limit)) {
+        const element = make('article', 'codex-history-row');
+        element.dataset.resultStatus = row.status;
+        const mark = make('span', 'codex-history-mark'); mark.append(icon(row.hasWrites ? 'file' : 'message'));
+        const body = make('div', 'codex-history-copy'), top = make('div', 'codex-history-top');
+        const name = make('div', 'codex-history-task', title(row));
+        const status = make('span', 'codex-history-status', label(row.status)); status.dataset.state = row.status;
+        top.append(name, status);
+        const files = make('div', 'codex-history-files', row.paths.length ? row.paths.join(' · ')
+          : row.hasWrites ? tx('Detailed file names are no longer available.', '详细文件名已不可用。')
+            : tx('No files were written to Overleaf.', '没有向 Overleaf 写入文件。'));
+        const footer = make('div', 'codex-history-bottom');
+        const fileCount = row.paths.length ? tx(' · ' + row.paths.length + ' file(s)', ' · ' + row.paths.length + ' 个文件') : '';
+        footer.append(make('time', 'codex-history-when', when(row.createdAt) + fileCount));
+        const jump = make('button', 'codex-history-jump');
+        jump.type = 'button'; jump.disabled = !row.canJump;
+        jump.append(make('span', '', row.canJump ? tx('View conversation', '查看对应对话') : tx('Conversation unavailable', '对话不可用')));
+        if (row.canJump) jump.append(icon('arrow'));
+        jump.title = row.canJump ? tx('Open the original run', '定位到对应轮次')
+          : tx('The original run is no longer in the loaded conversation history.', '原轮次已不在当前可用的对话历史中。');
+        jump.setAttribute('aria-label', jump.textContent + ': ' + title(row));
+        const snapshot = owner;
+        jump.addEventListener('click', () => {
+          if (current(snapshot)) void onHistoryRowJump?.(row);
+        });
+        footer.append(jump); body.append(top, files, footer); element.append(mark, body); list.append(element);
+      }
+      if (more) {
+        more.hidden = rows.length <= limit;
+        more.textContent = tx('Show more (' + Math.min(8, rows.length - limit) + ')', '再显示 ' + Math.min(8, rows.length - limit) + ' 条');
+        more.onclick = () => { limit += 8; render(); };
+      }
+    }
+    async function load() {
+      const host = container();
+      if (!host?.querySelector('[data-history-list]')) return;
+      const requestId = ++generation;
+      owner = { projectId: getCurrentProjectId(), accountScopeId: getAccountScopeId?.() || '', container: host };
+      const snapshot = owner;
+      records = []; storedSessions = []; limit = 8; error = '';
+      if (!snapshot.accountScopeId || !snapshot.projectId) {
+        loading = false; error = tx('Project identity is unavailable. Reopen the project to load its history.', '暂时无法确认项目身份，请重新打开项目后查看历史。'); render(); return;
+      }
+      loading = true; render();
+      let timer;
+      try {
+        const data = await Promise.race([
+          Promise.all([
+            StorageDb.getAllByIndex('auditLogs', 'projectId', snapshot.projectId),
+            StorageDb.getAllByIndex('sessions', 'projectId', snapshot.projectId)
+          ]),
+          new Promise((_, reject) => { timer = setTimeout(() => reject(new Error('history_load_timeout')), 3000); })
+        ]);
+        if (requestId !== generation || !current(snapshot)) return;
+        [records, storedSessions] = data;
+        loading = false; render();
+      } catch (_) {
+        if (requestId !== generation || !current(snapshot)) return;
+        loading = false; error = tx('File changes could not be loaded.', '暂时无法读取文件修改记录。'); render();
+      } finally { clearTimeout(timer); }
+    }
+    return { load, filter() { limit = 8; render(); }, invalidate() {
+      generation += 1; records = []; storedSessions = []; owner = null; loading = false; error = '';
+    } };
+  }
+  return { create };
+});

package/extension/src/content/composerAttachments.js

@@ -361,54 +361,56 @@
   }
 
   function renderAttachmentPreviewList(attachments = [], container, options = {}) {
-    if (!container) {
-      return;
-    }
+    if (!container) return;
     container.replaceChildren();
     const items = Array.isArray(attachments) ? attachments : [];
     container.hidden = items.length === 0;
     for (const attachment of items) {
       const isImage = attachment.kind === 'image' && attachment.previewDataUrl;
-      const card = document.createElement(isImage ? 'button' : 'div');
+      const label = attachment.name || (options.tx ? options.tx('Attachment', '附件') : 'Attachment');
+      const card = document.createElement('div');
       card.className = 'codex-attachment-preview-card';
       card.dataset.kind = isImage ? 'image' : 'file';
+      card.title = label + ' · ' + formatFileSize(attachment.size);
       if (isImage) {
-        card.type = 'button';
-        card.title = options.tx
-          ? options.tx(`Open ${attachment.name}`, `打开 ${attachment.name}`)
-          : `Open ${attachment.name}`;
-        card.addEventListener('click', () => showAttachmentPreviewDialog(attachment, options));
+        const preview = document.createElement('button');
+        preview.type = 'button';
+        preview.className = 'codex-attachment-preview-open';
+        preview.setAttribute('aria-label', options.tx ? options.tx('Preview ' + label, '预览 ' + label) : 'Preview ' + label);
+        preview.addEventListener('click', () => showAttachmentPreviewDialog(attachment, options));
         const image = document.createElement('img');
         image.src = attachment.previewDataUrl;
-        image.alt = attachment.name || (options.tx ? options.tx('Attached image', '已附加图片') : 'Attached image');
-        card.append(image);
+        image.alt = label;
+        preview.append(image);
+        card.append(preview);
       } else {
         const icon = document.createElement('span');
         icon.className = 'codex-attachment-file-icon';
         icon.textContent = getAttachmentIconLabel(attachment);
+        icon.setAttribute('aria-hidden', 'true');
         card.append(icon);
       }
-
       const meta = document.createElement('span');
       meta.className = 'codex-attachment-preview-meta';
       const name = document.createElement('span');
       name.className = 'codex-attachment-preview-name';
-      name.textContent = attachment.name || (options.tx ? options.tx('Attachment', '附件') : 'Attachment');
-      const size = document.createElement('span');
-      size.className = 'codex-attachment-preview-size';
-      size.textContent = formatFileSize(attachment.size);
-      meta.append(name, size);
+      name.textContent = label;
+      meta.append(name);
+      if (!isImage) {
+        const size = document.createElement('span');
+        size.className = 'codex-attachment-preview-size';
+        size.textContent = formatFileSize(attachment.size);
+        meta.append(size);
+      }
       card.append(meta);
-
       if (options.removable) {
         const remove = document.createElement('button');
         remove.type = 'button';
         remove.className = 'codex-attachment-preview-remove';
         remove.textContent = '×';
-        remove.title = options.tx ? options.tx('Remove attachment', '移除附件') : 'Remove attachment';
-        remove.setAttribute('aria-label', options.tx
-          ? options.tx(`Remove ${attachment.name}`, `移除 ${attachment.name}`)
-          : `Remove ${attachment.name}`);
+        const removeLabel = options.tx ? options.tx('Remove ' + label, '移除 ' + label) : 'Remove ' + label;
+        remove.title = removeLabel;
+        remove.setAttribute('aria-label', removeLabel);
         remove.addEventListener('click', event => {
           event.preventDefault();
           event.stopPropagation();

package/extension/src/content/composerPanel.js

@@ -18,6 +18,7 @@
       <div class="codex-pending-inputs" data-pending-inputs hidden></div>
       <form class="codex-composer" data-composer-form>
         <div class="codex-attachment-strip codex-attachment-preview-list" data-attachment-strip hidden></div>
+        <div class="codex-composer-selection" data-composer-selection hidden></div>
         <div class="codex-composer-skill-context" data-composer-skill-context hidden>
           <span class="codex-composer-skill-icon" aria-hidden="true">◇</span>
           <span data-composer-skill-label></span>
@@ -35,17 +36,31 @@
             <option value="ask">Ask</option>
             <option value="auto">Auto</option>
           </select>
+          <div class="codex-write-preferences">
+            <label class="codex-review-toggle" title="When enabled, Codex checks or switches Overleaf Reviewing/Track Changes before writing. Deletes still require confirmation.">
+              <input type="checkbox" data-require-reviewing>
+              <svg class="codex-composer-option-icon" viewBox="0 0 24 24" aria-hidden="true" focusable="false">
+                <path d="m9 11 8-8 4 4-8 8M9 11l4 4-3 3H6v-4l3-3ZM3 21h7"></path>
+              </svg>
+              <span class="codex-review-label" data-i18n="requireReviewing">Track</span>
+              <svg class="codex-composer-option-check" viewBox="0 0 16 16" aria-hidden="true" focusable="false">
+                <path d="m3.5 8 3 3 6-6"></path>
+              </svg>
+            </label>
+            <label class="codex-recompile-toggle" title="Automatically recompile in Overleaf after Codex writes and record the result. Toggling this setting does not compile immediately. Ask mode does not trigger compilation.">
+              <input type="checkbox" data-auto-recompile>
+              <svg class="codex-composer-option-icon" viewBox="0 0 24 24" aria-hidden="true" focusable="false">
+                <path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8ZM14 2v6h6m-11 7 2 2 4-4"></path>
+              </svg>
+              <span class="codex-recompile-label" data-i18n="autoCompile">Auto compile</span>
+              <svg class="codex-composer-option-check" viewBox="0 0 16 16" aria-hidden="true" focusable="false">
+                <path d="m3.5 8 3 3 6-6"></path>
+              </svg>
+            </label>
+          </div>
         </div>
         <div class="codex-composer-toolbar">
           <button type="button" data-add-context title="Add @ context" aria-label="Add @ context" aria-expanded="false">＋</button>
-          <label class="codex-review-toggle" title="When enabled, Codex checks or switches Overleaf Reviewing/Track Changes before writing. Deletes still require confirmation.">
-            <input type="checkbox" data-require-reviewing>
-            <span class="codex-review-label" data-i18n="requireReviewing">Track</span>
-          </label>
-          <label class="codex-recompile-toggle" title="After Codex writes, click Overleaf Recompile and record the compile result for this task. Ask mode will not trigger it.">
-            <input type="checkbox" data-auto-recompile>
-            <span class="codex-recompile-label" data-i18n="autoCompile">Compile</span>
-          </label>
           <div class="codex-model-config" data-model-config>
             <button type="button" class="codex-model-config-button" data-model-config-toggle aria-haspopup="menu" aria-expanded="false">
               <span class="codex-model-speed-indicator" data-speed-indicator hidden aria-hidden="true">