codex-overleaf-link 2.4.1 → 2.5.0

package/extension/src/content/diagnosticsController.js

@@ -86,8 +86,7 @@
       title: tr('diagnosticsHealthTitle'),
       subtitle: tr(overallSubtitleKey),
       status: worst === 'ok' ? 'completed' : worst === 'fail' ? 'failed' : 'warning',
-      checks,
-      technical: checks.map(check => `${check.title}: ${check.status}`).join('\n')
+      checks
     });
     setDiagnosticsHealth(worst);
   }

package/extension/src/content/diagnosticsExport.js

@@ -0,0 +1,222 @@
+(function (root, factory) {
+  if (typeof module === 'object' && module.exports) module.exports = factory();
+  else root.CodexOverleafModuleRegistry.define('DiagnosticsExport', [], factory);
+})(typeof globalThis !== 'undefined' ? globalThis : this, function () {
+  'use strict';
+
+  function create(deps = {}) {
+    const { root, window, document, Blob, URL, TextEncoder, AuditRecords, StorageDb, CodexOverleafCompatibility, getState, getCurrentRunView, getCurrentProjectId, findRunRecord, getMirrorFreshness, getExtensionCompatibilityMetadata, getModelDiscovery, getGovernanceRulesForCurrentProject, sendBackgroundNative, fallbackNativeCompatibility, isNativeCompatibilityCompatible, getNativeCompatibilityClassification, callPageBridge, showPluginToast, tr, RUN_SNAPSHOT_ZIP_TIMEOUT_MS } = deps;
+
+  function exposeSmokeHelper() {
+    const helper = Object.freeze({
+      probeNative: smokeProbeNative,
+      probeProject: smokeProbeProject,
+      getProjectSnapshotMetrics: smokeProbeProject
+    });
+    try {
+      Object.defineProperty(root, 'CodexOverleafSmoke', {
+        configurable: true,
+        enumerable: false,
+        value: helper
+      });
+    } catch (_error) {
+      root.CodexOverleafSmoke = helper;
+    }
+  }
+
+  async function smokeProbeNative() {
+    try {
+      const params = CodexOverleafCompatibility?.buildBridgePingParams
+        ? CodexOverleafCompatibility.buildBridgePingParams(getExtensionCompatibilityMetadata())
+        : {};
+      const response = await sendBackgroundNative({ method: 'bridge.ping', params });
+      const compatibility = CodexOverleafCompatibility?.evaluateNativeCompatibility
+        ? CodexOverleafCompatibility.evaluateNativeCompatibility(response, getExtensionCompatibilityMetadata())
+        : fallbackNativeCompatibility(response);
+      return {
+        supported: true,
+        ok: response?.ok === true && isNativeCompatibilityCompatible(compatibility),
+        status: compatibility?.status || (response?.ok ? 'ok' : 'native_missing'),
+        classification: getNativeCompatibilityClassification(compatibility),
+        errorCode: response?.error?.code || compatibility?.status || '',
+        nativeCompatibility: summarizeSmokeNativeCompatibility(compatibility, response)
+      };
+    } catch (_error) {
+      return {
+        supported: true,
+        ok: false,
+        status: 'native_probe_failed',
+        errorCode: 'native_probe_failed'
+      };
+    }
+  }
+
+  async function smokeProbeProject(options = {}) {
+    try {
+      const project = await callPageBridge('getProjectSnapshot', {
+        force: Boolean(options.force),
+        preferLightweight: true,
+        allowZipFallback: true,
+        allowEditorNavigation: false,
+        requireFullProject: false,
+        includeBinaryFiles: true,
+        includeContent: false,
+        zipTimeoutMs: RUN_SNAPSHOT_ZIP_TIMEOUT_MS
+      });
+      const files = Array.isArray(project?.files) ? project.files : [];
+      const skipped = Array.isArray(project?.capabilities?.skipped) ? project.capabilities.skipped : [];
+      const bytes = summarizeSmokeProjectBytes(files);
+      const ok = project?.ok !== false && files.length > 0;
+      return {
+        supported: true,
+        ok,
+        status: ok ? 'ok' : 'project_snapshot_unavailable',
+        errorCode: ok ? '' : project?.code || 'project_snapshot_unavailable',
+        counts: {
+          files: files.length,
+          skipped: skipped.length
+        },
+        bytes,
+        method: project?.capabilities?.method || ''
+      };
+    } catch (_error) {
+      return {
+        supported: true,
+        ok: false,
+        status: 'project_probe_failed',
+        errorCode: 'project_probe_failed',
+        counts: {
+          files: 0,
+          skipped: 0
+        },
+        bytes: {
+          text: 0,
+          binary: 0
+        }
+      };
+    }
+  }
+
+  function summarizeSmokeNativeCompatibility(compatibility = {}, response = {}) {
+    const native = compatibility?.native || response?.result || {};
+    return {
+      status: compatibility?.status || (response?.ok ? 'ok' : 'native_missing'),
+      classification: getNativeCompatibilityClassification(compatibility),
+      nativeVersion: compatibility?.nativeVersion || native.version || '',
+      version: compatibility?.version || native.version || '',
+      minimumNativeVersion: compatibility?.minimumNativeVersion || compatibility?.minNativeVersion || '',
+      protocolVersion: compatibility?.protocolVersion || native.protocolVersion || '',
+      supportedProtocol: compatibility?.supportedProtocol || native.supportedProtocol || ''
+    };
+  }
+
+  function summarizeSmokeProjectBytes(files = []) {
+    return files.reduce((bytes, file) => {
+      let size = Number(file?.size || file?.byteLength || 0);
+      if ((!Number.isFinite(size) || size <= 0) && typeof file?.content === 'string') {
+        size = new TextEncoder().encode(file.content).byteLength;
+      }
+      if (!Number.isFinite(size) || size <= 0) {
+        return bytes;
+      }
+      if (file?.kind === 'binary') {
+        bytes.binary += size;
+      } else {
+        bytes.text += size;
+      }
+      return bytes;
+    }, {
+      text: 0,
+      binary: 0
+    });
+  }
+
+  async function exportDiagnosticsBundle() {
+    if (!AuditRecords?.buildDiagnosticBundle) {
+      throw new Error('Audit diagnostics helper is unavailable');
+    }
+    const projectId = getCurrentProjectId();
+    const currentRunView = getCurrentRunView();
+    const activeRecord = currentRunView && findRunRecord(currentRunView.recordId, currentRunView.sessionId);
+    const recentRuns = (getState().runs || []).filter(run => run && (!run.runProjectId || run.runProjectId === projectId))
+      .slice().reverse().sort((a, b) => (Date.parse(b.startedAt) || 0) - (Date.parse(a.startedAt) || 0)).slice(0, 8);
+    const [auditLogs, mirror, nativeDiagnostics] = await Promise.all([
+      getRecentAuditLogsForCurrentProject(),
+      getMirrorFreshness().catch(error => ({ status: 'unavailable', errorCode: error.message })),
+      getNativeDiagnosticsSummaryForBundle()
+    ]);
+    if (getCurrentProjectId() !== projectId) throw new Error('Project changed during diagnostics export; export again.');
+    const bundle = AuditRecords.buildDiagnosticBundle({
+      excludeContent: true,
+      compatibility: {
+        extension: getExtensionCompatibilityMetadata(),
+        modelDiscovery: getModelDiscovery()
+      },
+      platform: nativeDiagnostics.platform,
+      nativeEnvironment: nativeDiagnostics.nativeEnvironment,
+      mirror,
+      auditLogs,
+      run: activeRecord?.runProjectId === projectId ? activeRecord : recentRuns[0] || {},
+      recentRuns,
+      governance: getGovernanceRulesForCurrentProject(),
+      projectId
+    });
+    const blob = new Blob([JSON.stringify(bundle, null, 2)], { type: 'application/json' });
+    const url = URL.createObjectURL(blob);
+    const link = document.createElement('a');
+    link.href = url;
+    link.download = `codex-overleaf-diagnostics-${new Date().toISOString().replace(/[:.]/g, '-')}.json`;
+    document.body.append(link);
+    link.click();
+    link.remove();
+    window.setTimeout(() => URL.revokeObjectURL(url), 1000);
+    showPluginToast(tr('diagnosticsExportDone'), { status: 'completed' });
+  }
+
+  async function getNativeDiagnosticsSummaryForBundle() {
+    try {
+      const params = CodexOverleafCompatibility?.buildBridgePingParams
+        ? CodexOverleafCompatibility.buildBridgePingParams(getExtensionCompatibilityMetadata())
+        : {};
+      const response = await sendBackgroundNative({ method: 'bridge.ping', params });
+      if (!response?.ok) {
+        const errorCode = response?.error?.code || 'native_unavailable';
+        return {
+          platform: { status: 'unavailable', errorCode },
+          nativeEnvironment: { status: 'unavailable', errorCode }
+        };
+      }
+      return {
+        platform: {
+          host: response.result?.host || '',
+          platform: response.result?.platform || '',
+          version: response.result?.version || '',
+          protocolVersion: response.result?.protocolVersion || ''
+        },
+        nativeEnvironment: response.result?.environment || {}
+      };
+    } catch (error) {
+      const errorCode = error?.message || 'native_unavailable';
+      return {
+        platform: { status: 'unavailable', errorCode },
+        nativeEnvironment: { status: 'unavailable', errorCode }
+      };
+    }
+  }
+
+  async function getRecentAuditLogsForCurrentProject(limit = 12) {
+    if (!StorageDb?.getAllByIndex) {
+      return [];
+    }
+    const records = await StorageDb.getAllByIndex('auditLogs', 'projectId', getCurrentProjectId());
+    return (records || [])
+      .slice()
+      .sort((left, right) => String(right.createdAt || '').localeCompare(String(left.createdAt || '')))
+      .slice(0, limit);
+  }
+
+    return { exposeSmokeHelper, exportDiagnosticsBundle, smokeProbeNative, smokeProbeProject, summarizeSmokeProjectBytes };
+  }
+
+  return { create };
+});

