@seafile/sdoc-editor 0.1.116 → 0.1.118

package/dist/basic-sdk/extension/plugins/sdoc-link/helpers.js

@@ -2,6 +2,7 @@ import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import { ReactEditor } from '@seafile/slate-react';
 import { Editor, Transforms, Range } from '@seafile/slate';
 import slugid from 'slugid';
+import copy from 'copy-to-clipboard';
 import context from '../../../../context';
 import { SDOC_LINK, LINK, INSERT_FILE_DISPLAY_TYPE } from '../../constants';
 import { getNodeType, getSelectedElems } from '../../core';
@@ -121,4 +122,18 @@ export var getNewFileListData = function getNewFileListData(fileListData, indexI
 };
 export var getUrl = function getUrl(uuid) {
   return context.getSdocLocalFileUrl(uuid);
+};
+export var onCopySdocLinkNode = function onCopySdocLinkNode(editor, element) {
+  if (editor.selection == null || Range.isExpanded(editor.selection)) return;
+  var p = ReactEditor.findPath(editor, element);
+  Transforms.select(editor, p);
+  var newData = editor.setFragmentData(new DataTransfer());
+  copy('copy', {
+    onCopy: function onCopy(clipboardData) {
+      newData.types.forEach(function (type) {
+        var data = newData.getData(type);
+        clipboardData.setData(type, data);
+      });
+    }
+  });
 };

package/dist/basic-sdk/extension/plugins/sdoc-link/menu/index.css

@@ -19,7 +19,7 @@
 .sdoc-link-menu .sdoc-link-menu-popover {
   position: absolute;
   top: 36px;
-  left: 0px;
+  left: -15px;
   padding: 8px 0;
   background-color: #fff;
   border: 1px solid #e5e6e8;
@@ -30,7 +30,7 @@
   align-items: flex-start;
   z-index: 101;
   white-space: nowrap;
-  width: 180px;
+  width: 138px;
 }
 
 .sdoc-link-menu .sdoc-link-menu-popover .sdoc-link-menu-item {
@@ -40,9 +40,9 @@
   user-select: none;
   display: flex;
   align-items: center;
-  font-size: 12px;
+  font-size: 14px;
   color: #212529;
-  padding-left: 24px;
+  padding-left: 5px;
 }
 
 .sdoc-link-menu .sdoc-link-menu-popover .sdoc-link-menu-item > span :first-child {

package/dist/basic-sdk/extension/plugins/sdoc-link/menu/index.js

@@ -1,6 +1,6 @@
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-import React, { useCallback, useState } from 'react';
+import React, { useCallback, useEffect, useState } from 'react';
 import { withTranslation } from 'react-i18next';
 import { SDOC_LINK, MENUS_CONFIG_MAP } from '../../../constants';
 import { MenuItem } from '../../../commons';
@@ -30,13 +30,13 @@ var SdocLinkMenu = function SdocLinkMenu(_ref) {
   }, []);
   var onInsertFileDialogToggle = useCallback(function () {
     setShowInsertPopover(true);
-    // setShowInsertDialog(!showInsertDialog);
   }, []);
