collabmd 0.1.48 → 0.1.51

package/src/client/presentation/file-history-view-controller.js

@@ -544,12 +544,14 @@ export class FileHistoryViewController {
     this.actionsDivider?.classList.add('hidden');
     this.editorActionsGroup?.classList.remove('hidden');
     this.modeButtons.forEach((button) => {
+      const active = button.getAttribute('data-diff-mode') === this.diffMode;
       button.classList.toggle('hidden', !hasSelection);
-      button.classList.toggle('active', button.getAttribute('data-diff-mode') === this.diffMode);
+      button.classList.toggle('active', active);
+      button.setAttribute?.('aria-pressed', String(active));
     });
     this.openEditorButton?.toggleAttribute('disabled', !this.currentFilePath);
     if (this.openEditorButton) {
-      this.openEditorButton.textContent = 'Open File';
+      this.openEditorButton.textContent = 'Open file';
     }
     this.primaryActionButton?.toggleAttribute('disabled', true);
     this.commitButton?.toggleAttribute('disabled', true);
@@ -562,13 +564,13 @@ export class FileHistoryViewController {
     this.page?.classList.remove('hidden');
     if (this.content) {
       this.content.classList.add('diff-content--history');
-      this.content.innerHTML = '<div class="git-panel-empty">Loading file history...</div>';
+      this.content.innerHTML = '<div class="git-panel-empty" role="status" aria-live="polite">Loading file history…</div>';
     }
     this.historyListElement = null;
     this.syncToolbar();
   }
 
-  renderEmpty(message) {
+  renderEmpty(message, { alert = false } = {}) {
     if (!this.isActive) {
       return;
     }
@@ -576,7 +578,7 @@ export class FileHistoryViewController {
     if (this.content) {
       this.content.classList.add('diff-content--history');
       // pi-lens-ignore: no-inner-html-js
-      this.content.innerHTML = `<div class="git-panel-empty">${escapeHtml(message)}</div>`;
+      this.content.innerHTML = `<div class="git-panel-empty"${alert ? ' role="alert"' : ''}>${escapeHtml(message)}</div>`;
     }
     this.historyListElement = null;
     this.syncToolbar();
@@ -691,7 +693,7 @@ export class FileHistoryViewController {
             type="button"
             data-file-history-open-selected-diff
           >
-            Open Standalone Diff
+            Open standalone diff
           </button>
           ${entry.type === 'commit' ? `
             <button
@@ -699,7 +701,7 @@ export class FileHistoryViewController {
               type="button"
               data-file-history-open-selected-preview
             >
-              Preview File
+              Preview file
             </button>
           ` : ''}
         </div>
@@ -719,7 +721,7 @@ export class FileHistoryViewController {
           <div class="diff-file-header">
             <span class="diff-file-path">${escapeHtml(entry.pathAtCommit || this.currentFilePath || '')}</span>
           </div>
-          <div class="diff-empty-state">Loading diff...</div>
+          <div class="diff-empty-state" role="status" aria-live="polite">Loading diff…</div>
         </section>
       `;
     }
@@ -728,7 +730,7 @@ export class FileHistoryViewController {
       return `
         <section class="diff-file-block file-history-diff-block">
           ${this.renderDiffFileHeader({ path: entry.pathAtCommit || this.currentFilePath || '' })}
-          <div class="diff-empty-state">${escapeHtml(selection.error)}</div>
+          <div class="diff-empty-state" role="alert">${escapeHtml(selection.error)}</div>
         </section>
       `;
     }
@@ -764,7 +766,7 @@ export class FileHistoryViewController {
 
     const hasRows = Boolean(this.localChanges) || (this.history.commits?.length ?? 0) > 0;
     if (!hasRows) {
-      this.renderEmpty(this.history.error || 'No history found for this file.');
+      this.renderEmpty(this.history.error || 'No history found for this file.', { alert: Boolean(this.history.error) });
       return;
     }
 
@@ -794,7 +796,7 @@ export class FileHistoryViewController {
                 data-file-history-load-more
                 ${this.history.loadingMore ? 'disabled' : ''}
               >
-                ${this.history.loadingMore ? 'Loading...' : 'Load More'}
+                ${this.history.loadingMore ? 'Loading…' : 'Load more'}
               </button>
             </div>
           ` : ''}

package/src/client/presentation/git-diff-view-controller.js

@@ -1,3 +1,4 @@
+import { createExcalidrawExportOptions } from '../domain/excalidraw-scene.js';
 import { escapeHtml } from '../domain/vault-utils.js';
 import { commitButtonLabel } from '../domain/git-labels.js';
 import { getVaultPathLeaf, getVaultPathParent } from '../domain/vault-paths.js';
@@ -200,29 +201,25 @@ function getDrawioSourcePair(detail = {}) {
   };
 }
 
-function decodeXmlAttribute(value) {
-  return String(value ?? '')
-    .replace(/"/gu, '"')
-    .replace(/'/gu, "'")
-    .replace(/&/gu, '&')
-    .replace(/&lt;/gu, '<')
-    .replace(/&gt;/gu, '>');
-}
-
 function getDrawioCellMap(source) {
   const cells = new Map();
-  const cellPattern = /<mxCell\b([^>]*?)(?:\/|>([\s\S]*?)<\/mxCell\s*)>/giu;
-  let match;
+  if (typeof DOMParser === 'undefined' || typeof XMLSerializer === 'undefined') {
+    return cells;
+  }
 
-  while ((match = cellPattern.exec(String(source ?? ''))) !== null) {
-    const idMatch = match[1].match(/\bid\s*=\s*(['"])(.*?)\1/iu);
-    const id = decodeXmlAttribute(idMatch?.[2] || '');
+  const documentNode = new DOMParser().parseFromString(String(source ?? ''), 'application/xml');
+  if (documentNode.querySelector('parsererror')) {
+    return cells;
+  }
+
+  const serializer = new XMLSerializer();
+  for (const cell of documentNode.getElementsByTagName('mxCell')) {
+    const id = cell.getAttribute('id');
     if (!id || id === '0' || id === '1') {
       continue;
     }
 
-    const signature = `${match[1]}${match[2] || ''}`.replace(/\s+/gu, ' ').trim();
-    cells.set(id, signature);
+    cells.set(id, serializer.serializeToString(cell).replace(/\s+/gu, ' ').trim());
   }
 
   return cells;
@@ -647,7 +644,7 @@ export class GitDiffViewController {
     this.excalidrawPreviewPayloads.clear();
     this.drawioPreviewPayloads.clear();
     this.requestScope = scope;
-    this.renderLoading('Loading diff summary...');
+    this.renderLoading('Loading diff summary…');
 
     try {
       const data = await this.gitApiClient.readDiff({
@@ -677,7 +674,7 @@ export class GitDiffViewController {
         source: 'workspace',
         summary: { additions: 0, deletions: 0, filesChanged: 0 },
       };
-      this.renderEmpty('Failed to load git diff');
+      this.renderEmpty('Failed to load git diff', { alert: true });
       return this.data;
     }
   }
@@ -700,7 +697,7 @@ export class GitDiffViewController {
     this.excalidrawPreviewPayloads.clear();
     this.drawioPreviewPayloads.clear();
     this.requestScope = 'all';
-    this.renderLoading('Loading commit summary...');
+    this.renderLoading('Loading commit summary…');
 
     try {
       const data = await this.gitApiClient.readCommit({
@@ -741,7 +738,7 @@ export class GitDiffViewController {
         summary: { additions: 0, deletions: 0, filesChanged: 0 },
       };
       this.commitMeta = null;
-      this.renderEmpty('Failed to load git commit');
+      this.renderEmpty('Failed to load git commit', { alert: true });
       return this.data;
     }
   }
@@ -790,27 +787,27 @@ export class GitDiffViewController {
     void this.loadCurrentFile();
   }
 
-  renderLoading(message = 'Loading git diff...') {
+  renderLoading(message = 'Loading git diff…') {
     if (!this.isActive) {
       return;
     }
     this.page?.classList.remove('hidden');
     if (this.content) {
       // pi-lens-ignore: ast-grep:no-inner-html-js
-      this.content.innerHTML = `<div class="diff-empty-state">${escapeHtml(message)}</div>`;
+      this.content.innerHTML = `<div class="diff-empty-state" role="status" aria-live="polite">${escapeHtml(message)}</div>`;
     }
     this.data = null;
     this.syncToolbar();
   }
 
-  renderEmpty(message) {
+  renderEmpty(message, { alert = false } = {}) {
     if (!this.isActive) {
       return;
     }
     this.page?.classList.remove('hidden');
     if (this.content) {
       // pi-lens-ignore: ast-grep:no-inner-html-js
-      this.content.innerHTML = `<div class="diff-empty-state">${escapeHtml(message)}</div>`;
+      this.content.innerHTML = `<div class="diff-empty-state"${alert ? ' role="alert"' : ''}>${escapeHtml(message)}</div>`;
     }
     this.syncToolbar();
   }
@@ -1194,16 +1191,7 @@ export class GitDiffViewController {
       }
 
       try {
-        const svg = await exportToSvg({
-          appState: {
-            exportBackground: true,
-            exportWithDarkMode: false,
-            viewBackgroundColor: scene.appState?.viewBackgroundColor || '#ffffff',
-          },
-          elements: getVisibleSceneElements(scene),
-          exportPadding: 24,
-          files: scene.files || null,
-        });
+        const svg = await exportToSvg(createExcalidrawExportOptions(scene));
         preview.replaceChildren(svg);
         preview.classList.add('is-ready');
       } catch (error) {
@@ -1345,7 +1333,7 @@ export class GitDiffViewController {
       return `
         <section class="diff-file-block">
           ${this.renderFileHeader(currentFile)}
-          <div class="diff-empty-state">Loading file diff...</div>
+          <div class="diff-empty-state" role="status" aria-live="polite">Loading file diff…</div>
         </section>
       `;
     }
@@ -1355,7 +1343,7 @@ export class GitDiffViewController {
       return `
         <section class="diff-file-block">
           ${this.renderFileHeader(currentFile)}
-          <div class="diff-empty-state">${escapeHtml(errorMessage)}</div>
+          <div class="diff-empty-state" role="alert">${escapeHtml(errorMessage)}</div>
         </section>
       `;
     }
@@ -1435,9 +1423,9 @@ export class GitDiffViewController {
     const bodyMarkup = isCollapsed
       ? ''
       : isLoading
-        ? '<div class="diff-empty-state">Loading file diff...</div>'
+        ? '<div class="diff-empty-state" role="status" aria-live="polite">Loading file diff…</div>'
         : errorMessage
-          ? `<div class="diff-empty-state">${escapeHtml(errorMessage)}</div>`
+          ? `<div class="diff-empty-state" role="alert">${escapeHtml(errorMessage)}</div>`
           : this.renderDiffDetail(detail, index, { includeHeader: false });
 
     return `
@@ -1877,11 +1865,15 @@ export class GitDiffViewController {
     }
 
     this.modeButtons.forEach((button) => {
+      const active = button.getAttribute('data-diff-mode') === this.mode;
       button.classList.remove('hidden');
-      button.classList.toggle('active', button.getAttribute('data-diff-mode') === this.mode);
+      button.classList.toggle('active', active);
+      button.setAttribute?.('aria-pressed', String(active));
     });
     this.layoutButtons.forEach((button) => {
-      button.classList.toggle('active', button.getAttribute('data-diff-layout') === this.layoutMode);
+      const active = button.getAttribute('data-diff-layout') === this.layoutMode;
+      button.classList.toggle('active', active);
+      button.setAttribute?.('aria-pressed', String(active));
     });
 
     const hasCurrentFile = Boolean(this.getCurrentFile()?.path);
@@ -1906,8 +1898,8 @@ export class GitDiffViewController {
       this.primaryActionButton.classList.toggle('ui-button--primary', emphasizeInclude);
       this.primaryActionButton.classList.toggle('ui-button--secondary', !emphasizeInclude);
       this.primaryActionButton.classList.toggle('ui-button--surface', !emphasizeInclude);
-      this.primaryActionButton.textContent = this.pendingAction === primaryAction
-        ? 'Working...'
+      this.primaryActionButton.textContent = this.pendingAction && this.pendingAction === primaryAction
+        ? 'Working…'
         : primaryAction === 'unstage'
           ? 'Remove'
           : 'Include in commit';
@@ -1918,7 +1910,7 @@ export class GitDiffViewController {
     }
     if (this.commitButton) {
       this.commitButton.textContent = this.pendingAction === 'commit'
-        ? 'Working...'
+        ? 'Working…'
         : commitButtonLabel(includedFileCount);
     }
     this.commitButton?.classList.toggle(

package/src/client/presentation/git-panel-controller.js

@@ -94,7 +94,9 @@ export class GitPanelController {
     onResetFile = () => {},
     onSelectCommit = () => {},
     onSelectDiff = () => {},
+    onStageAll = () => {},
     onStageFile = () => {},
+    onUnstageAll = () => {},
     onUnstageFile = () => {},
     onViewAllDiff = () => {},
     searchInput = null,
@@ -110,7 +112,9 @@ export class GitPanelController {
     this.onResetFile = onResetFile;
     this.onSelectCommit = onSelectCommit;
     this.onSelectDiff = onSelectDiff;
+    this.onStageAll = onStageAll;
     this.onStageFile = onStageFile;
+    this.onUnstageAll = onUnstageAll;
     this.onUnstageFile = onUnstageFile;
     this.onViewAllDiff = onViewAllDiff;
     this.searchInput = searchInput;
@@ -118,6 +122,7 @@ export class GitPanelController {
     this.panel = document.getElementById('gitPanel');
     this.pullBackups = [];
     this.status = null;
+    this.statusError = '';
     this.active = false;
     this.refreshTimer = null;
     this.searchQuery = '';
@@ -236,6 +241,17 @@ export class GitPanelController {
 
     if (this._handleFileActionClick(event)) return;
 
+    const bulkActionButton = event.target instanceof Element
+      ? event.target.closest('[data-git-bulk-action]')
+      : null;
+    if (bulkActionButton) {
+      const action = bulkActionButton.getAttribute('data-git-bulk-action');
+      if (action === 'stage-all' || action === 'unstage-all') {
+        void this.handleBulkAction(action);
+      }
+      return;
+    }
+
     if (event.target instanceof Element && event.target.closest('[data-git-view-all]')) {
       this.onViewAllDiff();
       return;
@@ -280,8 +296,8 @@ export class GitPanelController {
       this.stopStatusPolling();
       return;
     }
-
     this.syncSearchUi();
+    void import('../styles/deferred-git.css');
     void this.refresh({ force: false, includeHistory: this.panelMode === 'history' });
     if (this.panelMode === 'changes') {
       this.ensureStatusPolling();
@@ -377,7 +393,7 @@ export class GitPanelController {
 
   async refresh({ force = false, includeHistory = this.panelMode === 'history' } = {}) {
     const status = await this.refreshStatus({ force });
-    if (includeHistory && status.isGitRepo) {
+    if (includeHistory && status?.isGitRepo) {
       await this.refreshHistory({ force });
     }
     return status;
@@ -385,6 +401,7 @@ export class GitPanelController {
 
   async refreshStatus({ force = false } = {}) {
     if (!this.enabled) {
+      this.statusError = '';
       this.status = {
         isGitRepo: false,
         sections: [],
@@ -409,6 +426,7 @@ export class GitPanelController {
     try {
       const data = await this.gitApiClient.readStatus({ force });
       this.status = data;
+      this.statusError = '';
       this.pullBackups = [];
       if (data.isGitRepo) {
         try {
@@ -435,25 +453,9 @@ export class GitPanelController {
     } catch (error) {
       console.error('[git-panel] Failed to load git status:', error);
       this.toastController?.show('Failed to load git status');
-      this.status = {
-        isGitRepo: false,
-        sections: [],
-        summary: { changedFiles: 0 },
-      };
-      this.pullBackups = [];
-      this.history = {
-        ...this.history,
-        commits: [],
-        error: '',
-        hasMore: false,
-        loaded: false,
-        loading: false,
-        loadingMore: false,
-        offset: 0,
-      };
-      this.onRepoChange(false, this.status);
+      this.statusError = 'Failed to load Git status. Try again.';
       this.render();
-      return this.status;
+      return null;
     }
   }
 
@@ -615,6 +617,22 @@ export class GitPanelController {
     }
   }
 
+  async handleBulkAction(action) {
+    if (this.pendingActionKey) {
+      return;
+    }
+
+    this.pendingActionKey = action;
+    this.render();
+
+    try {
+      await (action === 'stage-all' ? this.onStageAll() : this.onUnstageAll());
+    } finally {
+      this.pendingActionKey = null;
+      this.render();
+    }
+  }
+
   async handleCommitStaged() {
     const actionKey = 'commit-staged';
     if (this.pendingActionKey === actionKey) {
@@ -835,11 +853,11 @@ export class GitPanelController {
     const commits = this.filterCommits(this.history.commits);
 
     if (this.history.loading && !this.history.loaded) {
-      return '<div class="git-panel-empty">Loading git history...</div>';
+      return '<div class="git-panel-empty" role="status" aria-live="polite">Loading git history…</div>';
     }
 
     if (this.history.error && !this.history.loaded) {
-      return `<div class="git-panel-empty">${escapeHtml(this.history.error)}</div>`;
+      return `<div class="git-panel-empty" role="alert">${escapeHtml(this.history.error)}</div>`;
     }
 
     if (this.history.loaded && commits.length === 0 && this.history.commits.length === 0) {
@@ -862,7 +880,7 @@ export class GitPanelController {
             data-git-history-load-more
             ${this.history.loadingMore ? 'disabled' : ''}
           >
-            ${this.history.loadingMore ? 'Loading...' : 'Load More'}
+            ${this.history.loadingMore ? 'Loading…' : 'Load more'}
           </button>
         </div>
       ` : ''}
@@ -877,6 +895,8 @@ export class GitPanelController {
       .join('');
     const hasChanges = Boolean(this.status.summary?.changedFiles);
     const includedFileCount = Number(this.status.summary?.staged || 0);
+    const excludedFileCount = Number(this.status.summary?.workingTree || 0)
+      + Number(this.status.summary?.untracked || 0);
     const isCommitPending = this.pendingActionKey === 'commit-staged';
 
     return `
@@ -885,9 +905,29 @@ export class GitPanelController {
       ${hasChanges ? `
         <div class="git-panel-footer">
           <div class="git-panel-footer-actions">
+            ${excludedFileCount > 0 ? `
+              <button
+                class="${buttonClassNames({ variant: 'secondary', size: 'compact', action: true, surface: true })}"
+                type="button"
+                data-git-bulk-action="stage-all"
+                ${this.pendingActionKey ? 'disabled' : ''}
+              >
+                ${this.pendingActionKey === 'stage-all' ? 'Working...' : 'Include all changes'}
+              </button>
+            ` : ''}
+            ${includedFileCount > 0 ? `
+              <button
+                class="${buttonClassNames({ variant: 'secondary', size: 'compact', action: true, surface: true })}"
+                type="button"
+                data-git-bulk-action="unstage-all"
+                ${this.pendingActionKey ? 'disabled' : ''}
+              >
+                ${this.pendingActionKey === 'unstage-all' ? 'Working...' : 'Remove all from commit'}
+              </button>
+            ` : ''}
             <button class="${buttonClassNames({ variant: 'secondary', size: 'compact', action: true, surface: true })}" type="button" data-git-view-all>
               <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" aria-hidden="true"><path d="M2 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"/><circle cx="12" cy="12" r="3"/></svg>
-              View Full Diff
+              View full diff
             </button>
             <button
               class="${buttonClassNames({ variant: 'primary', action: true, wide: true, extra: 'git-footer-commit-btn' })}"
@@ -895,7 +935,7 @@ export class GitPanelController {
               data-git-commit-staged
               ${includedFileCount === 0 || isCommitPending ? 'disabled' : ''}
             >
-              ${isCommitPending ? 'Working...' : commitButtonLabel(includedFileCount)}
+              ${isCommitPending ? 'Working…' : commitButtonLabel(includedFileCount)}
             </button>
           </div>
         </div>
@@ -903,14 +943,19 @@ export class GitPanelController {
     `;
   }
 
-  renderEmpty(message) {
+  renderEmpty(message, { alert = false, status = false } = {}) {
     if (!this.panel) {
       return;
     }
 
+    const semantics = alert
+      ? ' role="alert"'
+      : status
+        ? ' role="status" aria-live="polite"'
+        : '';
     // pi-lens-ignore: ast-grep:no-inner-html-js
     this.panel.innerHTML = `
-      <div class="git-panel-empty ui-empty-state ui-empty-state--compact">
+      <div class="git-panel-empty ui-empty-state ui-empty-state--compact"${semantics}>
         <p class="ui-empty-state-copy">${escapeHtml(message)}</p>
       </div>
     `;
@@ -921,8 +966,13 @@ export class GitPanelController {
       return;
     }
 
+    if (this.statusError) {
+      this.renderEmpty(this.statusError, { alert: true });
+      return;
+    }
+
     if (!this.status) {
-      this.renderEmpty('Loading git status...');
+      this.renderEmpty('Loading git status…', { status: true });
       return;
     }