package/extension/src/content/diagnosticsPanel.js

@@ -11,6 +11,7 @@
       callbacks: options.callbacks || {},
       i18n: options.i18n || {},
       dismissInstalled: false,
+      resultDismissed: false,
       cleanup: []
     };
 
@@ -47,19 +48,21 @@
             <small data-i18n="diagnosticsExportSubtitle">Redacted audit and environment bundle</small>
           </button>
         </div>
-        <section class="codex-diagnostics-result" data-diagnostics-result hidden>
+        <section class="codex-diagnostics-result" data-diagnostics-result role="region" aria-label="Diagnostics" hidden>
           <div class="codex-diagnostics-result-head">
             <div>
               <div class="codex-diagnostics-result-title" data-diagnostics-result-title></div>
               <div class="codex-diagnostics-result-subtitle" data-diagnostics-result-subtitle></div>
             </div>
-            <button type="button" data-diagnostics-result-close title="Close" aria-label="Close diagnostics result">×</button>
+            <button type="button" data-diagnostics-result-close title="Close" aria-label="Close diagnostics result"><span class="codex-icon" aria-hidden="true"><svg width="14" height="14" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"><path d="m4 4 8 8M12 4l-8 8"/></svg></span></button>
+          </div>
+          <div class="codex-diagnostics-result-scroll">
+            <div class="codex-diagnostics-result-body" data-diagnostics-result-body></div>
+            <details class="codex-diagnostics-technical" data-diagnostics-result-details>
+              <summary data-i18n="technicalDetails">Technical Details</summary>
+              <pre data-diagnostics-result-technical></pre>
+            </details>
           </div>
