cleanup context and get everything from Map

editors/demo/src/Editoria/config/config.js

@@ -304,9 +304,9 @@ export default {
   },
   YjsService: {
     // eslint-disable-next-line no-restricted-globals
-    // connectionUrl: 'ws://localhost:5010',
-    connectionUrl: 'ws://0.tcp.ap.ngrok.io:17607',
-    docIdentifier: 'prosemirror-demo1',
+    connectionUrl: 'ws://localhost:5010',
+    // connectionUrl: 'ws://0.tcp.ap.ngrok.io:17607',
+    docIdentifier: 'prosemirror-demo7',
     YjsType: 'prosemirror',
   },
 

wax-prosemirror-services/src/CommentsService/CommentsService.js

@@ -11,11 +11,6 @@ export default class CommentsService extends Service {
   boot() {
     const commentsConfig = this.app.config.get('config.CommentsService');
 
-    this.app.PmPlugins.add(
-      'commentPlugin',
-      CommentPlugin('commentPlugin', this.app.context),
-    );
-
     const options = {
       existingComments: () => {
         const map = this.app.config.get('config.YjsService')
@@ -52,7 +47,6 @@ export default class CommentsService extends Service {
         }
 
         commentsConfig.getComments(this.allCommentsFromStates);
-        this.app.context.setOption({ comments: this.allCommentsFromStates });
       },
     };
 
@@ -61,6 +55,11 @@ export default class CommentsService extends Service {
       CommentDecorationPlugin('commentDecorationPlugin', options),
     );
 
+    this.app.PmPlugins.add(
+      'commentPlugin',
+      CommentPlugin('commentPlugin', this.app.context),
+    );
+
     const createOverlay = this.container.get('CreateOverlay');
     const layout = this.container.get('Layout');
     createOverlay(

wax-prosemirror-services/src/CommentsService/components/ConnectedComment.js

@@ -32,7 +32,6 @@ export default ({ comment, top, commentId, recalculateTops, users }) => {
     },
     app,
     activeView,
-    options: { commentsMap },
   } = context;
 
   const [isActive, setIsActive] = useState(false);
@@ -118,20 +117,6 @@ export default ({ comment, top, commentId, recalculateTops, users }) => {
 
     dispatch(state.tr);
     activeView.focus();
-
-    if (context.app.config.get('config.YjsService')) {
-      commentsMap.observe(() => {
-        const transaction = context.pmViews.main.state.tr.setMeta(
-          CommentDecorationPluginKey,
-          {
-            type: 'deleteComment',
-            id: activeComment.id,
-          },
-        );
-
-        context.pmViews.main.dispatch(transaction);
-      });
-    }
   };
 
   const onTextAreaBlur = () => {

wax-prosemirror-services/src/CommentsService/components/ui/comments/CommentBubbleComponent.js

 /* eslint react/prop-types: 0 */
-import React, { useLayoutEffect, useContext, useEffect, useState } from 'react';
+import React, { useLayoutEffect, useContext } from 'react';
 import { WaxContext } from 'wax-prosemirror-core';
-import {
-  ySyncPluginKey,
-  relativePositionToAbsolutePosition,
-  absolutePositionToRelativePosition,
-} from 'y-prosemirror';
-
 import CommentBubble from './CommentBubble';
 import { CommentDecorationPluginKey } from '../../../plugins/CommentDecorationPlugin';
 
 const CommentBubbleComponent = ({ setPosition, position, group }) => {
   const context = useContext(WaxContext);
-  const {
-    activeView,
-    activeViewId,
-    options: { comments },
-  } = context;
+  const { activeView, activeViewId } = context;
   const { state, dispatch } = activeView;
-  const [fromPos, setFromPos] = useState(state.selection.from);
-  const [toPos, setToPos] = useState(state.selection.to);
 
   useLayoutEffect(() => {
     const WaxSurface = activeView.dom.getBoundingClientRect();
@@ -73,17 +61,21 @@ const CommentBubbleComponent = ({ setPosition, position, group }) => {
         }
       },
     );
-
-    if (
-      comments.find(
-        comm =>
-          comm.data.pmFrom === state.selection.from &&
-          comm.data.pmTo === state.selection.to,
-      )
-    ) {
-      allowed = false;
-    }
-
+    const commentsMap = CommentDecorationPluginKey.getState(state).getMap();
+    const commentData = [];
+    commentsMap.forEach(comment => {
+      console.log(comment);
+      if (
+        comment.data.pmFrom === state.selection.from &&
+        comment.data.pmTo === state.selection.to
+      ) {
+        console.log('here');
+        commentData.push(comment);
+      }
+      console.log(commentData);
+      if (commentData.length !== 0) allowed = false;
+      console.log(allowed);
+    });
     return allowed;
   };
 

wax-prosemirror-services/src/CommentsService/plugins/CommentPlugin.js

@@ -2,17 +2,21 @@
 import { inRange, last, sortBy } from 'lodash';
 import { Plugin, PluginKey } from 'prosemirror-state';
 import { Decoration, DecorationSet } from 'prosemirror-view';
+import { CommentDecorationPluginKey } from './CommentDecorationPlugin';
 
 const commentPlugin = new PluginKey('commentPlugin');
 
-const getComment = (state, context) => {
-  const {
-    options: { comments },
-  } = context;
-  if (!comments?.length) return;
-  let commentData = comments.filter(comment =>
-    inRange(state.selection.from, comment.data.pmFrom, comment.data.pmTo),
-  );
+const getComment = state => {
+  const commentsMap = CommentDecorationPluginKey.getState(state).getMap();
+
+  if (commentsMap.size === 0) return;
+  let commentData = [];
+
+  commentsMap.forEach(comment => {
+    if (inRange(state.selection.from, comment.data.pmFrom, comment.data.pmTo)) {
+      commentData.push(comment);
+    }
+  });
 
   commentData = sortBy(commentData, ['data.pmFrom']);
   if (commentData.length > 0) {
@@ -29,15 +33,15 @@ const getComment = (state, context) => {
   return undefined;
 };
 
-export default (key, context) => {
+export default () => {
   return new Plugin({
     key: commentPlugin,
     state: {
       init: (_, state) => {
-        return { comment: getComment(state, context) };
+        return { comment: getComment(state) };
       },
       apply(tr, prev, _, newState) {
-        const comment = getComment(newState, context);
+        const comment = getComment(newState);
         let createDecoration;
         if (comment) {
           createDecoration = DecorationSet.create(newState.doc, [

wax-prosemirror-services/src/CommentsService/plugins/CommentState.js

@@ -157,15 +157,6 @@ export default class CommentState {
           ystate.binding.mapping,
         );
 
-        console.log(
-          relativePositionToAbsolutePosition(
-            ystate.doc,
-            ystate.type,
-            newTo,
-            ystate.binding.mapping,
-          ),
-        );
-
         const annotation = this.options.map.get(id);
 
         annotation.from = newFrom;