@seafile/comment-editor 0.0.1-alpha.5 → 0.0.1-alpha.50

package/dist/basic-sdk/model/index.js

@@ -4,17 +4,10 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-Object.defineProperty(exports, "Notification", {
-  enumerable: true,
-  get: function () {
-    return _notification.default;
-  }
-});
 Object.defineProperty(exports, "User", {
   enumerable: true,
   get: function () {
     return _user.default;
   }
 });
-var _user = _interopRequireDefault(require("./user"));
-var _notification = _interopRequireDefault(require("./notification"));
+var _user = _interopRequireDefault(require("./user"));

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

@@ -0,0 +1,312 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.validateOperation = exports.syncRemoteOperations = exports.syncRemoteCursorLocation = exports.revertOperationList = exports.reExecRevertOperationList = exports.getRevertOperationList = exports.getNodePathById = void 0;
+var _slate = require("@seafile/slate");
+var _deepCopy = _interopRequireDefault(require("deep-copy"));
+var _helper = require("../cursor/helper");
+var _core = require("../extension/core");
+var OPERATION = _interopRequireWildcard(require("../node-id/constants"));
+const getNodePathById = function (rootNode, nodeId) {
+  let path = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [];
+  if (rootNode.id === nodeId) return path;
+  const {
+    children = []
+  } = rootNode;
+  for (let i = 0; i < children.length; i++) {
+    const child = children[i];
+    path.push(i);
+    const nodePath = getNodePathById(child, nodeId, path);
+    if (nodePath) return nodePath;
+    path.pop();
+  }
+  return null;
+};
+exports.getNodePathById = getNodePathById;
+const validateOperation = (editor, operation) => {
+  let isValid = false;
+  let newOperation = (0, _deepCopy.default)(operation);
+  const {
+    type
+  } = newOperation;
+  switch (type) {
+    case OPERATION.INSERT_TEXT:
+    case OPERATION.REMOVE_TEXT:
+      {
+        const {
+          node_id,
+          path
+        } = newOperation;
+        const node = (0, _core.getNode)(editor, path);
+        // node is exist and node path is not changed
+        if (node && node.id === node_id) {
+          isValid = true;
+          break;
+        }
+
+        // node is exist but node path is changed
+        const nodePath = getNodePathById(editor, node_id);
+        if (nodePath) {
+          isValid = true;
+          newOperation.path = nodePath;
+          break;
+        }
+        // node is not exist
+        isValid = false;
+        break;
+      }
+    case OPERATION.INSERT_NODE:
+      {
+        let {
+          parent_node_id,
+          path
+        } = newOperation;
+        const parentNodePath = getNodePathById(editor, parent_node_id);
+        if (!parentNodePath) {
+          isValid = false;
+          break;
+        }
+        const parentPath = path.slice(0, path.length - 1);
+        if (parentPath.join() === parentNodePath.join()) {
+          isValid = true;
+          break;
+        }
+
+        // reset insert node path
+        const parentNode = (0, _core.getNode)(editor, path);
+        if (parentNode) {
+          const childLength = parentNode.children.length;
+          const index = Math.min(path[path.length - 1], childLength);
+          newOperation.path = parentNodePath.concat([index]);
+          isValid = true;
+        }
+        break;
+      }
+    case OPERATION.REMOVE_NODE:
+      {
+        const {
+          node_id,
+          path
+        } = newOperation;
+        const node = (0, _core.getNode)(editor, path);
+        // node is exist and node path is not changed
+        if (node && node.id === node_id) {
+          isValid = true;
+          break;
+        }
+
+        // node is exist but node path is changed
+        const nodePath = getNodePathById(editor, node_id);
+        if (nodePath) {
+          isValid = true;
+          newOperation.path = nodePath;
+          break;
+        }
+
+        // node is not exist
+        isValid = false;
+        break;
+      }
+    case OPERATION.MERGE_NODE:
+      {
+        // merge next node into prev node
+        const {
+          node_id,
+          path
+        } = newOperation;
+        const node = (0, _core.getNode)(editor, path);
+        // node is exist and node path is not changed
+        if (node && node.id === node_id) {
+          isValid = true;
+          break;
+        }
+
+        // node is exist but node path is changed
+        const nodePath = getNodePathById(editor, node_id);
+        if (nodePath) {
+          isValid = true;
+          newOperation.path = nodePath;
+          break;
+        }
+
+        // node is not exist
+        isValid = false;
+        break;
+      }
+    case OPERATION.SPLIT_NODE:
+      {
+        const {
+          node_id,
+          path
+        } = newOperation;
+        const node = (0, _core.getNode)(editor, path);
+        // node is exist and node path is not changed
+        if (node && node.id === node_id) {
+          isValid = true;
+          break;
+        }
+
+        // node is exist but node path is changed
+        const nodePath = getNodePathById(editor, node_id);
+        if (nodePath) {
+          isValid = true;
+          newOperation.path = nodePath;
+          break;
+        }
+
+        // node is not exist
+        isValid = false;
+        break;
+      }
+    case OPERATION.SET_NODE:
+      {
+        const {
+          node_id,
+          path,
+          properties
+        } = newOperation;
+        const node = (0, _core.getNode)(editor, path);
+        // node is exist and node path is not changed
+        if (node && node.id === node_id) {
+          isValid = true;
+          newOperation.properties = {
+            ...properties,
+            type: node.type
+          };
+          break;
+        }
+
+        // node is exist but node path is changed
+        const nodePath = getNodePathById(editor, node_id);
+        if (nodePath) {
+          isValid = true;
+          const node = (0, _core.getNode)(editor, nodePath);
+          newOperation.properties = {
+            ...properties,
+            type: node.type
+          };
+          newOperation.path = nodePath;
+          break;
+        }
+
+        // node is not exist
+        isValid = false;
+        break;
+      }
+    case OPERATION.MOVE_NODE:
+      {
+        const {
+          node_id,
+          path
+        } = newOperation;
+        const node = (0, _core.getNode)(editor, path);
+        // node is exist and node path is not changed
+        if (node && node.id === node_id) {
+          isValid = true;
+          break;
+        }
+
+        // TODO: newPath can not calculate by nodePath
+        // node is exist but node path is changed
+        // const nodePath = getNodePathById(editor, node_id);
+        // if (nodePath) {}
+
+        // node is not exist
+        isValid = false;
+        break;
+      }
+    default:
+      {
+        // set_selection
+        break;
+      }
+  }
+  if (isValid) return newOperation;
+  return isValid;
+};
+exports.validateOperation = validateOperation;
+const getRevertOperationList = operationList => {
+  if (operationList.length === 0) return [];
+
+  // Generate a duplicate operationList, The original value cannot be modified here
+  let revertOperationList = (0, _deepCopy.default)(operationList);
+  revertOperationList = revertOperationList.reverse();
+  return revertOperationList.map(operations => {
+    const ops = operations.reverse();
+    return ops.map(item => _slate.Operation.inverse(item));
+  });
+};
+exports.getRevertOperationList = getRevertOperationList;
+const revertOperationList = (editor, operationList) => {
+  if (operationList.length === 0) return [];
+  const revertOperationList = getRevertOperationList(operationList);
+
+  // Cancel locale execute operations
+  for (let i = 0; i < revertOperationList.length; i++) {
+    const operations = revertOperationList[i];
+    _slate.Editor.withoutNormalizing(editor, () => {
+      for (let j = 0; j < operations.length; j++) {
+        const op = operations[j];
+        editor.apply(op);
+      }
+    });
+  }
+};
+exports.revertOperationList = revertOperationList;
+const reExecRevertOperationList = (editor, revertOperationList) => {
+  if (revertOperationList.length === 0) return;
+
+  // Re-execute revert operations
+  for (let i = 0; i < revertOperationList.length; i++) {
+    const operations = revertOperationList[i];
+    _slate.Editor.withoutNormalizing(editor, () => {
+      for (let j = 0; j < operations.length; j++) {
+        const op = validateOperation(editor, operations[j]);
+        if (op) {
+          editor.apply(op);
+        }
+      }
+    });
+  }
+};
+exports.reExecRevertOperationList = reExecRevertOperationList;
+const syncRemoteOperations = (editor, remoteOperations) => {
+  if (remoteOperations.length === 0) return;
+  _slate.Editor.withoutNormalizing(editor, () => {
+    for (let i = 0; i < remoteOperations.length; i++) {
+      const op = remoteOperations[i];
+      if (op.type === 'set_selection') {
+        continue;
+      }
+      editor.apply(op);
+    }
+  });
+};
+exports.syncRemoteOperations = syncRemoteOperations;
+const syncRemoteCursorLocation = (editor, user, location, cursorData) => {
+  const currentUser = editor.user;
+  if (user && user.username !== currentUser.username) {
+    // Get front Point as cursor
+    const {
+      anchor,
+      focus
+    } = location;
+    let newLocation = location;
+    if (!_slate.Point.equals(anchor, focus)) {
+      const frontPoint = _slate.Editor.start(editor, location);
+      newLocation = {
+        anchor: frontPoint,
+        focus: frontPoint
+      };
+    }
+    (0, _helper.setCursor)(editor, user, newLocation, cursorData);
+
+    // sync cursor position
+    editor.onCursor && editor.onCursor(editor.cursors);
+  }
+};
+exports.syncRemoteCursorLocation = syncRemoteCursorLocation;