-          <div class="codex-diagnostics-result-body" data-diagnostics-result-body></div>
-          <details class="codex-diagnostics-technical" data-diagnostics-result-details>
-            <summary data-i18n="technicalDetails">Technical Details</summary>
-            <pre data-diagnostics-result-technical></pre>
-          </details>
         </section>
       </div>
     `;
@@ -85,7 +88,10 @@
     root.querySelector('[data-diagnostics-snapshot]')?.addEventListener('click', () => instance.callbacks.onSnapshot?.());
     root.querySelector('[data-diagnostics-ot]')?.addEventListener('click', () => instance.callbacks.onOtDiagnostics?.());
     root.querySelector('[data-diagnostics-export]')?.addEventListener('click', () => instance.callbacks.onExport?.());
-    root.querySelector('[data-diagnostics-result-close]')?.addEventListener('click', () => closeResult(instance));
+    root.querySelector('[data-diagnostics-result-close]')?.addEventListener('click', () => {
+      closeResult(instance);
+      root.querySelector('[data-diagnostics-menu]')?.focus();
+    });
   }
 
   function toggleMenu(target, forceOpen) {
@@ -95,8 +101,14 @@
     if (!popover || !button) {
       return;
     }
+    const result = instance.container.querySelector('[data-diagnostics-result]');
+    if (forceOpen === undefined && result && !result.hidden) {
+      closeResult(instance);
+      return;
+    }
     const open = typeof forceOpen === 'boolean' ? forceOpen : popover.hidden;
     if (open) {
+      closeResult(instance);
       instance.callbacks.onBeforeOpen?.();
     }
     popover.hidden = !open;
@@ -123,6 +135,7 @@
 
   function closeResult(target) {
     const instance = target?._instance || target;
+    if (instance) instance.resultDismissed = true;
     const result = instance?.container?.querySelector('[data-diagnostics-result]');
     if (result) {
       hideFloating(result);
@@ -131,6 +144,7 @@
 
   function showLoading(target, title, subtitle) {
     const instance = target?._instance || target;
+    if (instance) instance.resultDismissed = false;
     showResult(instance, {
       title,
       subtitle: subtitle || t(instance, 'diagnosticsLoading'),
@@ -141,13 +155,16 @@
 
   function showResult(target, result = {}) {
     const instance = target?._instance || target;
+    if (instance?.resultDismissed) return;
     const root = instance?.container?.querySelector('[data-diagnostics-result]');
     if (!root) {
       return;
     }
 
+    const wasHidden = root.hidden;
     root.hidden = false;
     root.dataset.status = result.status || 'info';
+    root.setAttribute('aria-label', result.title || t(instance, 'diagnosticsResult'));
     root.querySelector('[data-diagnostics-result-title]').textContent = result.title || t(instance, 'diagnosticsResult');
     root.querySelector('[data-diagnostics-result-subtitle]').textContent = result.subtitle || '';
 
@@ -188,7 +205,8 @@
     details.hidden = !technicalText;
     technical.textContent = technicalText;
     closeMenu(instance);
-    openFloating(instance, root, 560);
+    openFloating(instance, root, 400);
+    if (wasHidden) root.querySelector('[data-diagnostics-result-close]')?.focus({ preventScroll: true });
   }
 
   // Keep DOM ownership (theme, locale and callbacks), but render above clipping
@@ -237,12 +255,20 @@
     if (!(width > 0 && height > 0)) return;
     const margin = 12;
     const gap = 8;
-    const leftEdge = (viewport?.offsetLeft || 0) + margin;
-    const topEdge = (viewport?.offsetTop || 0) + margin;
-    const rightEdge = leftEdge + Math.max(0, width - margin * 2);
-    const bottomEdge = topEdge + Math.max(0, height - margin * 2);
-    element.style.width = `${Math.min(preferredWidth, Math.max(0, width - margin * 2))}px`;
-    element.style.maxHeight = `${Math.min(640, Math.max(0, height - margin * 2))}px`;
+    const viewportLeft = viewport?.offsetLeft || 0;
+    const viewportTop = viewport?.offsetTop || 0;
+    const panel = instance.container.closest?.('#codex-overleaf-panel')?.getBoundingClientRect?.();
+    const leftEdge = Math.max(viewportLeft, panel?.left ?? viewportLeft) + margin;
+    const topEdge = Math.max(viewportTop, panel?.top ?? viewportTop) + margin;
+    const rightEdge = Math.min(viewportLeft + width, panel?.right ?? viewportLeft + width) - margin;
+    const bottomEdge = Math.min(viewportTop + height, panel?.bottom ?? viewportTop + height) - margin;
+    if (rightEdge <= leftEdge || bottomEdge <= topEdge) {
+      closeMenu(instance);
+      closeResult(instance);
+      return;
+    }
+    element.style.width = `${Math.min(preferredWidth, rightEdge - leftEdge)}px`;
+    element.style.maxHeight = `${Math.min(480, bottomEdge - topEdge)}px`;
     const anchor = button.getBoundingClientRect();
     const bounds = element.getBoundingClientRect();
     const below = Math.max(0, bottomEdge - anchor.bottom - gap);
@@ -307,9 +333,11 @@
     list.className = 'codex-diagnostics-checks';
     for (const check of checks) {
       if (!check) continue;
-      const row = document.createElement('div');
+      const row = document.createElement('details');
       row.className = 'codex-diagnostics-check';
       row.dataset.status = healthBucket(check.status);
+      row.open = row.dataset.status === 'warn' || row.dataset.status === 'fail';
+      const heading = document.createElement('summary');
 
       const glyph = document.createElement('span');
       glyph.className = 'codex-diagnostics-check-glyph';
@@ -320,7 +348,7 @@
       const title = document.createElement('div');
       title.className = 'codex-diagnostics-check-title';
       title.textContent = check.title || '';
-      textWrap.append(title);
+      heading.append(glyph, title);
       if (check.summary) {
         const summary = document.createElement('div');
         summary.className = 'codex-diagnostics-check-summary';
@@ -334,7 +362,7 @@
         textWrap.append(next);
       }
 
-      row.append(glyph, textWrap);
+      row.append(heading, textWrap);
       list.append(row);
     }
     container.append(list);
@@ -358,6 +386,7 @@
         return;
       }
       closeMenu(instance);
+      closeResult(instance);
     }, true);
     listen(doc, 'keydown', event => {
       if (event.key !== 'Escape') return;
@@ -374,7 +403,7 @@
     const reposition = () => {
       frame = null;
       positionFloating(instance, instance.container.querySelector('[data-diagnostics-popover]'), 300);
-      positionFloating(instance, instance.container.querySelector('[data-diagnostics-result]'), 560);
+      positionFloating(instance, instance.container.querySelector('[data-diagnostics-result]'), 400);
     };
     const schedule = () => {
       if (frame !== null) return;

package/extension/src/content/diffReviewPanel.js

@@ -103,13 +103,13 @@
         const acceptHunkBtn = document.createElement('button');
         acceptHunkBtn.type = 'button';
         acceptHunkBtn.setAttribute('data-diff-hunk-accept', '');
-        acceptHunkBtn.textContent = '✓';
+        acceptHunkBtn.innerHTML = '<svg class="codex-glyph" viewBox="0 0 16 16" aria-hidden="true" focusable="false"><path d="m3.5 8 3 3 6-6"/></svg>';
         acceptHunkBtn.title = tr('diffHunkAccept');
         acceptHunkBtn.setAttribute('aria-label', tr('diffHunkAccept'));
         const rejectHunkBtn = document.createElement('button');
         rejectHunkBtn.type = 'button';
         rejectHunkBtn.setAttribute('data-diff-hunk-reject', '');
-        rejectHunkBtn.textContent = '✗';
+        rejectHunkBtn.innerHTML = '<svg class="codex-glyph" viewBox="0 0 16 16" aria-hidden="true" focusable="false"><path d="m4 4 8 8M12 4l-8 8"/></svg>';
         rejectHunkBtn.title = tr('diffHunkReject');
         rejectHunkBtn.setAttribute('aria-label', tr('diffHunkReject'));
         const jumpHunkBtn = document.createElement('button');
@@ -619,13 +619,13 @@
           const acceptBtn = document.createElement('button');
           acceptBtn.type = 'button';
           acceptBtn.dataset.diffAccept = '';
-          acceptBtn.textContent = '✓';
+          acceptBtn.innerHTML = '<svg class="codex-glyph" viewBox="0 0 16 16" aria-hidden="true" focusable="false"><path d="m3.5 8 3 3 6-6"/></svg>';
           acceptBtn.title = tr('diffAccept');
           acceptBtn.setAttribute('aria-label', tr('diffAccept'));
           const rejectBtn = document.createElement('button');
           rejectBtn.type = 'button';
           rejectBtn.dataset.diffReject = '';
-          rejectBtn.textContent = '✗';
+          rejectBtn.innerHTML = '<svg class="codex-glyph" viewBox="0 0 16 16" aria-hidden="true" focusable="false"><path d="m4 4 8 8M12 4l-8 8"/></svg>';
           rejectBtn.title = tr('diffReject');
           rejectBtn.setAttribute('aria-label', tr('diffReject'));
 
@@ -775,7 +775,10 @@
         title,
         status: 'completed'
       });
-      const { container } = createDiffReviewElement(visibleChanges, { readonly: true });
+      // Written changes are a receipt, not a review: one folded row per file.
+      const container = typeof deps.renderWrittenChanges === 'function'
+        ? deps.renderWrittenChanges(visibleChanges)
+        : createDiffReviewElement(visibleChanges, { readonly: true }).container;
       events = getRunEvents() || events;
       events.append(container);
       scrollLogToBottom();