collabmd 0.1.47 → 0.1.49

package/src/client/infrastructure/editor-view-adapter.js

@@ -2,14 +2,11 @@ import { vim } from '@replit/codemirror-vim';
 import { autocompletion, closeBrackets, closeBracketsKeymap } from '@codemirror/autocomplete';
 import {
   defaultKeymap,
-  history,
-  historyKeymap,
   indentLess,
   indentMore,
   indentWithTab,
-  redo,
-  undo,
 } from '@codemirror/commands';
+import { html } from '@codemirror/lang-html';
 import { markdown, markdownLanguage } from '@codemirror/lang-markdown';
 import { yaml } from '@codemirror/lang-yaml';
 import {
@@ -44,15 +41,18 @@ import {
   lineNumbers,
   rectangularSelection,
 } from '@codemirror/view';
-import { yCollab } from 'y-codemirror.next';
+import { yCollab, yUndoManagerKeymap } from 'y-codemirror.next';
 
 import {
   isBaseFilePath,
+  isHtmlFilePath,
   isMermaidFilePath,
   isPlantUmlFilePath,
   isStructurizrFilePath,
 } from '../../domain/file-kind.js';
+import { resolveExactTextChanges } from '../../domain/exact-text-edits.js';
 import { normalizeCommentQuote } from '../../domain/comment-threads.js';
+import { formatDocumentText } from '../domain/document-formatter.js';
 import { createMarkdownToolbarEdit } from '../domain/markdown-formatting.js';
 import { mermaidLanguage, mermaidLanguageDescription } from '../domain/mermaid-language.js';
 import { wikiLinkCompletions } from '../domain/wiki-link-completions.js';
@@ -149,8 +149,6 @@ const EDITOR_COMMANDS = Object.freeze({
   indentLess,
   indentMore,
   openSearch: openSearchPanelPreservingViewport,
-  redo,
-  undo,
 });
 
 class RemoteUpdateCaretWidget extends WidgetType {
@@ -391,6 +389,10 @@ function createEditorTheme(theme) {
 }
 
 export function createLanguageExtension(filePath) {
+  if (isHtmlFilePath(filePath)) {
+    return html();
+  }
+
   if (isMermaidFilePath(filePath)) {
     return mermaidLanguage;
   }
@@ -441,6 +443,7 @@ export class EditorViewAdapter {
     this.onSelectionChanged = onSelectionChanged;
     this.onViewportChanged = onViewportChanged;
     this.editorView = null;
+    this.undoManager = null;
     this.themeCompartment = new Compartment();
     this.syntaxThemeCompartment = new Compartment();
     this.lineWrappingCompartment = new Compartment();
@@ -477,11 +480,11 @@ export class EditorViewAdapter {
   }
 
   getBaseExtensions(filePath, { readOnly = false } = {}) {
+    const wikiLinkCompletionSource = wikiLinkCompletions(this.getFileList);
     const extensions = [
       lineNumbers(),
       highlightActiveLineGutter(),
       highlightSpecialChars(),
-      history(),
       foldGutter(),
       drawSelection(),
       EditorState.allowMultipleSelections.of(true),
@@ -489,9 +492,10 @@ export class EditorViewAdapter {
       syntaxHighlighting(defaultHighlightStyle, { fallback: true }),
       bracketMatching({ renderMatch: renderBracketMatch }),
       closeBrackets(),
-      autocompletion({
-        override: [wikiLinkCompletions(this.getFileList)],
-      }),
+      autocompletion(),
+      EditorState.languageData.of(() => [{
+        autocomplete: wikiLinkCompletionSource,
+      }]),
       rectangularSelection(),
       crosshairCursor(),
       highlightActiveLine(),
@@ -501,7 +505,6 @@ export class EditorViewAdapter {
       keymap.of([
         ...closeBracketsKeymap,
         ...defaultKeymap,
-        ...historyKeymap,
         ...searchKeymap.map((binding) => (
           binding.run === openSearchPanel
             ? { ...binding, run: openSearchPanelPreservingViewport }
@@ -593,10 +596,12 @@ export class EditorViewAdapter {
 
   initialize({ awareness, filePath, undoManager, ytext }) {
     const preserveScrollTop = this.editorView?.scrollDOM?.scrollTop ?? 0;
+    this.undoManager = undoManager;
     const state = EditorState.create({
       doc: ytext.toString(),
       extensions: [
         ...this.getBaseExtensions(filePath),
+        keymap.of(yUndoManagerKeymap),
         yCollab(ytext, awareness, { undoManager }),
       ],
     });
@@ -609,6 +614,7 @@ export class EditorViewAdapter {
 
   initializeProvisional({ content = '', filePath }) {
     const preserveScrollTop = this.editorView?.scrollDOM?.scrollTop ?? 0;
+    this.undoManager = null;
     const state = EditorState.create({
       doc: String(content ?? ''),
       extensions: this.getBaseExtensions(filePath, { readOnly: true }),
@@ -629,6 +635,7 @@ export class EditorViewAdapter {
       clearTimeout(this.remoteUpdateFlashTimer);
       this.remoteUpdateFlashTimer = 0;
     }
+    this.undoManager = null;
     this.teardownEditorView({ clearContainer: true });
   }
 
@@ -709,18 +716,58 @@ export class EditorViewAdapter {
     this.editorView?.requestMeasure();
   }
 
+  async formatDocument(filePath) {
+    const view = this.editorView;
+    if (!view || view.state.readOnly) {
+      return 'unsupported';
+    }
+
+    const source = view.state.doc.toString();
+    const formatted = await formatDocumentText(filePath, source);
+    if (formatted == null) {
+      return 'unsupported';
+    }
+    if (this.editorView !== view || view.state.doc.toString() !== source) {
+      return 'changed';
+    }
+    if (formatted === source) {
+      return 'unchanged';
+    }
+
+    const selection = EditorSelection.create(view.state.selection.ranges.map(({ anchor, head }) => (
+      EditorSelection.range(Math.min(anchor, formatted.length), Math.min(head, formatted.length))
+    )));
+    view.dispatch({
+      changes: { from: 0, to: source.length, insert: formatted },
+      selection,
+      scrollIntoView: true,
+      userEvent: 'input.format',
+    });
+    view.focus();
+    return 'formatted';
+  }
+
   runEditorCommand(commandId) {
     if (!this.editorView) {
       return false;
     }
 
-    const command = EDITOR_COMMANDS[String(commandId ?? '')];
+    const normalizedCommandId = String(commandId ?? '');
+    if ((normalizedCommandId === 'undo' || normalizedCommandId === 'redo') && this.undoManager) {
+      const applied = this.undoManager[normalizedCommandId]() != null;
+      if (applied) {
+        this.editorView.focus();
+      }
+      return applied;
+    }
+
+    const command = EDITOR_COMMANDS[normalizedCommandId];
     if (typeof command !== 'function') {
       return false;
     }
 
     const applied = command(this.editorView);
-    if (applied && commandId !== 'openSearch') {
+    if (applied && normalizedCommandId !== 'openSearch') {
       this.editorView.focus();
     }
 
@@ -1097,6 +1144,18 @@ export class EditorViewAdapter {
     return true;
   }
 
+  applyTextReplacements(replacements) {
+    if (!this.editorView) {
+      throw new Error('The editor is not available');
+    }
+
+    const { state } = this.editorView;
+    const changes = resolveExactTextChanges(state.doc.toString(), replacements);
+
+    this.editorView.dispatch({ changes, userEvent: 'input' });
+    return changes.length;
+  }
+
   replaceText(text) {
     if (!this.editorView) {
       return false;

package/src/client/infrastructure/excalidraw-room-client.js

@@ -1,5 +1,7 @@
 import { Doc } from 'yjs';
 import { WebsocketProvider } from 'y-websocket';
+import * as decoding from 'lib0/decoding';
+import * as encoding from 'lib0/encoding';
 import {
   EXCALIDRAW_APP_STATE_KEY,
   EXCALIDRAW_ELEMENTS_KEY,
@@ -12,6 +14,10 @@ import {
   readLegacyExcalidrawRoomScene,
   replaceExcalidrawRoomScene,
 } from '../../domain/excalidraw-room-codec.js';
+import {
+  MSG_AGENT_FLUSH,
+  MSG_AGENT_FLUSH_ACK,
+} from '../../domain/collaboration-protocol.js';
 
 import {
   buildCollaboratorsMap,
@@ -33,6 +39,7 @@ import { stopReconnectOnControlledClose } from './yjs-provider-reset-guard.js';
 const DEFAULT_EMPTY_SCENE_GUARD_MS = 250;
 const DEFAULT_SAVE_THROTTLE_MS = 48;
 const DEFAULT_SYNC_TIMEOUT_MS = 4000;
+const DEFAULT_AGENT_FLUSH_TIMEOUT_MS = 1000;
 
 export const EXCALIDRAW_ROOM_CONNECTION_STATE = Object.freeze({
   AUTHORITATIVE: 'authoritative',
@@ -178,6 +185,8 @@ export class ExcalidrawRoomClient {
     this.lastViewportSignature = '';
     this.lastSelectedIdsSignature = '';
     this.pendingEmptySceneCandidate = null;
+    this.agentFlushRequestCounter = 0;
+    this.pendingAgentFlushRequests = new Map();
     this.structuredObserversAttached = false;
     this.canWriteToRoom = false;
     this.waitingForAuthoritativeSync = false;
@@ -250,6 +259,74 @@ export class ExcalidrawRoomClient {
     return this.connectionState;
   }
 
+  installAgentFlushHandler() {
+    const messageHandlers = this.provider?.messageHandlers;
+    if (!messageHandlers || typeof messageHandlers !== 'object') {
+      return false;
+    }
+
+    messageHandlers[MSG_AGENT_FLUSH_ACK] = (_encoder, decoder) => {
+      let requestId;
+      try {
+        requestId = decoding.readVarString(decoder);
+      } catch {
+        return;
+      }
+
+      const request = this.pendingAgentFlushRequests.get(requestId);
+      if (!request) {
+        return;
+      }
+
+      request.resolve({ status: 'acknowledged' });
+    };
+    return true;
+  }
+
+  settleAgentFlushRequests(status) {
+    const requests = [...this.pendingAgentFlushRequests.values()];
+    requests.forEach((request) => request.resolve({ status }));
+  }
+
+  waitForServerFlush({ timeoutMs = DEFAULT_AGENT_FLUSH_TIMEOUT_MS } = {}) {
+    const ws = this.provider?.ws;
+    const openState = ws?.OPEN ?? globalThis.WebSocket?.OPEN ?? 1;
+    if (
+      !this.canWriteToRoom
+      || !ws
+      || ws.readyState !== openState
+      || !this.provider?.messageHandlers?.[MSG_AGENT_FLUSH_ACK]
+    ) {
+      return Promise.resolve({ status: 'unavailable' });
+    }
+
+    const requestId = `agent-flush-${this.ydoc?.clientID ?? 'client'}-${++this.agentFlushRequestCounter}`;
+    return new Promise((resolve) => {
+      const finish = (result) => {
+        const request = this.pendingAgentFlushRequests.get(requestId);
+        if (!request) {
+          return;
+        }
+        this.clearTimeoutFn(request.timeoutId);
+        this.pendingAgentFlushRequests.delete(requestId);
+        resolve(result);
+      };
+      this.pendingAgentFlushRequests.set(requestId, {
+        resolve: finish,
+        timeoutId: this.setTimeoutFn(() => finish({ status: 'timeout' }), timeoutMs),
+      });
+
+      try {
+        const encoder = encoding.createEncoder();
+        encoding.writeVarUint(encoder, MSG_AGENT_FLUSH);
+        encoding.writeVarString(encoder, requestId);
+        ws.send(encoding.toUint8Array(encoder));
+      } catch {
+        finish({ status: 'unavailable' });
+      }
+    });
+  }
+
   hasPendingWrites() {
     return Boolean(this.pendingSceneSyncPayload);
   }
@@ -368,6 +445,7 @@ export class ExcalidrawRoomClient {
       disableBc: true,
       maxBackoffTime: 5000,
     });
+    this.installAgentFlushHandler();
     stopReconnectOnControlledClose(this.provider);
 
     this.awareness = this.provider.awareness;
@@ -636,7 +714,7 @@ export class ExcalidrawRoomClient {
   }
 
   scheduleSceneSync(elements, appState, files) {
-    if (!this.canWriteToRoom) {
+    if (!this.canWriteToRoom || this.isApplyingSharedSnapshot()) {
       return false;
     }
 
@@ -933,6 +1011,7 @@ export class ExcalidrawRoomClient {
 
   disconnect() {
     this.flushSceneSync();
+    this.settleAgentFlushRequests('disconnected');
     this.setConnectionState(EXCALIDRAW_ROOM_CONNECTION_STATE.DISCONNECTING);
     this.clearTimeoutFn(this.sceneSyncTimer);
     this.sceneSyncTimer = null;

package/src/client/infrastructure/git-api-client.js

@@ -13,28 +13,37 @@ function createSearchParams(values = {}) {
   return params;
 }
 
-export class GitApiClient {
+async function postJson(path, payload, { fallbackError, requestId = null } = {}) {
+  const response = await fetch(resolveApiUrl(path), {
+    body: JSON.stringify(payload),
+    headers: createRequestHeaders(requestId, { 'Content-Type': 'application/json' }),
+    method: 'POST',
+  });
+  return parseApiResponse(response, fallbackError);
+}
+
+export const gitApiClient = {
   async readStatus({ force = false } = {}) {
     const response = await fetch(resolveApiUrl(`/git/status${force ? '?force=true' : ''}`));
     return parseApiResponse(response, 'Failed to load git status');
-  }
+  },
 
   async readPullBackups() {
     const response = await fetch(resolveApiUrl('/git/pull-backups'));
     return parseApiResponse(response, 'Failed to load pull backups');
-  }
+  },
 
   async readHistory({ limit, offset } = {}) {
     const params = createSearchParams({ limit, offset });
     const response = await fetch(resolveApiUrl(`/git/history?${params.toString()}`));
     return parseApiResponse(response, 'Failed to load git history');
-  }
+  },
 
   async readFileHistory({ path, limit, offset } = {}) {
     const params = createSearchParams({ limit, offset, path });
     const response = await fetch(resolveApiUrl(`/git/file-history?${params.toString()}`));
     return parseApiResponse(response, 'Failed to load file history');
-  }
+  },
 
   async readDiff({
     allowLargePatch = false,
@@ -50,7 +59,7 @@ export class GitApiClient {
     });
     const response = await fetch(resolveApiUrl(`/git/diff?${params.toString()}`));
     return parseApiResponse(response, 'Failed to load git diff');
-  }
+  },
 
   async readCommit({
     allowLargePatch = false,
@@ -66,51 +75,48 @@ export class GitApiClient {
     });
     const response = await fetch(resolveApiUrl(`/git/commit?${params.toString()}`));
     return parseApiResponse(response, 'Failed to load git commit');
-  }
+  },
 
   async readFileSnapshot({ hash, path } = {}) {
     const params = createSearchParams({ hash, path });
     const response = await fetch(resolveApiUrl(`/git/file-snapshot?${params.toString()}`));
     return parseApiResponse(response, 'Failed to load historical file preview');
-  }
+  },
 
   getFileAttachmentUrl({ hash, path } = {}) {
     const params = createSearchParams({ hash, path });
     return resolveApiUrl(`/git/file-attachment?${params.toString()}`);
-  }
+  },
 
   async stageFile({ path, requestId = null } = {}) {
-    return this.#postJson('/git/stage', { path }, { requestId, fallbackError: 'Failed to stage file' });
-  }
+    return postJson('/git/stage', { path }, { requestId, fallbackError: 'Failed to stage file' });
+  },
 
   async unstageFile({ path, requestId = null } = {}) {
-    return this.#postJson('/git/unstage', { path }, { requestId, fallbackError: 'Failed to unstage file' });
-  }
+    return postJson('/git/unstage', { path }, { requestId, fallbackError: 'Failed to unstage file' });
+  },
+
+  async stageAll({ requestId = null } = {}) {
+    return postJson('/git/stage-all', {}, { requestId, fallbackError: 'Failed to stage all changes' });
+  },
+
+  async unstageAll({ requestId = null } = {}) {
+    return postJson('/git/unstage-all', {}, { requestId, fallbackError: 'Failed to unstage all changes' });
+  },
 
   async pushBranch({ requestId = null } = {}) {
-    return this.#postJson('/git/push', {}, { requestId, fallbackError: 'Failed to push branch' });
-  }
+    return postJson('/git/push', {}, { requestId, fallbackError: 'Failed to push branch' });
+  },
 
   async pullBranch({ requestId = null } = {}) {
-    return this.#postJson('/git/pull', {}, { requestId, fallbackError: 'Failed to pull branch' });
-  }
+    return postJson('/git/pull', {}, { requestId, fallbackError: 'Failed to pull branch' });
+  },
 
   async resetFile({ path, requestId = null } = {}) {
-    return this.#postJson('/git/reset-file', { path }, { requestId, fallbackError: 'Failed to reset file' });
-  }
+    return postJson('/git/reset-file', { path }, { requestId, fallbackError: 'Failed to reset file' });
+  },
 
   async commit({ message, requestId = null } = {}) {
-    return this.#postJson('/git/commit', { message }, { requestId, fallbackError: 'Failed to commit staged changes' });
-  }
-
-  async #postJson(path, payload, { fallbackError, requestId = null } = {}) {
-    const response = await fetch(resolveApiUrl(path), {
-      body: JSON.stringify(payload),
-      headers: createRequestHeaders(requestId, { 'Content-Type': 'application/json' }),
-      method: 'POST',
-    });
-    return parseApiResponse(response, fallbackError);
-  }
-}
-
-export const gitApiClient = new GitApiClient();
+    return postJson('/git/commit', { message }, { requestId, fallbackError: 'Failed to commit staged changes' });
+  },
+};

package/src/client/infrastructure/lobby-presence.js

@@ -19,11 +19,8 @@ function normalizeChatMessage(value) {
 }
 
 function createLobbyMessageId(peerId) {
-  if (globalThis.crypto?.randomUUID) {
-    return globalThis.crypto.randomUUID();
-  }
-
-  return `${peerId || 'user'}-${Date.now()}-${Math.random().toString(36).slice(2, 10)}`;
+  return globalThis.crypto?.randomUUID?.()
+    ?? `${peerId || 'user'}-${Date.now()}-${Math.random().toString(36).slice(2, 10)}`;
 }
 
 function normalizeWorkspaceEvent(event) {

package/src/client/infrastructure/runtime-config.js

@@ -74,7 +74,7 @@ export function getHashRoute() {
   }
 
   if (params.has(HASH_ROUTE_KEYS.file)) {
-    return {
+    const route = {
       anchor: params.get('anchor') || null,
       column: params.has('column') ? Number(params.get('column')) || null : null,
       drawioMode: params.get('drawio') || null,
@@ -83,6 +83,12 @@ export function getHashRoute() {
       matchLength: params.has('matchLength') ? Number(params.get('matchLength')) || null : null,
       type: 'file',
     };
+    const elementId = params.get('element') || '';
+    if (elementId) {
+      route.elementId = elementId;
+      route.elementType = params.get('elementType') === 'group' ? 'group' : 'element';
+    }
+    return route;
   }
 
   return { type: 'empty' };
@@ -92,6 +98,8 @@ export function navigateToFile(filePath, {
   anchor = null,
   column = null,
   drawioMode = null,
+  elementId = null,
+  elementType = null,
   line = null,
   matchLength = null,
 } = {}) {
@@ -99,6 +107,8 @@ export function navigateToFile(filePath, {
     anchor,
     column,
     drawioMode,
+    elementId,
+    elementType,
     line,
     matchLength,
   });

package/src/client/infrastructure/tab-activity-lock.js

@@ -8,11 +8,8 @@ function now() {
 }
 
 function createTabId() {
-  if (globalThis.crypto?.randomUUID) {
-    return globalThis.crypto.randomUUID();
-  }
-
-  return `tab-${now()}-${Math.random().toString(36).slice(2, 10)}`;
+  return globalThis.crypto?.randomUUID?.()
+    ?? `tab-${now()}-${Math.random().toString(36).slice(2, 10)}`;
 }
 
 function safeJsonParse(value) {