package/dist/components/error-boundary/error-page.js

@@ -10,10 +10,10 @@ var _reactI18next = require("react-i18next");
 var _reactstrap = require("reactstrap");
 var _basicSdk = require("../../basic-sdk");
 require("./error-page.css");
-function ErrorPage(_ref) {
-  let {
+function ErrorPage() {
+  const {
     t
-  } = _ref;
+  } = (0, _reactI18next.useTranslation)('sdoc-editor');
   const normalizeSdoc = (0, _react.useCallback)(async () => {
     const res = await _basicSdk.context.normalizeSdocContent();
     const {
@@ -33,4 +33,4 @@ function ErrorPage(_ref) {
     onClick: () => normalizeSdoc()
   }, t('Repair')));
 }
-var _default = exports.default = (0, _reactI18next.withTranslation)('sdoc-editor')(ErrorPage);
+var _default = exports.default = ErrorPage;

package/dist/pages/seafile-comment-editor.js

@@ -8,35 +8,57 @@ exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _reactI18next = require("react-i18next");
 var _basicSdk = require("../basic-sdk");
+var _i18n = require("../_i18n");
 var _errorBoundary = _interopRequireDefault(require("../components/error-boundary"));
 const SeafileCommentEditor = _ref => {
   let {
-    pluginName = '',
-    className = '',
+    // Provider
     type,
-    commentContent,
-    hiddenUserInfo,
-    insertContent,
-    hiddenComment,
-    onContentChange,
+    // comment or replay
+    className = '',
+    pluginName = '',
+    // sdoc or wiki or txt ...
     pluginEventBus,
     pluginEvent,
+    // Comment editor
+    content,
+    insertContent,
+    onContentChange,
+    hiddenUserInfo,
+    hiddenComment,
+    toolMenus,
+    closePanel,
+    collaborators,
+    participants,
+    addParticipants,
+    // settings
+    settings,
     api
   } = _ref;
-  _basicSdk.context.init();
-  return /*#__PURE__*/_react.default.createElement(_errorBoundary.default, null, /*#__PURE__*/_react.default.createElement(_basicSdk.CommentProvider, {
-    pluginName: pluginName,
+  const {
+    lang
+  } = settings || {};
+  _basicSdk.context.init(settings, api);
+  return /*#__PURE__*/_react.default.createElement(_reactI18next.I18nextProvider, {
+    i18n: (0, _i18n.getI18n)(lang || 'en')
+  }, /*#__PURE__*/_react.default.createElement(_errorBoundary.default, null, /*#__PURE__*/_react.default.createElement(_basicSdk.CommentProvider, {
+    type: type,
     className: className,
+    pluginName: pluginName,
     pluginEventBus: pluginEventBus,
     pluginEvent: pluginEvent,
-    api: api
+    collaborators: collaborators,
+    participants: participants,
+    addParticipants: addParticipants
   }, /*#__PURE__*/_react.default.createElement(_basicSdk.CommentEditor, {
-    type: type,
-    commentContent: commentContent,
-    hiddenUserInfo: hiddenUserInfo,
+    content: content,
     insertContent: insertContent,
+    onContentChange: onContentChange,
+    hiddenUserInfo: hiddenUserInfo,
     hiddenComment: hiddenComment,
-    onContentChange: onContentChange
-  })));
+    toolMenus: toolMenus,
+    closePanel: closePanel,
+    addParticipants: addParticipants
+  }))));
 };
-var _default = exports.default = (0, _reactI18next.withTranslation)('sdoc-editor')(SeafileCommentEditor);
+var _default = exports.default = SeafileCommentEditor;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@seafile/comment-editor",
-  "version": "0.0.1-alpha.5",
+  "version": "0.0.1-alpha.50",
   "private": false,
   "description": "This is a comment editor",
   "main": "dist/index.js",
@@ -115,10 +115,10 @@
     "fs-extra": "^10.0.0",
     "html-webpack-plugin": "^5.5.0",
     "husky": "8.0.3",
-    "i18next": "22.4.9",
-    "i18next-browser-languagedetector": "7.0.1",
-    "i18next-xhr-backend": "3.2.2",
-    "identity-obj-proxy": "3.0.0",
+    "i18next": "^25.2.1",
+    "i18next-browser-languagedetector": "^8.1.0",
+    "i18next-http-backend": "^3.0.2",
+    "identity-obj-proxy": "^3.0.0",
     "is-wsl": "^1.1.0",
     "jest": "29.7.0",
     "jest-environment-jsdom": "29.7.0",
@@ -141,7 +141,7 @@
     "react-app-polyfill": "^3.0.0",
     "react-dev-utils": "^12.0.1",
     "react-dom": "18.3.1",
-    "react-i18next": "12.1.4",
+    "react-i18next": "15.5.2",
     "react-refresh": "^0.11.0",
     "react-router": "7.5.2",
     "react-router-dom": "7.1.3",

package/dist/basic-sdk/layout/comment-layout/index.css

@@ -1,15 +0,0 @@
-.comment-layout-wrapper {
-  display: flex;
-  flex-direction: row;
-  max-width: 620px;
-  min-width: 360px;
-  position: relative;
-  right: 0;
-}
-
-.comment-layout-wrapper .sdoc-content-right-panel {
-  width: 100%;
-  height: 100%;
-  overflow: hidden;
-  border-left: 1px solid #d8d8d8;
-}

package/dist/basic-sdk/layout/comment-layout/index.js

@@ -1,87 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _comment = _interopRequireDefault(require("../../comment"));
-var _constants = require("../../constants");
-var _useComment = require("../../hooks/use-comment");
-var _eventBus = _interopRequireDefault(require("../../utils/event-bus"));
-var _localStorageUtils = _interopRequireDefault(require("../../utils/local-storage-utils"));
-var _resizeWidth = _interopRequireDefault(require("./resize-width"));
-require("./index.css");
-const MIN_PANEL_WIDTH = 360;
-const MAX_PANEL_WIDTH = 620;
-const CommentLayout = _ref => {
-  let {
-    editor
-  } = _ref;
-  const {
-    className,
-    pluginName,
-    pluginEventBus,
-    pluginEvent
-  } = (0, _useComment.useComment)();
-  const [width, setWidth] = (0, _react.useState)(MIN_PANEL_WIDTH);
-  const panelWrapperStyle = (0, _react.useMemo)(() => {
-    if (!pluginName) return null;
-    let style = {
-      width,
-      zIndex: 101
-    };
-    if (!style.width || style.width < MIN_PANEL_WIDTH) {
-      style.width = MIN_PANEL_WIDTH;
-    } else if (style.width > MAX_PANEL_WIDTH) {
-      style.width = MAX_PANEL_WIDTH;
-    }
-    return style;
-  }, [width, pluginName]);
-  const resizeWidth = (0, _react.useCallback)(width => {
-    setWidth(width);
-  }, []);
-  const resizeWidthEnd = (0, _react.useCallback)(width => {
-    const settings = _localStorageUtils.default.getItem(_constants.SDOC_STORAGE) || {};
-    _localStorageUtils.default.setItem(_constants.SDOC_STORAGE, JSON.stringify({
-      ...settings,
-      panelWidth: width
-    }));
-    const eventBus = _eventBus.default.getInstance();
-    eventBus.dispatch(_constants.INTERNAL_EVENT.RESIZE_ARTICLE);
-  }, []);
-  (0, _react.useEffect)(() => {
-    const isShowGlobalComments = pluginName === 'sdoc' ? true : false;
-    const settings = _localStorageUtils.default.getItem(_constants.SDOC_STORAGE) || {};
-    _localStorageUtils.default.setItem(_constants.SDOC_STORAGE, {
-      ...settings,
-      isShowGlobalComments
-    });
-    const eventBus = pluginEventBus.getInstance();
-    eventBus.dispatch(pluginEvent.RESIZE_ARTICLE);
-  }, [pluginEvent.RESIZE_ARTICLE, pluginEventBus, pluginName]);
-  (0, _react.useEffect)(() => {
-    const settings = _localStorageUtils.default.getItem(_constants.SDOC_STORAGE) || {};
-    const {
-      panelWidth
-    } = settings;
-    const width = Math.max(MIN_PANEL_WIDTH, Math.min(parseInt(panelWidth, 10) || MIN_PANEL_WIDTH, MAX_PANEL_WIDTH));
-    setWidth(width);
-  }, []);
-  return /*#__PURE__*/_react.default.createElement("div", {
-    className: `comment-layout-wrapper ${className}`,
-    style: panelWrapperStyle
-  }, /*#__PURE__*/_react.default.createElement(_resizeWidth.default, {
-    minWidth: MIN_PANEL_WIDTH,
-    maxWidth: MAX_PANEL_WIDTH,
-    resizeWidth: resizeWidth,
-    resizeWidthEnd: resizeWidthEnd
-  }), /*#__PURE__*/_react.default.createElement(_comment.default, {
-    editor: editor,
-    type: "global",
-    width: width
-  }));
-};
-var _default = exports.default = CommentLayout;

package/dist/basic-sdk/layout/comment-layout/resize-width/index.css

@@ -1,38 +0,0 @@
-.comment-layout-resize-width-handler {
-  height: 100%;
-  position: absolute;
-  right: 0;
-  top: 0;
-  width: 6px;
-}
-
-.comment-layout-resize-width-handler.resize-handler-placement-right {
-  left: 0;
-  right: auto;
-}
-
-.comment-layout-resize-width-handler:hover {
-  cursor: col-resize;
-}
-
-.comment-layout-resize-width-handler .comment-layout-resize-width-handler-content {
-  background-color: initial;
-  height: 100%;
-  position: relative;
-  width: 2px;
-}
-
-.comment-layout-resize-width-handler:hover .comment-layout-resize-width-handler-content {
-  background-color: #ccc;
-}
-
-.comment-layout-resize-width-handler .comment-layout-resize-width-handler-bar {
-  background-color: #2d7ff9;
-  border-radius: 3px;
-  content: "";
-  left: 50%;
-  margin-left: -3px;
-  position: absolute;
-  width: 6px;
-}
-