feat: page content update and output

- Set shouldRerenderOnTransaction to false

apps/server/src/collaboration/collaboration.handler.ts

@@ -30,13 +30,18 @@ export class CollaborationHandler {
       updatePageContent: async (
         documentName: string,
         payload: {
+          pageId: string;
           prosemirrorJson: any;
           operation: string;
           user: User;
         },
       ) => {
-        const { prosemirrorJson, operation, user } = payload;
-        this.logger.debug('Updating page content via yjs', documentName);
+        const { pageId, prosemirrorJson, operation, user } = payload;
+        this.logger.debug(
+          'Updating page content via yjs',
+          documentName,
+          payload,
+        );
         await this.withYdocConnection(
           hocuspocus,
           documentName,
@@ -58,9 +63,7 @@ export class CollaborationHandler {
             } else {
               const newContent = prosemirrorJson.content || [];
               const yElements = newContent.map(prosemirrorNodeToYElement);
-              const position =
-                operation === 'prepend' ? 0 : fragment.length;
-              fragment.insert(position, yElements);
+              fragment.insert(fragment.length, yElements);
             }
           },
         );

apps/server/src/collaboration/collaboration.module.ts

@@ -1,10 +1,4 @@
-import {
-  Global,
-  Logger,
-  Module,
-  OnModuleDestroy,
-  OnModuleInit,
-} from '@nestjs/common';
+import { Logger, Module, OnModuleDestroy, OnModuleInit } from '@nestjs/common';
 import { AuthenticationExtension } from './extensions/authentication.extension';
 import { PersistenceExtension } from './extensions/persistence.extension';
 import { CollaborationGateway } from './collaboration.gateway';

apps/server/src/collaboration/extensions/persistence.extension.ts

@@ -182,7 +182,6 @@ export class PersistenceExtension implements Extension {
   async onChange(data: onChangePayload) {
     const documentName = data.documentName;
     const userId = data.context?.user?.id;
-
     if (!userId) return;
 
     if (!this.contributors.has(documentName)) {

apps/server/src/collaboration/yjs.util.ts

@@ -1,177 +0,0 @@
-import {
-  initProseMirrorDoc,
-  relativePositionToAbsolutePosition,
-} from 'y-prosemirror';
-import * as Y from 'yjs';
-import { Document } from '@hocuspocus/server';
-import { getSchema } from '@tiptap/core';
-import { tiptapExtensions } from './collaboration.util';
-
-export type YjsSelection = {
-  anchor: any;
-  head: any;
-};
-
-export function setYjsMark(
-  doc: Document,
-  fragment: Y.XmlFragment,
-  yjsSelection: YjsSelection,
-  markName: string,
-  markAttributes: Record<string, any>,
-) {
-  const schema = getSchema(tiptapExtensions);
-  const { mapping } = initProseMirrorDoc(fragment, schema);
-
-  // Convert JSON positions to Y.js RelativePosition objects
-  const anchorRelPos = Y.createRelativePositionFromJSON(yjsSelection.anchor);
-  const headRelPos = Y.createRelativePositionFromJSON(yjsSelection.head);
-
-  const anchor = relativePositionToAbsolutePosition(
-    doc,
-    fragment,
-    anchorRelPos,
-    mapping,
-  );
-  const head = relativePositionToAbsolutePosition(
-    doc,
-    fragment,
-    headRelPos,
-    mapping,
-  );
-
-  if (anchor === null || head === null) {
-    throw new Error(
-      'Could not resolve Y.js relative positions to absolute positions',
-    );
-  }
-
-  const from = Math.min(anchor, head);
-  const to = Math.max(anchor, head);
-
-  // Apply mark directly to Y.js XmlText nodes
-  // This bypasses updateYFragment which has compatibility issues
-  applyMarkToYFragment(fragment, from, to, markName, markAttributes);
-}
-
-function applyMarkToYFragment(
-  fragment: Y.XmlFragment,
-  from: number,
-  to: number,
-  markName: string,
-  markAttributes: Record<string, any>,
-) {
-  let pos = 0;
-
-  const processItem = (item: any): boolean => {
-    if (pos >= to) return false;
-
-    if (item instanceof Y.XmlText) {
-      const textLength = item.length;
-      const itemEnd = pos + textLength;
-
-      if (itemEnd > from && pos < to) {
-        const formatFrom = Math.max(0, from - pos);
-        const formatTo = Math.min(textLength, to - pos);
-        const formatLength = formatTo - formatFrom;
-
-        if (formatLength > 0) {
-          item.format(formatFrom, formatLength, { [markName]: markAttributes });
-        }
-      }
-      pos = itemEnd;
-    } else if (item instanceof Y.XmlElement) {
-      pos++; // Opening tag
-      for (let i = 0; i < item.length; i++) {
-        if (!processItem(item.get(i))) return false;
-      }
-      pos++; // Closing tag
-    }
-    return true;
-  };
-
-  for (let i = 0; i < fragment.length; i++) {
-    if (!processItem(fragment.get(i))) break;
-  }
-}
-
-/**
- * Removes a mark from all text in the fragment that has the specified attribute value.
- * Useful for deleting comments by commentId.
- */
-export function removeYjsMarkByAttribute(
-  fragment: Y.XmlFragment,
-  markName: string,
-  attributeName: string,
-  attributeValue: string,
-) {
-  const processItem = (item: any) => {
-    if (item instanceof Y.XmlText) {
-      // Get all formatting deltas to find ranges with this mark
-      const deltas = item.toDelta();
-      let offset = 0;
-
-      for (const delta of deltas) {
-        const length = delta.insert?.length ?? 0;
-        const attributes = delta.attributes ?? {};
-        const markAttr = attributes[markName];
-
-        if (markAttr && markAttr[attributeName] === attributeValue) {
-          // Remove the mark by setting it to null
-          item.format(offset, length, { [markName]: null });
-        }
-        offset += length;
-      }
-    } else if (item instanceof Y.XmlElement) {
-      for (let i = 0; i < item.length; i++) {
-        processItem(item.get(i));
-      }
-    }
-  };
-
-  for (let i = 0; i < fragment.length; i++) {
-    processItem(fragment.get(i));
-  }
-}
-
-/**
- * Updates a mark's attributes for all text that has the specified attribute value.
- * Useful for resolving/unresolving comments by commentId.
- */
-export function updateYjsMarkAttribute(
-  fragment: Y.XmlFragment,
-  markName: string,
-  findByAttribute: { name: string; value: string },
-  newAttributes: Record<string, any>,
-) {
-  const processItem = (item: any) => {
-    if (item instanceof Y.XmlText) {
-      const deltas = item.toDelta();
-      let offset = 0;
-
-      for (const delta of deltas) {
-        const length = delta.insert?.length ?? 0;
-        const attributes = delta.attributes ?? {};
-        const markAttr = attributes[markName];
-
-        if (
-          markAttr &&
-          markAttr[findByAttribute.name] === findByAttribute.value
-        ) {
-          // Update the mark with new attributes (merge with existing)
-          item.format(offset, length, {
-            [markName]: { ...markAttr, ...newAttributes },
-          });
-        }
-        offset += length;
-      }
-    } else if (item instanceof Y.XmlElement) {
-      for (let i = 0; i < item.length; i++) {
-        processItem(item.get(i));
-      }
-    }
-  };
-
-  for (let i = 0; i < fragment.length; i++) {
-    processItem(fragment.get(i));
-  }
-}

apps/server/src/core/page/dto/create-page.dto.ts

@@ -5,9 +5,8 @@ import {
   IsUUID,
   ValidateIf,
 } from 'class-validator';
-import { Transform } from 'class-transformer';
 
-export type ContentFormat = 'json' | 'markdown' | 'html';
+export type InputFormat = 'json' | 'markdown' | 'html';
 
 export class CreatePageDto {
   @IsOptional()
@@ -29,7 +28,6 @@ export class CreatePageDto {
   content?: string | object;
 
   @ValidateIf((o) => o.content !== undefined)
-  @Transform(({ value }) => value?.toLowerCase() ?? 'json')
   @IsIn(['json', 'markdown', 'html'])
-  format?: ContentFormat;
+  input?: InputFormat;
 }

apps/server/src/core/page/dto/page.dto.ts

@@ -6,9 +6,6 @@ import {
   IsString,
   IsUUID,
 } from 'class-validator';
-import { Transform } from 'class-transformer';
-
-import { ContentFormat } from './create-page.dto';
 
 export class PageIdDto {
   @IsString()
@@ -26,19 +23,20 @@ export class PageHistoryIdDto {
   historyId: string;
 }
 
+export type OutputFormat = 'json' | 'markdown' | 'html';
+
 export class PageInfoDto extends PageIdDto {
   @IsOptional()
   @IsBoolean()
-  includeSpace: boolean;
+  includeSpace?: boolean;
 
   @IsOptional()
   @IsBoolean()
-  includeContent: boolean;
+  includeContent?: boolean;
 
   @IsOptional()
-  @Transform(({ value }) => value?.toLowerCase())
   @IsIn(['json', 'markdown', 'html'])
-  format?: ContentFormat;
+  output?: OutputFormat;
 }
 
 export class DeletePageDto extends PageIdDto {

apps/server/src/core/page/dto/update-page.dto.ts

@@ -1,9 +1,8 @@
 import { PartialType } from '@nestjs/mapped-types';
-import { CreatePageDto, ContentFormat } from './create-page.dto';
+import { CreatePageDto, InputFormat } from './create-page.dto';
 import { IsIn, IsOptional, IsString, ValidateIf } from 'class-validator';
-import { Transform } from 'class-transformer';
 
-export type ContentOperation = 'append' | 'prepend' | 'replace';
+export type ContentOperation = 'append' | 'replace';
 
 export class UpdatePageDto extends PartialType(CreatePageDto) {
   @IsString()
@@ -13,12 +12,10 @@ export class UpdatePageDto extends PartialType(CreatePageDto) {
   content?: string | object;
 
   @ValidateIf((o) => o.content !== undefined)
-  @Transform(({ value }) => value?.toLowerCase())
-  @IsIn(['append', 'prepend', 'replace'])
+  @IsIn(['append', 'replace'])
   operation?: ContentOperation;
 
   @ValidateIf((o) => o.content !== undefined)
-  @Transform(({ value }) => value?.toLowerCase() ?? 'json')
   @IsIn(['json', 'markdown', 'html'])
-  format?: ContentFormat;
+  input?: InputFormat;
 }

apps/server/src/core/page/page.controller.ts

@@ -70,9 +70,9 @@ export class PageController {
       throw new ForbiddenException();
     }
 
-    if (dto.format && dto.format !== 'json' && page.content) {
+    if (dto.output && dto.output !== 'json' && page.content) {
       const contentOutput =
-        dto.format === 'markdown'
+        dto.output === 'markdown'
           ? jsonToMarkdown(page.content)
           : jsonToHtml(page.content);
       return {
@@ -99,25 +99,7 @@ export class PageController {
       throw new ForbiddenException();
     }
 
-    const page = await this.pageService.create(
-      user.id,
-      workspace.id,
-      createPageDto,
-    );
-
-    if (
-      createPageDto.format &&
-      createPageDto.format !== 'json' &&
-      page.content
-    ) {
-      const contentOutput =
-        createPageDto.format === 'markdown'
-          ? jsonToMarkdown(page.content)
-          : jsonToHtml(page.content);
-      return { ...page, content: contentOutput };
-    }
-
-    return page;
+    return this.pageService.create(user.id, workspace.id, createPageDto);
   }
 
   @HttpCode(HttpStatus.OK)
@@ -134,25 +116,7 @@ export class PageController {
       throw new ForbiddenException();
     }
 
-    const updatedPage = await this.pageService.update(
-      page,
-      updatePageDto,
-      user,
-    );
-
-    if (
-      updatePageDto.format &&
-      updatePageDto.format !== 'json' &&
-      updatedPage.content
-    ) {
-      const contentOutput =
-        updatePageDto.format === 'markdown'
-          ? jsonToMarkdown(updatedPage.content)
-          : jsonToHtml(updatedPage.content);
-      return { ...updatedPage, content: contentOutput };
-    }
-
-    return updatedPage;
+    return this.pageService.update(page, updatePageDto, user);
   }
 
   @HttpCode(HttpStatus.OK)

apps/server/src/core/page/services/page.service.ts

@@ -4,7 +4,7 @@ import {
   Logger,
   NotFoundException,
 } from '@nestjs/common';
-import { CreatePageDto, ContentFormat } from '../dto/create-page.dto';
+import { CreatePageDto, InputFormat } from '../dto/create-page.dto';
 import { ContentOperation, UpdatePageDto } from '../dto/update-page.dto';
 import { PageRepo } from '@docmost/db/repos/page/page.repo';
 import { InsertablePage, Page, User } from '@docmost/db/types/entity.types';
@@ -99,11 +99,31 @@ export class PageService {
     let textContent = undefined;
     let ydoc = undefined;
 
-    if (createPageDto?.content && createPageDto?.format) {
-      const prosemirrorJson = await this.parseProsemirrorContent(
-        createPageDto.content,
-        createPageDto.format,
-      );
+    if (createPageDto?.content && createPageDto?.input) {
+      let prosemirrorJson: any;
+
+      switch (createPageDto.input) {
+        case 'markdown': {
+          const html = await markdownToHtml(createPageDto.content as string);
+          prosemirrorJson = htmlToJson(html as string);
+          break;
+        }
+        case 'html': {
+          prosemirrorJson = htmlToJson(createPageDto.content as string);
+          break;
+        }
+        case 'json':
+        default: {
+          prosemirrorJson = createPageDto.content;
+          break;
+        }
+      }
+
+      try {
+        jsonToNode(prosemirrorJson);
+      } catch (err) {
+        throw new BadRequestException('Invalid content format');
+      }
 
       content = prosemirrorJson;
       textContent = jsonToText(prosemirrorJson);
@@ -193,13 +213,13 @@ export class PageService {
     if (
       updatePageDto.content &&
       updatePageDto.operation &&
-      updatePageDto.format
+      updatePageDto.input
     ) {
       await this.updatePageContent(
         page.id,
         updatePageDto.content,
         updatePageDto.operation,
-        updatePageDto.format,
+        updatePageDto.input,
         user,
       );
     }
@@ -217,16 +237,39 @@ export class PageService {
     pageId: string,
     content: string | object,
     operation: ContentOperation,
-    format: ContentFormat,
+    input: InputFormat,
     user: User,
   ): Promise<void> {
-    const prosemirrorJson = await this.parseProsemirrorContent(content, format);
+    let prosemirrorJson: any;
+
+    switch (input) {
+      case 'markdown': {
+        const html = await markdownToHtml(content as string);
+        prosemirrorJson = htmlToJson(html as string);
+        break;
+      }
+      case 'html': {
+        prosemirrorJson = htmlToJson(content as string);
+        break;
+      }
+      case 'json':
+      default: {
+        prosemirrorJson = content;
+        break;
+      }
+    }
+
+    try {
+      jsonToNode(prosemirrorJson);
+    } catch (err) {
+      throw new BadRequestException('Invalid content format');
+    }
 
     const documentName = `page.${pageId}`;
     await this.collaborationGateway.handleYjsEvent(
       'updatePageContent',
       documentName,
-      { operation, prosemirrorJson, user },
+      { pageId, operation, prosemirrorJson, user },
     );
   }
 
@@ -711,36 +754,4 @@ export class PageService {
   ): Promise<void> {
     await this.pageRepo.removePage(pageId, userId, workspaceId);
   }
-
-  private async parseProsemirrorContent(
-    content: string | object,
-    format: ContentFormat,
-  ): Promise<any> {
-    let prosemirrorJson: any;
-
-    switch (format) {
-      case 'markdown': {
-        const html = await markdownToHtml(content as string);
-        prosemirrorJson = htmlToJson(html as string);
-        break;
-      }
-      case 'html': {
-        prosemirrorJson = htmlToJson(content as string);
-        break;
-      }
-      case 'json':
-      default: {
-        prosemirrorJson = content;
-        break;
-      }
-    }
-
-    try {
-      jsonToNode(prosemirrorJson);
-    } catch (err) {
-      throw new BadRequestException('Invalid content format');
-    }
-
-    return prosemirrorJson;
-  }
 }