@seafile/sdoc-editor 0.5.65 → 0.5.67-beta

package/dist/basic-sdk/utils/rebase.js

@@ -25,6 +25,77 @@ export const hasConflict = content => {
   }
   return flag;
 };
+const expandGroup = content => {
+  if ([ELEMENT_TYPE.UNORDERED_LIST, ELEMENT_TYPE.ORDERED_LIST].includes(content.type)) {
+    return [_objectSpread(_objectSpread({}, content), {}, {
+      children: content.children.map(item => {
+        if (item.type === ELEMENT_TYPE.GROUP) {
+          return expandGroup(item);
+        }
+        return item;
+      }).flat(1)
+    })];
+  }
+  return content.type === ELEMENT_TYPE.GROUP ? content.children : [content];
+};
+const mergeChanges = changes => {
+  if (!Array.isArray(changes) || changes.length === 0) return changes;
+  let value = [];
+  let i = 0;
+  // while (i < changes.length) {
+  //   const change = changes[i];
+  //   const lastChange = value[value.length - 1];
+  //   if (change && lastChange && change[REBASE_MARK_KEY.MODIFY_TYPE] === lastChange[REBASE_MARK_KEY.MODIFY_TYPE] && [MODIFY_TYPE.ADD, MODIFY_TYPE.DELETE].includes(change[REBASE_MARK_KEY.MODIFY_TYPE])) {
+  //     if (lastChange.type === ELEMENT_TYPE.GROUP) {
+  //       change[REBASE_MARK_KEY.MODIFY_TYPE] && delete change[REBASE_MARK_KEY.MODIFY_TYPE];
+  //       lastChange.children.push(change);
+  //     } else {
+  //       value = value.slice(0, value.length - 1);
+  //       const modifyType = change[REBASE_MARK_KEY.MODIFY_TYPE];
+  //       lastChange[REBASE_MARK_KEY.MODIFY_TYPE] && delete lastChange[REBASE_MARK_KEY.MODIFY_TYPE];
+  //       change[REBASE_MARK_KEY.MODIFY_TYPE] && delete change[REBASE_MARK_KEY.MODIFY_TYPE];
+  //       value.push({
+  //         id: lastChange.id + '_group',
+  //         type: ELEMENT_TYPE.GROUP,
+  //         [REBASE_MARK_KEY.MODIFY_TYPE]: modifyType,
+  //         children: [lastChange, change],
+  //       });
+  //     }
+  //     i++;
+  //   } else {
+  //     value.push(change);
+  //     i++;
+  //   }
+  // }
+
+  // also add
+
+  while (i < changes.length) {
+    const change = changes[i];
+    const lastChange = value[value.length - 1];
+    if (change && lastChange && change[REBASE_MARK_KEY.MODIFY_TYPE] === MODIFY_TYPE.ADD && lastChange[REBASE_MARK_KEY.MODIFY_TYPE] === MODIFY_TYPE.DELETE) {
+      value = value.slice(0, value.length - 1);
+      lastChange[REBASE_MARK_KEY.MODIFY_TYPE] && delete lastChange[REBASE_MARK_KEY.MODIFY_TYPE];
+      change[REBASE_MARK_KEY.MODIFY_TYPE] && delete change[REBASE_MARK_KEY.MODIFY_TYPE];
+      value.push({
+        id: change.id.endsWith('_group') ? change.id : change.id + '_group',
+        type: ELEMENT_TYPE.GROUP,
+        [REBASE_MARK_KEY.MODIFY_TYPE]: MODIFY_TYPE.MODIFY,
+        children: expandGroup(change),
+        [REBASE_MARK_KEY.OLD_ELEMENT]: {
+          id: lastChange.id.endsWith('_group') ? lastChange.id : lastChange.id + '_group',
+          type: ELEMENT_TYPE.GROUP,
+          children: expandGroup(lastChange)
+        }
+      });
+      i++;
+    } else {
+      value.push(change);
+      i++;
+    }
+  }
+  return value;
+};
 const getChanges = (masterContent, revisionContent) => {
   const {
     map: masterContentMap,
@@ -43,15 +114,21 @@ const getChanges = (masterContent, revisionContent) => {
       removed
     } = idDiff;
     if (added) {
-      const addedList = value.map(item => _objectSpread(_objectSpread({}, currentContentMap[item]), {}, {
-        [REBASE_MARK_KEY.MODIFY_TYPE]: MODIFY_TYPE.ADD
-      }));
-      content.push(...addedList);
+      // merge consecutive identical operations
+      content.push({
+        id: value[0].id + '_group',
+        type: ELEMENT_TYPE.GROUP,
+        [REBASE_MARK_KEY.MODIFY_TYPE]: MODIFY_TYPE.ADD,
+        children: value.map(item => currentContentMap[item])
+      });
     } else if (removed) {
-      const deletedList = value.map(item => _objectSpread(_objectSpread({}, masterContentMap[item]), {}, {
-        [REBASE_MARK_KEY.MODIFY_TYPE]: MODIFY_TYPE.DELETE
-      }));
-      content.push(...deletedList);
+      // merge consecutive identical operations
+      content.push({
+        id: value[0].id + '_group',
+        type: ELEMENT_TYPE.GROUP,
+        [REBASE_MARK_KEY.MODIFY_TYPE]: MODIFY_TYPE.DELETE,
+        children: value.map(item => currentContentMap[item])
+      });
     } else {
       value.forEach(elementId => {
         if (ObjectUtils.isSameObject(masterContentMap[elementId], currentContentMap[elementId])) {
@@ -76,7 +153,7 @@ const getChanges = (masterContent, revisionContent) => {
       });
     }
   });
-  return content;
+  return mergeChanges(content);
 };
 const getMergeElement = (diffElement, baseElement) => {
   const modifyType = diffElement[REBASE_MARK_KEY.MODIFY_TYPE];
@@ -86,7 +163,7 @@ const getMergeElement = (diffElement, baseElement) => {
   // revision does not have this element, master has this element
   if (modifyType === MODIFY_TYPE.DELETE) {
     // base content does not have this element, indicating that it is newly added by master and needs to be retained, and will not be counted as a conflict.
-    if (!baseElement) return [newElement];
+    if (!baseElement) return expandGroup(newElement);
 
     // base content has this element, master modified it, indicating that revision deleted it, and the user manually selected the conflict
     if (!ObjectUtils.isSameObject(baseElement, diffElement, [REBASE_MARK_KEY.MODIFY_TYPE])) {
@@ -101,7 +178,7 @@ const getMergeElement = (diffElement, baseElement) => {
   // revision has this element, master does not have this element
   if (modifyType === MODIFY_TYPE.ADD) {
     // base content does not have this element, indicating that it is newly added by revision and needs to be retained, and will not be counted as a conflict.
-    if (!baseElement) return [newElement];
+    if (!baseElement) return expandGroup(newElement);
 
     // master deleted it, revision modified it, and the user manually selected the conflict
     if (!ObjectUtils.isSameObject(baseElement, diffElement, [REBASE_MARK_KEY.MODIFY_TYPE])) {
@@ -161,10 +238,10 @@ const getMergeElement = (diffElement, baseElement) => {
         [REBASE_MARK_KEY.ORIGIN]: REBASE_ORIGIN.MY
       })];
     }
-    if (ObjectUtils.isSameObject(masterElement, baseElement)) return [newElement];
+    if (ObjectUtils.isSameObject(masterElement, baseElement)) return expandGroup(newElement);
     if (ObjectUtils.isSameObject(newElement, baseElement)) return [masterElement];
     if (ObjectUtils.isSameObject(masterElement, newElement, ['type'])) {
-      if (ObjectUtils.isSameObject(masterElement, baseElement, ['type'])) return [newElement];
+      if (ObjectUtils.isSameObject(masterElement, baseElement, ['type'])) return expandGroup(newElement);
       if (ObjectUtils.isSameObject(newElement, baseElement, ['type'])) return [masterElement];
     }
 
@@ -175,7 +252,7 @@ const getMergeElement = (diffElement, baseElement) => {
     })];
   }
   newElement[REBASE_MARK_KEY.OLD_ELEMENT] && delete newElement[REBASE_MARK_KEY.OLD_ELEMENT];
-  return [newElement];
+  return expandGroup(newElement);
 };
 const getMergeContent = (baseContent, diffChanges) => {
   const {
@@ -234,7 +311,9 @@ export const getRebase = (masterContent, baseContent, revisionContent) => {
     };
   }
   const diffChanges = getChanges(masterContent, revisionContent);
+  console.log('diffChanges: ', diffChanges);
   const content = getMergeContent(baseContent, diffChanges);
+  console.log('content: ', content);
   return {
     canMerge: canMerge(content, revisionContent.children),
     isNeedReplaceMaster: true,

package/dist/components/doc-operations/revision-operations/index.js

@@ -33,6 +33,7 @@ const RevisionOperations = _ref => {
     loadDocument
   } = useDocument();
   useEffect(() => {
+    return;
     if (!isSdocRevision) return;
     if (isShowChanges) return;
     if (isPublished) return;

package/dist/index.js

@@ -6,4 +6,6 @@ import DiffViewer from './pages/diff-viewer';
 import PublishedRevisionViewer from './pages/published-revision-viewer';
 import WikiViewer from './pages/wiki-viewer';
 import SdocWikiViewer from './pages/sdoc-wiki-viewer';
-export { SDocViewer, SimpleEditor, SimpleViewer, EventBus, EXTERNAL_EVENT, DiffViewer, PublishedRevisionViewer, WikiViewer, SdocWikiViewer };
+import DocumentPluginEditor from './pages/document-plugin-editor';
+import DocumentPluginViewer from './pages/document-plugin-viewer';
+export { SDocViewer, SimpleEditor, SimpleViewer, EventBus, EXTERNAL_EVENT, DiffViewer, PublishedRevisionViewer, WikiViewer, SdocWikiViewer, DocumentPluginEditor, DocumentPluginViewer };

package/dist/pages/document-plugin-editor.js

@@ -0,0 +1,46 @@
+import React, { useMemo } from 'react';
+import { withTranslation } from 'react-i18next';
+import context from '../context';
+import { SDocEditor } from '../basic-sdk';
+import { PAGE_EDIT_AREA_WIDTH } from '../basic-sdk/constants';
+import { createDefaultEditor } from '../basic-sdk/extension';
+import withNodeId from '../basic-sdk/node-id';
+import { withSocketIO } from '../basic-sdk/socket';
+import { ColumnPlugin } from '../basic-sdk/extension/plugins';
+import ErrorBoundary from './error-boundary';
+import '../assets/css/simple-editor.css';
+import '../assets/css/plugin-editor.css';
+const DocumentPluginEditor = _ref => {
+  let {
+    document,
+    showOutline,
+    scrollRef,
+    columns
+  } = _ref;
+  context.initApi();
+  const validEditor = useMemo(() => {
+    const withColumnPlugin = ColumnPlugin.editorPlugin;
+    const defaultEditor = withColumnPlugin(createDefaultEditor());
+    const editorConfig = context.getEditorConfig();
+    const newEditor = withNodeId(withSocketIO(defaultEditor, {
+      document,
+      config: editorConfig
+    }));
+    const {
+      cursors
+    } = document;
+    newEditor.columns = columns || [];
+    newEditor.cursors = cursors || {};
+    newEditor.width = PAGE_EDIT_AREA_WIDTH; // default width
+    return newEditor;
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  return /*#__PURE__*/React.createElement(ErrorBoundary, null, /*#__PURE__*/React.createElement(SDocEditor, {
+    editor: validEditor,
+    scrollRef: scrollRef,
+    document: document,
+    showComment: false,
+    showOutline: showOutline
+  }));
+};
+export default withTranslation('sdoc-editor')(DocumentPluginEditor);

package/dist/pages/document-plugin-viewer.js

@@ -0,0 +1,55 @@
+import React, { useEffect, useMemo } from 'react';
+import { withTranslation } from 'react-i18next';
+import context from '../context';
+import { SDocViewer } from '../basic-sdk';
+import { PAGE_EDIT_AREA_WIDTH } from '../basic-sdk/constants';
+import { createDefaultEditor } from '../basic-sdk/extension';
+import withNodeId from '../basic-sdk/node-id';
+import { withSocketIO } from '../basic-sdk/socket';
+import { ColumnPlugin } from '../basic-sdk/extension/plugins';
+import ErrorBoundary from './error-boundary';
+import useForceUpdate from '../basic-sdk/hooks/use-force-update';
+import '../assets/css/simple-editor.css';
+import '../assets/css/plugin-editor.css';
+const DocumentPluginViewer = _ref => {
+  let {
+    scrollRef,
+    document,
+    showOutline,
+    columns,
+    getColumnCellValue
+  } = _ref;
+  context.initApi();
+  const forceUpdate = useForceUpdate();
+  const validEditor = useMemo(() => {
+    const withColumnPlugin = ColumnPlugin.editorPlugin;
+    const defaultEditor = withColumnPlugin(createDefaultEditor());
+    const editorConfig = context.getEditorConfig();
+    const newEditor = withNodeId(withSocketIO(defaultEditor, {
+      document,
+      config: editorConfig
+    }));
+    const {
+      cursors
+    } = document;
+    newEditor.columns = columns || [];
+    newEditor.getColumnCellValue = getColumnCellValue ? getColumnCellValue : null;
+    newEditor.cursors = cursors || {};
+    newEditor.width = PAGE_EDIT_AREA_WIDTH; // default width
+    return newEditor;
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  useEffect(() => {
+    validEditor.getColumnCellValue = getColumnCellValue ? getColumnCellValue : null;
+    forceUpdate();
+  }, [forceUpdate, getColumnCellValue, validEditor.getColumnCellValue]);
+  return /*#__PURE__*/React.createElement(ErrorBoundary, null, /*#__PURE__*/React.createElement(SDocViewer, {
+    editor: validEditor,
+    scrollRef: scrollRef,
+    document: document,
+    showComment: false,
+    showToolbar: true,
+    showOutline: showOutline
+  }));
+};
+export default withTranslation('sdoc-editor')(DocumentPluginViewer);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@seafile/sdoc-editor",
-  "version": "0.5.65",
+  "version": "0.5.67beta",
   "private": false,
   "description": "This is a sdoc editor",
   "main": "dist/index.js",

package/public/index.html

@@ -1,21 +1,20 @@
 <!DOCTYPE html>
 <html lang="en">
-  <head>
-    <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
-    <meta name="theme-color" content="#000000">
-
-    <!--
+    <head>
+        <meta charset="utf-8">
+        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+        <meta name="theme-color" content="#000000">
+        <!--
       manifest.json provides metadata used when your web app is added to the
       homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/
     -->
-    <link rel="manifest" href="%PUBLIC_URL%/manifest.json">
-    <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
-
-  	<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
-    <link rel="stylesheet" type="text/css" href="%PUBLIC_URL%/media/sdoc-editor-font.css" />
-    <link rel="stylesheet" type="text/css" href="%PUBLIC_URL%/media/seafile-ui.css" />
-    <!--
+        <link rel="manifest" href="%PUBLIC_URL%/manifest.json">
+        <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
+        <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
+        <link rel="stylesheet" type="text/css" href="%PUBLIC_URL%/media/sdoc-editor-font.css">
+        <link rel="stylesheet" type="text/css" href="%PUBLIC_URL%/media/dtable-font.css">
+        <link rel="stylesheet" type="text/css" href="%PUBLIC_URL%/media/seafile-ui.css">
+        <!--
       Notice the use of %PUBLIC_URL% in the tags above.
       It will be replaced with the URL of the `public` folder during the build.
       Only files inside the `public` folder can be referenced from the HTML.
@@ -24,14 +23,14 @@
       work correctly both with client-side routing and a non-root public URL.
       Learn how to configure a non-root public URL by running `npm run build`.
     -->
-    <title>React App</title>
-  </head>
-  <body>
-    <noscript>
-      You need to enable JavaScript to run this app.
-    </noscript>
-    <div id="root"></div>
-    <!--
+        <title>React App</title>
+    </head>
+    <body>
+        <noscript>
+            You need to enable JavaScript to run this app.
+        </noscript>
+        <div id="root"></div>
+        <!--
       This HTML file is a template.
       If you open it directly in the browser, you will see an empty page.
 
@@ -41,5 +40,5 @@
       To begin the development, run `npm start` or `yarn start`.
       To create a production bundle, use `npm run build` or `yarn build`.
     -->
-  </body>
+    </body>
 </html>