Fixed getInsertOperation

code/client/dev-dist/sw.js

@@ -82,7 +82,7 @@ define(['./workbox-fda11f75'], (function (workbox) { 'use strict';
     "revision": "3ca0b8505b4bec776b69afdba2768812"
   }, {
     "url": "index.html",
-    "revision": "0.kad9pi711c"
+    "revision": "0.m5gr4j769k"
   }], {});
   workbox.cleanupOutdatedCaches();
   workbox.registerRoute(new workbox.NavigationRoute(workbox.createHandlerBoundToURL("index.html"), {

code/client/jest.config.js

@@ -0,0 +1,12 @@
+export default {
+  globals: {
+    'ts-jest': {
+      tsConfig: 'tsconfig.json',
+    },
+  },
+  moduleDirectories: ['node_modules', 'src'],
+  paths: {
+    '@src/*': ['./src/*'],
+    '@editor/*': ['./src/editor/*'],
+  },
+};

code/client/package.json

@@ -7,7 +7,7 @@
   "license": "MIT",
   "scripts": {
     "start": "vite --host",
-    "test": "vitest",
+    "test": "vitest --run",
     "coverage": "vitest run --coverage",
     "build": "tsc && vite build",
     "generate": "pwa-assets-generator",

code/client/src/editor/crdt/fugue.ts

@@ -67,20 +67,13 @@ export class Fugue {
    */
   private getInsertOperation({ line, column }: Cursor, { value, styles }: InsertNode): InsertOperation {
     const id = { sender: this.replicaId, counter: this.counter++ };
-    const root = this.findNode('\n', line) || this.tree.root;
-    const leftOrigin = column === 0 ? root : this.tree.getByIndex(root, column - 1);
+    const lineNode = line === 0 ? this.tree.root : this.findNode('\n', line);
+    const leftOrigin = column === 0 ? lineNode : this.tree.getByIndex(lineNode, line === 0 ? column - 1 : column);
     if (isEmpty(leftOrigin.rightChildren)) {
-      return {
-        type: 'insert',
-        id,
-        value,
-        parent: leftOrigin.id,
-        side: 'R',
-        styles,
-      };
+      return { type: 'insert', id, value, parent: leftOrigin.id, side: 'R', styles };
     }
     const rightOrigin = this.tree.getLeftmostDescendant(leftOrigin.rightChildren[0]);
-    return { type: 'insert', id, value, parent: rightOrigin.id, side: 'L' };
+    return { type: 'insert', id, value, parent: rightOrigin.id, side: 'L', styles };
   }
 
   /**
@@ -176,9 +169,9 @@ export class Fugue {
   traverseTree = () => this.tree.traverse(this.tree.root);
 
   findNode(value: string, skip: number): Node<string> {
-    let lastMatch: Node<string> = this.tree.root;
+    let lastMatch = this.tree.root;
     for (const node of this.traverseTree()) {
-      if (node.value === value && !node.isDeleted) {
+      if (node.value === value) {
         lastMatch = node;
         if (--skip === 0) return lastMatch;
       }
@@ -197,4 +190,8 @@ export class Fugue {
   getElementId(index: number): Id {
     return this.tree.getByIndex(this.tree.root, index).id;
   }
+
+  getRootNode(): Node<string> {
+    return this.tree.root!;
+  }
 }

code/client/src/editor/slate/SlateEditor.tsx

@@ -25,7 +25,7 @@ function SlateEditor() {
   const { renderElement, renderLeaf } = useRenderers();
 
   useEvents(fugue, () => {
-    editor.children = toSlate(fugue.traverseTree);
+    editor.children = toSlate(fugue);
     editor.onChange();
   });
 

code/client/src/editor/slate/utils/selection.ts

@@ -1,11 +1,10 @@
 import { Editor } from 'slate';
 import { Selection } from '../model/cursor.ts';
-import { isEqual } from 'lodash';
 
 export function isSelected(editor: Editor) {
   if (!editor.selection) return false;
   const { anchor, focus } = editor.selection;
-  return isEqual(anchor.path, focus.path) || anchor.offset !== focus.offset;
+  return anchor.offset !== focus.offset;
 }
 
 export function getSelection(editor: Editor): Selection {

code/client/src/editor/slate/utils/toSlate.ts

@@ -3,16 +3,14 @@ import type { Style, BlockStyle } from '../../../../../shared/crdt/types/styles'
 import type { CustomText } from '@editor/slate/model/types.ts';
 import { isEmpty, isEqual } from 'lodash';
 import { createChildren, createDescendant } from '@editor/slate/model/utils.ts';
-import { Node } from '../../../../../shared/crdt/types/nodes.ts';
+import { Fugue } from '@editor/crdt/fugue.ts';
 
-export function toSlate<T>(traverse: () => IterableIterator<Node<T>>): Descendant[] {
+export function toSlate(fugue: Fugue): Descendant[] {
+  const root = fugue.getRootNode();
   const descendants: Descendant[] = [];
   let lastStyles: Style[] = [];
   let lineCounter = 0;
-  let root: Node<T> | null = null;
-  for (const node of traverse()) {
-    if (root === null) root = node;
-    if (node.isDeleted) continue;
+  for (const node of fugue.traverseTree()) {
     const textNode: CustomText = {
       text: node.value as string,
       bold: node.styles.includes('bold'),
@@ -24,7 +22,7 @@ export function toSlate<T>(traverse: () => IterableIterator<Node<T>>): Descendan
     // If there are no descendants or new line, add a new paragraph
     if (isEmpty(descendants) || node.value === '\n') {
       const children = node.value === '\n' ? createChildren('') : [textNode];
-      const lineStyle = root!.styles[lineCounter++] as BlockStyle;
+      const lineStyle = (root.styles[lineCounter++] as BlockStyle) || 'paragraph';
       descendants.push(createDescendant(lineStyle, children));
       lastStyles = node.styles;
       continue;

code/client/tests/editor/crdt/tree.test.ts

@@ -1,5 +1,6 @@
 import { FugueTree } from '@notespace/shared/crdt/fugueTree';
-import { InsertOperation, Node } from '@notespace/shared/crdt/types';
+import { Node } from '@notespace/shared/crdt/types/nodes';
+import { InsertOperation } from '@notespace/shared/crdt/types/operations';
 import { describe, it, expect, beforeEach } from 'vitest';
 
 describe('Tree', () => {
@@ -10,7 +11,7 @@ describe('Tree', () => {
 
   it('should add a node to the tree', () => {
     // given
-    const insertMessage: InsertOperation<string> = {
+    const insertMessage: InsertOperation = {
       type: 'insert',
       id: { sender: 'A', counter: 0 },
       value: 'a',
@@ -33,7 +34,7 @@ describe('Tree', () => {
 
   it('should delete a node from the tree', () => {
     // given
-    const insertMessage: InsertOperation<string> = {
+    const insertMessage: InsertOperation = {
       type: 'insert',
       id: { sender: 'A', counter: 0 },
       value: 'a',