-  var onMouseDown = useCallback(function () {
+  var onMouseDown = useCallback(function (e) {
+    e.stopPropagation();
     onInsertFileDialogToggle();
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
-  var onInsertSdocFile = useCallback(function () {
+  var onInsertSdocFile = useCallback(function (e) {
     setShowInsertPopover(false);
     setShowInsertDialog(true);
     // eslint-disable-next-line react-hooks/exhaustive-deps
@@ -44,6 +44,20 @@ var SdocLinkMenu = function SdocLinkMenu(_ref) {
   var onDialogToggle = useCallback(function (value) {
     setShowInsertDialog(value);
   }, []);
+  var onHidenInsertPopover = useCallback(function () {
+    setShowInsertPopover(false);
+  }, []);
+  useEffect(function () {
+    if (showInsertPopover) {
+      window.addEventListener('click', onHidenInsertPopover);
+    } else {
+      window.removeEventListener('click', onHidenInsertPopover);
+    }
+    return function () {
+      window.removeEventListener('click', onHidenInsertPopover);
+    };
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [showInsertPopover]);
   var menuConfig = MENUS_CONFIG_MAP[SDOC_LINK];
   var props = _objectSpread(_objectSpread({
     isRichEditor: isRichEditor,

package/dist/basic-sdk/extension/plugins/sdoc-link/menu/sdoc-link-hover-menu.js

@@ -2,37 +2,37 @@ import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import React, { useCallback, useState } from 'react';
 import { Transforms } from '@seafile/slate';
 import { ReactEditor } from '@seafile/slate-react';
-import copy from 'copy-to-clipboard';
 import { withTranslation } from 'react-i18next';
 import { ElementPopover } from '../../../commons';
 import toaster from '../../../../../components/toast';
-import { getUrl } from '../helpers';
+import { getUrl, onCopySdocLinkNode } from '../helpers';
 import './sdoc-link-hover-menu.css';
 var SdocLinkHoverMenu = function SdocLinkHoverMenu(_ref) {
   var editor = _ref.editor,
     menuPosition = _ref.menuPosition,
     element = _ref.element,
     onUnwrapFileLinkNode = _ref.onUnwrapFileLinkNode,
+    onHideInsertHoverMenu = _ref.onHideInsertHoverMenu,
     t = _ref.t;
   var _useState = useState(false),
     _useState2 = _slicedToArray(_useState, 2),
     isShowDisplayStylePopover = _useState2[0],
     setIsShowDisplayStylePopover = _useState2[1];
-  var onCopy = useCallback(function () {
-    copy(String(getUrl(element.doc_uuid)), {
-      format: 'text/plain'
-    });
+  var onCopy = useCallback(function (e) {
+    e.stopPropagation();
+    onCopySdocLinkNode(editor, element);
     toaster.success(t('Copied'), {
       hasCloseButton: false,
       duration: 2
     });
+    onHideInsertHoverMenu();
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
   var onShowProver = useCallback(function (e) {
-    e.stopPropagation();
     setIsShowDisplayStylePopover(true);
   }, []);
-  var onSelect = useCallback(function (value) {
+  var onSelect = useCallback(function (e, value) {
+    e.stopPropagation();
     var path = ReactEditor.findPath(editor, element);
     if (path) {
       Transforms.setNodes(editor, {
@@ -41,6 +41,7 @@ var SdocLinkHoverMenu = function SdocLinkHoverMenu(_ref) {
         at: path
       });
     }
+    onHideInsertHoverMenu();
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
   return /*#__PURE__*/React.createElement(ElementPopover, null, /*#__PURE__*/React.createElement("div", {
@@ -84,8 +85,8 @@ var SdocLinkHoverMenu = function SdocLinkHoverMenu(_ref) {
     className: "sdoc-file-display-style-popover"
   }, /*#__PURE__*/React.createElement("div", {
     className: "sdoc-file-display-style-item ".concat(element.display_type === 'text_link' ? 'active' : 'inactive'),
-    onClick: function onClick() {
-      onSelect('text_link');
+    onClick: function onClick(e) {
+      onSelect(e, 'text_link');
     }
   }, /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement("i", {
     className: "sdocfont sdoc-text-link"
@@ -93,8 +94,8 @@ var SdocLinkHoverMenu = function SdocLinkHoverMenu(_ref) {
     className: "sdocfont sdoc-check-mark"
   }))), /*#__PURE__*/React.createElement("div", {
     className: "sdoc-file-display-style-item ".concat(element.display_type === 'icon_link' ? 'active' : 'inactive'),
-    onClick: function onClick() {
-      onSelect('icon_link');
+    onClick: function onClick(e) {
+      onSelect(e, 'icon_link');
     }
   }, /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement("i", {
     className: "sdocfont sdoc-inline-link"
@@ -102,8 +103,8 @@ var SdocLinkHoverMenu = function SdocLinkHoverMenu(_ref) {
     className: "sdocfont sdoc-check-mark"
   }))), /*#__PURE__*/React.createElement("div", {
     className: "sdoc-file-display-style-item ".concat(element.display_type === 'card_link' ? 'active' : 'inactive'),
-    onClick: function onClick() {
-      onSelect('card_link');
+    onClick: function onClick(e) {
+      onSelect(e, 'card_link');
     }
   }, /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement("i", {
     className: "sdocfont sdoc-card-link"

package/dist/basic-sdk/extension/plugins/sdoc-link/render-elem.js

@@ -69,6 +69,7 @@ var SdocFileLink = function SdocFileLink(_ref) {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [isShowInsertHoverMenu]);
   var onClickFile = useCallback(function (e) {
+    e.stopPropagation();
     setPosition(e.currentTarget);
     setIsShowInsertHoverMenu(true);
     setTimeout(function () {
@@ -76,7 +77,7 @@ var SdocFileLink = function SdocFileLink(_ref) {
     }, 0);
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
-  var onHideInsertHoverMenu = useCallback(function () {
+  var onHideInsertHoverMenu = useCallback(function (e) {
     setIsShowInsertHoverMenu(false);
     unregisterEventHandle();
     // eslint-disable-next-line react-hooks/exhaustive-deps
@@ -107,7 +108,8 @@ var SdocFileLink = function SdocFileLink(_ref) {
     editor: editor,
     menuPosition: menuPosition,
     element: element,
-    onUnwrapFileLinkNode: onUnwrapFileLinkNode
+    onUnwrapFileLinkNode: onUnwrapFileLinkNode,
+    onHideInsertHoverMenu: onHideInsertHoverMenu
   }));
 };
 var renderSdocLink = function renderSdocLink(props, editor) {

package/dist/basic-sdk/socket/socket-manager.js

@@ -1,3 +1,4 @@
+import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
 import _createClass from "@babel/runtime/helpers/esm/createClass";
 import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
 import EventBus from '../utils/event-bus';
@@ -8,6 +9,10 @@ import { deleteCursor } from '../cursor/helper';
 var SocketManager = /*#__PURE__*/_createClass(function SocketManager(editor, document, config) {
   var _this = this;
   _classCallCheck(this, SocketManager);
+  this.getDocumentVersion = function () {
+    var version = _this.document.version;
+    return version;
+  };
   this.addOperations = function (operations) {
     _this.pendingOperationList.push(operations);
     if (_this.pendingOperationList.length > 5) {
@@ -15,10 +20,6 @@ var SocketManager = /*#__PURE__*/_createClass(function SocketManager(editor, doc
     }
     _this.sendOperations();
   };
-  this.getDocumentVersion = function () {
-    var version = _this.document.version;
-    return version;
-  };
   this.sendOperations = function () {
     if (_this.isSending || _this.pendingOperationList.length === 0) return;
     _this.isSending = true;
@@ -29,14 +30,17 @@ var SocketManager = /*#__PURE__*/_createClass(function SocketManager(editor, doc
       _this.isSending = false;
       return;
     }
+    if (_this._sendingOperations || _this.disconnect) return;
     _this.dispatchConnectState('is-saving');
     var version = _this.document.version;
     var operations = _this.pendingOperationList.shift();
     var selection = _this.editor.selection;
+    _this._sendingOperations = operations;
     _this.socketClient.sendOperations(operations, version, selection, _this.sendOperationsCallback);
   };
   this.sendOperationsCallback = function (result) {
     if (result && result.success) {
+      _this._sendingOperations = null;
       var serverVersion = result.version;
       _this.document['version'] = serverVersion;
       var lastSavedAt = new Date().getTime();
@@ -46,18 +50,25 @@ var SocketManager = /*#__PURE__*/_createClass(function SocketManager(editor, doc
     }
 
     // Operations are execute failure
-    var error_type = result.error_type,
-      operations = result.operations;
+    var error_type = result.error_type;
     if (error_type === 'version_behind_server') {
+      var dupSendingOperations = _toConsumableArray(_this._sendingOperations);
       // Put the failed operation into the pending list and re-execute it
-      _this.pendingOperationList.unshift(operations);
-      _this.sendNextOperations();
+      _this.pendingOperationList.unshift(dupSendingOperations);
+      var lose_operations = result.lose_operations;
+      _this.execLoseOperations(lose_operations);
     } else if (error_type === 'document_content_load_failed') {
+      _this._sendingOperations = null;
       // After a short-term reconnection, the content of the document fails to load
       _this.dispatchConnectState(error_type);
+    } else if (error_type === 'Internal_server_error') {
+      _this._sendingOperations = null;
+      _this.dispatchConnectState(error_type);
     } else if (error_type === 'operation_exec_error') {
+      var _dupSendingOperations = _toConsumableArray(_this._sendingOperations);
+      _this._sendingOperations = null;
       _this.editor.isRemote = true;
-      revertOperationList(_this.editor, [operations]);
+      revertOperationList(_this.editor, [_dupSendingOperations]);
 
       // reset control flag
       Promise.resolve().then(function (_) {
@@ -67,6 +78,51 @@ var SocketManager = /*#__PURE__*/_createClass(function SocketManager(editor, doc
       });
     }
   };
+  this.execLoseOperations = function (loseOperations) {
+    // 1. Revert operations
+    // 1.1 record reverted operationList & clear pendingOperationList
+    _this.revertOperationList = _this.pendingOperationList.slice();
+    _this.pendingOperationList = [];
+
+    // 1.2 Revert operationList
+    debug('revert locale operations: %O', _this.revertOperationList);
+    revertOperationList(_this.editor, _this.revertOperationList);
+    _this.editor.isRemote = true;
+    loseOperations = loseOperations.sort(function (prev, next) {
+      return prev.version - next.version;
+    });
+    debug('Editor isRemote is true: %s', _this.editor.isRemote);
+    while (loseOperations.length > 0) {
+      var operationParams = loseOperations.shift();
+      // 2. execute operations
+      var operations = operationParams.operations,
+        serverVersion = operationParams.version;
+      // 2.1 Update content & version
+      debug('execute remote operations: %O', operations);
+      syncRemoteOperations(_this.editor, operations);
+
+      // 2.2 Update document
+      _this.document.version = serverVersion;
+      _this.document.children = _this.editor.children;
+    }
+
+    // Re-execute undone operations after isRemote is set to false
+    // Need resend this operations to server
+
+    // reset execute remote operations flag
+    _this.editor.isRemote = false;
+    _this.isSending = false;
+    _this._sendingOperations = null;
+
+    // 3. Execute pending operations
+    // 3.1 Re-execute operations
+    debug('Editor isRemote is false: %s', _this.editor.isRemote);
+    debug('Re-execute pending operations, %O', _this.revertOperationList);
+    reExecRevertOperationList(_this.editor, _this.revertOperationList);
+
+    // 3.2 Clear revert operationList
+    _this.revertOperationList = [];
+  };
   this.receiveOperations = function (params) {
     _this.remoteOperationsList.push(params);
     // sort operations by version
@@ -74,17 +130,17 @@ var SocketManager = /*#__PURE__*/_createClass(function SocketManager(editor, doc
       _this.remoteOperationsList = _this.remoteOperationsList.sort(function (prev, next) {
         return prev.version - next.version;
       });
+      var clientVersion = _this.document.version;
+      _this.remoteOperationsList = _this.remoteOperationsList.filter(function (item) {
+        return item.version > clientVersion;
+      });
     }
-    if (_this.isExecRemoteOperations) return;
+    if (_this.isExecRemoteOperations || _this._sendingOperations) return;
+
+    // update execute remote operations flag
     _this.isExecRemoteOperations = true;
     _this.editor.isRemote = true;
     _this.execRemoteOperations();
-
-    // reset control flag
-    Promise.resolve().then(function (_) {
-      _this.isExecRemoteOperations = false;
-      _this.editor.isRemote = false;
-    });
   };
   this.execRemoteOperations = function () {
     if (_this.remoteOperationsList.length > 0) {
@@ -123,11 +179,14 @@ var SocketManager = /*#__PURE__*/_createClass(function SocketManager(editor, doc
         // Re-execute undone operations after isRemote is set to false
         // Need resend this operations to server
         Promise.resolve().then(function (_) {
-          debug('Editor isRemote is false: %s', _this.editor.isRemote);
-          debug('Re-execute pending operations, %O', _this.revertOperationList);
+          // reset execute remote operations flag
+          _this.isExecRemoteOperations = false;
+          _this.editor.isRemote = false;
 
           // 3. Execute pending operations
           // 3.1 Re-execute operations
+          debug('Editor isRemote is false: %s', _this.editor.isRemote);
+          debug('Re-execute pending operations, %O', _this.revertOperationList);
           reExecRevertOperationList(_this.editor, _this.revertOperationList);
 
           // 3.2 Clear revert operationList
@@ -168,15 +227,11 @@ var SocketManager = /*#__PURE__*/_createClass(function SocketManager(editor, doc
     // sync operations
     // content is [{version, operations}, {version, operations}, ...]
     _this.remoteOperationsList = content;
+
+    // update execute remote operations flag
     _this.isExecRemoteOperations = true;
     _this.editor.isRemote = true;
     _this.execRemoteOperations();
-
-    // reset control flag
-    Promise.resolve().then(function (_) {
-      _this.isExecRemoteOperations = false;
-      _this.editor.isRemote = false;
-    });
   };
   this.sendCursorLocation = function (location) {
     _this.socketClient.sendCursorLocation(location);
@@ -193,6 +248,21 @@ var SocketManager = /*#__PURE__*/_createClass(function SocketManager(editor, doc
       deleteCursor(_this.editor, message);
       _this.editor.onCursor && _this.editor.onCursor(_this.editor.cursors);
     }
+    if (type === 'disconnect') {
+      if (_this._sendingOperations) {
+        _this.pendingOperationList.unshift(_this._sendingOperations.slice());
+        _this._sendingOperations = null;
+      }
+      _this.isSending = false;
+      _this.disconnect = true;
+
+      // Update saved state
+      var lastSavedAt = new Date().getTime();
+      _this.dispatchConnectState('saved', lastSavedAt);
+    }
+    if (type === 'reconnect') {
+      _this.disconnect = false;
+    }
     _this.eventBus.dispatch(type, message);
   };
   this.closeSocketConnect = function () {

package/dist/components/tip-message/index.js

@@ -39,6 +39,14 @@ var TipMessage = /*#__PURE__*/function (_React$Component) {
         duration: null
       });
     };
+    _this.onOperationsSaveError = function () {
+      var t = _this.props.t;
+      var message = t('Operations_save_error_tip');
+      toaster.danger(message, {
+        hasCloseButton: false,
+        duration: null
+      });
+    };
     _this.onDisconnect = function () {
       var _this$props = _this.props,
         t = _this$props.t,
@@ -138,6 +146,7 @@ var TipMessage = /*#__PURE__*/function (_React$Component) {
       this.unsubscribeOpExecError = eventBus.subscribe('operation_exec_error', this.onOperationExecuteError);
       this.unsubscribePendingOpExceedLimit = eventBus.subscribe('pending_operations_exceed_limit', this.onPendingOpExceedLimit);
       this.unsubscribeDocumentLoadError = eventBus.subscribe('document_content_load_failed', this.onDocumentLoadError);
+      this.unsubscribeOperationsSaveError = eventBus.subscribe('Internal_server_error', this.onOperationsSaveError);
     }
   }, {
     key: "componentWillUnmount",

package/dist/pages/simple-editor.js

@@ -141,7 +141,7 @@ var SimpleEditor = function SimpleEditor(_ref) {
     className: "error-page"
   }, /*#__PURE__*/React.createElement("div", {
     className: "error-tip"
-  }, t(errorMessage))), !isLoadingSdoc && /*#__PURE__*/React.createElement(React.Fragment, null, isShowChanges ? /*#__PURE__*/React.createElement(DiffViewer, {
+  }, t(errorMessage))), !isLoadingSdoc && !errorMessage && /*#__PURE__*/React.createElement(React.Fragment, null, isShowChanges ? /*#__PURE__*/React.createElement(DiffViewer, {
     currentContent: currentContent,
     lastContent: lastContent
   }) : /*#__PURE__*/React.createElement(SDocEditor, {

package/package.json

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

package/public/locales/en/sdoc-editor.json

@@ -349,5 +349,6 @@
   "Icon_and_text_Link": "Icon and text Link",
   "Card": "Card",
   "Select_sdoc_document": "Select sdoc document",
-  "Local_file": "Local file"
+  "Local_file": "Local file",
+  "Operations_save_error_tip": "Operation execution failed, internal server error, please refresh the page"
 }

package/public/locales/zh-CN/sdoc-editor.json

@@ -351,5 +351,6 @@
   "Icon_and_text_Link": "图标+文字链",
   "Card": "卡片",
   "Select_sdoc_document": "选择sdoc文档",
-  "Local_file": "本地文件"
+  "Local_file": "本地文件",
+  "Operations_save_error_tip": "操作执行失败，服务器内部错误，请刷新页面"
 }