feat: success add & remove marks

packages/bridge/src/convert/insert.ts

@@ -1,4 +1,3 @@
-import { Block, Text } from 'slate'
 import { toSlatePath, toJS } from '../utils/index'
 
 const insertTextOp = ({ index, path, value }) => () => ({
@@ -9,45 +8,36 @@ const insertTextOp = ({ index, path, value }) => () => ({
   marks: []
 })
 
-const insertNodeOp = ({ value, index, path }) => map => {
+const insertNodeOp = ({ value, obj, index, path }) => map => {
   const ops = []
 
   const insertRecoursive = ({ nodes, ...json }: any, path) => {
-    const node = nodes
-      ? Block.fromJSON({ ...json, nodes: [] })
-      : Text.fromJSON(json)
-
-    ops.push({
-      type: 'insert_node',
-      path,
-      node
-    })
+    const node = nodes ? { ...json, nodes: [] } : json
+
+    if (node.object === 'mark') {
+      ops.push({
+        type: 'add_mark',
+        path: path.slice(0, -1),
+        mark: node
+      })
+    } else {
+      ops.push({
+        type: 'insert_node',
+        path,
+        node
+      })
+    }
 
     nodes && nodes.forEach((n, i) => insertRecoursive(n, [...path, i]))
   }
 
-  insertRecoursive(map[value], [...toSlatePath(path), index])
+  const source = map[value] || (map[obj] && toJS(map[obj]))
+
+  source && insertRecoursive(source, [...toSlatePath(path), index])
 
   return ops
 }
 
-// let count = 4000
-
-// const insertNodeOp = ({ value, index, path }) => map => {
-//   const node = map[value]
-
-//   if (!node) return null
-
-//   count += 1
-
-//   return {
-//     type: 'insert_node',
-//     path: [...toSlatePath(path), index],
-//     node, //: { ...node, key: count },
-//     data: {}
-//   }
-// }
-
 const insertByType = {
   text: insertTextOp,
   list: insertNodeOp

packages/bridge/src/convert/remove.ts

@@ -22,11 +22,17 @@ const removeMarkOp = ({ path, index }) => (map, doc) => {
   }
 }
 
-const removeNodesOp = ({ index, path }) => () => {
-  const nPath = toSlatePath(path)
+const removeNodesOp = ({ index, obj, path }) => (map, doc) => {
+  const slatePath = toSlatePath(path)
+  if (!map.hasOwnProperty(obj)) {
+    const target = getTarget(doc, [...slatePath, index] as any)
+
+    map[obj] = target
+  }
+
   return {
     type: 'remove_node',
-    path: nPath.length ? nPath.concat(index) : [index],
+    path: slatePath.length ? slatePath.concat(index) : [index],
     node: {
       object: 'text'
     }

packages/bridge/src/convert/set.ts

@@ -1,6 +1,6 @@
 import { toSlatePath, toJS } from '../utils/index'
 
-const setData = ({ path, value }) => map => ({
+const setDataOp = ({ path, value }) => map => ({
   type: 'set_node',
   path: toSlatePath(path),
   properties: {},
@@ -10,15 +10,15 @@ const setData = ({ path, value }) => map => ({
 })
 
 const setByType = {
-  data: setData
+  data: setDataOp
 }
 
 const opSet = (op, [map, ops]) => {
-  const { link, value, obj, key } = op
+  const { link, value, path, obj, key } = op
   try {
     const set = setByType[key]
 
-    if (set) {
+    if (set && path) {
       ops.push(set(op))
     } else {
       map[obj][key] = link ? map[value] : value

packages/client/src/Connection.ts

@@ -35,6 +35,8 @@ class Connection {
 
     this.docSet = new Automerge.DocSet()
 
+    window['getDoc'] = () => toJS(this.docSet.getDoc(this.docId))
+
     this.connect()
   }
 
@@ -60,19 +62,17 @@ class Connection {
       if (operations.length !== 0) {
         const slateOps = toSlateOp(operations, currentDoc)
 
+        // console.log('start key', KeyUtils.create())
+
         console.log('operations', operations, slateOps)
 
-        console.log('this.editor', this.editor)
+        // console.log('this.editor', this.editor)
 
         this.editor.remote = true
 
         this.editor.withoutSaving(() => {
           slateOps.forEach(o => {
             this.editor.applyOperation(o)
-
-            if (o.type === 'insert_node') {
-              o.node.regenerateKey()
-            }
           })
         })
 
@@ -84,7 +84,7 @@ class Connection {
   }
 
   receiveSlateOps = (operations: Immutable.List<Operation>) => {
-    console.log('change slate ops!!!', operations.toJS())
+    console.log('change slate ops!!!', operations.map(op => op.toJSON()).toJS())
 
     const doc = this.docSet.getDoc(this.docId)
     const message = `change from ${this.socket.id}`
@@ -95,7 +95,7 @@ class Connection {
       applySlateOps(d, operations)
     )
 
-    console.log('changed!!!', toJS(changed))
+    // console.log('changed!!!', toJS(changed))
 
     this.docSet.setDoc(this.docId, changed)
   }

packages/client/src/Controller.tsx

@@ -1,10 +1,10 @@
-import React, { PureComponent, ReactNode } from 'react'
+import React, { Component, ReactNode } from 'react'
 
 import Connection from './Connection'
 
 import { ControllerProps } from './model'
 
-class Controller extends PureComponent<ControllerProps> {
+class Controller extends Component<ControllerProps> {
   connection?: Connection
 
   state = {