@atlaskit/editor-plugin-annotation 2.8.3 → 2.9.0

package/dist/es2019/pm-plugins/plugin-factory.js

@@ -1,6 +1,7 @@
 import { pluginFactory } from '@atlaskit/editor-common/utils';
 import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
 import { DecorationSet } from '@atlaskit/editor-prosemirror/view';
+import { fg } from '@atlaskit/platform-feature-flags';
 import reducer from './reducer';
 import { decorationKey, findAnnotationsInSelection, inlineCommentPluginKey, isBlockNodeAnnotationsSelected, isSelectedAnnotationsChanged } from './utils';
 const handleDocChanged = (tr, prevPluginState) => {
@@ -17,6 +18,10 @@ const handleDocChanged = (tr, prevPluginState) => {
  * We clear bookmark on the following conditions:
  * 1. if current selection is an empty selection, or
  * 2. if the current selection and bookmark selection are different
+ * @param tr
+ * @param editorState
+ * @param bookmark
+ * @example
  */
 export const shouldClearBookMarkCheck = (tr, editorState, bookmark) => {
   if (editorState.selection.empty || !bookmark) {
@@ -44,7 +49,7 @@ export const shouldClearBookMarkCheck = (tr, editorState, bookmark) => {
   // by default we discard bookmark
   return true;
 };
-const getSelectionChangedHandler = reopenCommentView => (tr, pluginState) => {
+const getSelectionChangeHandlerOld = reopenCommentView => (tr, pluginState) => {
   if (pluginState.skipSelectionHandling) {
     return {
       ...pluginState,
@@ -92,6 +97,51 @@ const getSelectionChangedHandler = reopenCommentView => (tr, pluginState) => {
     selectAnnotationMethod: undefined
   };
 };
+const getSelectionChangeHandlerNew = reopenCommentView => (tr, pluginState) => {
+  if (pluginState.skipSelectionHandling) {
+    return {
+      ...pluginState,
+      skipSelectionHandling: false,
+      ...(reopenCommentView && {
+        isInlineCommentViewClosed: false
+      })
+    };
+  }
+  const selectedAnnotations = findAnnotationsInSelection(tr.selection, tr.doc);
+
+  // NOTE: I've left this commented code here as a reference that the previous old code would reset the selected annotations
+  // if the selection is empty. If this is no longer needed, we can remove this code.
+  // clean up with platform_editor_comments_api_manager_select
+  // if (selectedAnnotations.length === 0) {
+  // 	return {
+  // 		...pluginState,
+  // 		pendingSelectedAnnotations: selectedAnnotations,
+  // 		pendingSelectedAnnotationsUpdateCount:
+  // 			pluginState.pendingSelectedAnnotationsUpdateCount + 1,
+  // 		isInlineCommentViewClosed: true,
+  // 		selectAnnotationMethod: undefined,
+  // 	};
+  // }
+
+  if (isSelectedAnnotationsChanged(selectedAnnotations, pluginState.pendingSelectedAnnotations)) {
+    return {
+      ...pluginState,
+      pendingSelectedAnnotations: selectedAnnotations,
+      pendingSelectedAnnotationsUpdateCount: pluginState.pendingSelectedAnnotationsUpdateCount + 1,
+      ...(reopenCommentView && {
+        isInlineCommentViewClosed: false
+      })
+    };
+  }
+  return {
+    ...pluginState,
+    ...(reopenCommentView && {
+      isInlineCommentViewClosed: false
+    }),
+    selectAnnotationMethod: undefined
+  };
+};
+const getSelectionChangedHandler = reopenCommentView => (tr, pluginState) => fg('platform_editor_comments_api_manager_select') ? getSelectionChangeHandlerNew(reopenCommentView)(tr, pluginState) : getSelectionChangeHandlerOld(reopenCommentView)(tr, pluginState);
 export const {
   createPluginState,
   createCommand

package/dist/es2019/pm-plugins/reducer.js

@@ -34,6 +34,9 @@ export default ((pluginState, action) => {
         isOpeningMediaCommentFromToolbar: false,
         ...(fg('platform_editor_annotation_selected_annotation') && {
           selectedAnnotations: []
+        }),
+        ...(fg('platform_editor_comments_api_manager_select') && {
+          selectedAnnotations: []
         })
       };
     case ACTIONS.ADD_INLINE_COMMENT:
@@ -46,7 +49,10 @@ export default ((pluginState, action) => {
           ...action.data.inlineComments
         },
         isInlineCommentViewClosed: false,
-        selectAnnotationMethod: undefined
+        selectAnnotationMethod: undefined,
+        ...(fg('platform_editor_comments_api_manager_select') && {
+          skipSelectionHandling: true
+        })
       };
     case ACTIONS.INLINE_COMMENT_SET_VISIBLE:
       const {
@@ -75,6 +81,21 @@ export default ((pluginState, action) => {
         skipSelectionHandling: true,
         isInlineCommentViewClosed: false
       };
+    case ACTIONS.FLUSH_PENDING_SELECTIONS:
+      return {
+        ...pluginState,
+        selectedAnnotations: action.data.canSetAsSelectedAnnotations ? [...pluginState.pendingSelectedAnnotations] : pluginState.selectedAnnotations,
+        pendingSelectedAnnotations: [],
+        isInlineCommentViewClosed: false
+      };
+    case ACTIONS.SET_PENDING_SELECTIONS:
+      return {
+        ...pluginState,
+        pendingSelectedAnnotations: [...action.data.selectedAnnotations],
+        pendingSelectedAnnotationsUpdateCount: pluginState.pendingSelectedAnnotationsUpdateCount + 1,
+        skipSelectionHandling: true,
+        isInlineCommentViewClosed: false
+      };
     default:
       return pluginState;
   }

package/dist/es2019/pm-plugins/toolbar.js

@@ -135,7 +135,7 @@ export const buildToolbar = editorAnalyticsAPI => ({
       }
       if (fg('platform_editor_comments_api_manager')) {
         if (!annotationManager) {
-          // TODO: EDITOR-188 - If we've reached here and the manager is not initialized, we should
+          // TODO: EDITOR-595 - If we've reached here and the manager is not initialized, we should
           // dispatch an analytics event to indicate that the user has clicked the button but
           // the action was not completed.
           return false;
@@ -149,17 +149,19 @@ export const buildToolbar = editorAnalyticsAPI => ({
               }
             });
             createCommentExperience === null || createCommentExperience === void 0 ? void 0 : createCommentExperience.initExperience.start();
-            const {
-              success
-            } = annotationManager.startDraft();
-            if (!success) {
-              // TODO: EDITOR-188 - Report start draft attempt failed.
+            const result = annotationManager.startDraft();
+            if (result.success) {
+              // TODO: EDITOR-595 - Ensure and anlytic is fired to indicate that the user has started a draft.
+            } else {
+              // TODO: EDITOR-595 - Fire an analytics event to indicate that the user has clicked the button
+              // but the action was not completed, the result should contain a reason.
             }
           } else {
-            // TODO: EDITOR-188 - Dispatch analytics event
+            // TODO: EDITOR-595 - Track the toolbar comment button was clicked but the preemptive gate
+            // check returned false and the draft cannot be started.
           }
         }).catch(() => {
-          // TODO: EDITOR-188 - Handle preemptive gate check error and dispatch analytics event
+          // TODO: EDITOR-595 - Handle preemptive gate check error. Something went very wrong in the gate.
         });
         return true;
       } else {

package/dist/es2019/pm-plugins/types.js

@@ -8,5 +8,7 @@ export let ACTIONS = /*#__PURE__*/function (ACTIONS) {
   ACTIONS[ACTIONS["CLOSE_COMPONENT"] = 6] = "CLOSE_COMPONENT";
   ACTIONS[ACTIONS["SET_SELECTED_ANNOTATION"] = 7] = "SET_SELECTED_ANNOTATION";
   ACTIONS[ACTIONS["SET_HOVERED_ANNOTATION"] = 8] = "SET_HOVERED_ANNOTATION";
+  ACTIONS[ACTIONS["FLUSH_PENDING_SELECTIONS"] = 9] = "FLUSH_PENDING_SELECTIONS";
+  ACTIONS[ACTIONS["SET_PENDING_SELECTIONS"] = 10] = "SET_PENDING_SELECTIONS";
   return ACTIONS;
 }({});

package/dist/esm/editor-commands/index.js

@@ -44,6 +44,25 @@ export var clearDirtyMark = function clearDirtyMark() {
     type: ACTIONS.INLINE_COMMENT_CLEAR_DIRTY_MARK
   });
 };
+export var flushPendingSelections = function flushPendingSelections(canSetAsSelectedAnnotations) {
+  return createCommand({
+    type: ACTIONS.FLUSH_PENDING_SELECTIONS,
+    data: {
+      canSetAsSelectedAnnotations: canSetAsSelectedAnnotations
+    }
+  });
+};
+export var setPendingSelectedAnnotation = function setPendingSelectedAnnotation(id) {
+  return createCommand({
+    type: ACTIONS.SET_PENDING_SELECTIONS,
+    data: {
+      selectedAnnotations: [{
+        id: id,
+        type: AnnotationTypes.INLINE_COMMENT
+      }]
+    }
+  });
+};
 var removeInlineCommentFromNode = function removeInlineCommentFromNode(id) {
   var supportedBlockNodes = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
   var state = arguments.length > 2 ? arguments[2] : undefined;
@@ -105,6 +124,34 @@ export var removeInlineCommentNearSelection = function removeInlineCommentNearSe
     return true;
   };
 };
+export var removeInlineCommentFromDoc = function removeInlineCommentFromDoc(id) {
+  var supportedNodes = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
+  return function (state, dispatch) {
+    var tr = state.tr;
+    state.doc.descendants(function (node, pos) {
+      // Inline comment on mediaInline is not supported as part of comments on media project
+      // Thus, we skip the decoration for mediaInline node
+      if (node.type.name === 'mediaInline') {
+        return false;
+      }
+      var isSupportedBlockNode = node.isBlock && (supportedNodes === null || supportedNodes === void 0 ? void 0 : supportedNodes.includes(node.type.name));
+      node.marks.filter(function (mark) {
+        return mark.type === state.schema.marks.annotation && mark.attrs.id === id;
+      }).forEach(function (mark) {
+        if (isSupportedBlockNode) {
+          tr.removeNodeMark(pos, mark);
+        } else {
+          tr.removeMark(pos, pos + node.nodeSize, mark);
+        }
+      });
+    });
+    if (dispatch) {
+      dispatch(tr);
+      return true;
+    }
+    return false;
+  };
+};
 var getDraftCommandAction = function getDraftCommandAction(drafting, targetType, targetNodeId, supportedBlockNodes, isOpeningMediaCommentFromToolbar) {
   return function (editorState) {
     // validate selection only when entering draft mode
@@ -128,6 +175,8 @@ var getDraftCommandAction = function getDraftCommandAction(drafting, targetType,
 /**
  * Show active inline comments for a given block node, otherwise,
  * return false if the node has no comments or no unresolved comments.
+ * @param supportedBlockNodes
+ * @example
  */
 export var showInlineCommentForBlockNode = function showInlineCommentForBlockNode() {
   var supportedBlockNodes = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];

package/dist/esm/pm-plugins/annotation-manager-hooks.js

@@ -1,13 +1,15 @@
 import { AnnotationTypes } from '@atlaskit/adf-schema';
-import { getRangeInlineNodeNames } from '@atlaskit/editor-common/utils';
+import { getAnnotationInlineNodeTypes, getRangeInlineNodeNames } from '@atlaskit/editor-common/utils';
 import { findDomRefAtPos } from '@atlaskit/editor-prosemirror/utils';
-import { setInlineCommentDraftState, createAnnotation } from '../editor-commands';
+import { fg } from '@atlaskit/platform-feature-flags';
+import { setInlineCommentDraftState, createAnnotation, setSelectedAnnotation, closeComponent, setHoveredAnnotation, removeInlineCommentFromDoc } from '../editor-commands';
 import { AnnotationSelectionType } from '../types';
 import { inlineCommentPluginKey, isSelectionValid } from './utils';
 var ERROR_REASON_DRAFT_NOT_STARTED = 'draft-not-started';
 var ERROR_REASON_DRAFT_IN_PROGRESS = 'draft-in-progress';
 var ERROR_REASON_RANGE_MISSING = 'range-no-longer-exists';
 var ERROR_REASON_RANGE_INVALID = 'invalid-range';
+var ERROR_REASON_ID_INVALID = 'id-not-valid';
 var domRefFromPos = function domRefFromPos(view, position) {
   var dom;
   try {
@@ -40,15 +42,34 @@ export var allowAnnotation = function allowAnnotation(editorView, options) {
 };
 export var startDraft = function startDraft(editorView, options) {
   return function () {
-    var _getRangeInlineNodeNa, _options$annotationMa;
+    var _getRangeInlineNodeNa, _options$annotationMa2;
     var _ref2 = inlineCommentPluginKey.getState(editorView.state) || {},
-      isDrafting = _ref2.isDrafting;
+      isDrafting = _ref2.isDrafting,
+      selectedAnnotations = _ref2.selectedAnnotations;
     if (isDrafting) {
       return {
         success: false,
         reason: ERROR_REASON_DRAFT_IN_PROGRESS
       };
     }
+    if (!!(selectedAnnotations !== null && selectedAnnotations !== void 0 && selectedAnnotations.length) && fg('platform_editor_comments_api_manager_select')) {
+      // if there are selected annotations when starting a draft, we need to clear the selected annotations
+      // before we start the draft.
+      closeComponent()(editorView.state, editorView.dispatch);
+
+      // not only that but we need to also deselect any other annotations that are currently selected.
+      selectedAnnotations === null || selectedAnnotations === void 0 || selectedAnnotations.forEach(function (annotation) {
+        var _options$annotationMa, _getAnnotationInlineN;
+        (_options$annotationMa = options.annotationManager) === null || _options$annotationMa === void 0 || _options$annotationMa.emit({
+          name: 'annotationSelectionChanged',
+          data: {
+            annotationId: annotation.id,
+            isSelected: false,
+            inlineNodeTypes: (_getAnnotationInlineN = getAnnotationInlineNodeTypes(editorView.state, annotation.id)) !== null && _getAnnotationInlineN !== void 0 ? _getAnnotationInlineN : []
+          }
+        });
+      });
+    }
     setInlineCommentDraftState(options.editorAnalyticsAPI)(true)(editorView.state, editorView.dispatch);
     var _ref3 = inlineCommentPluginKey.getState(editorView.state) || {},
       draftDecorationSet = _ref3.draftDecorationSet;
@@ -70,7 +91,7 @@ export var startDraft = function startDraft(editorView, options) {
         to: decorations[decorations.length - 1].to
       }
     })) !== null && _getRangeInlineNodeNa !== void 0 ? _getRangeInlineNodeNa : [];
-    (_options$annotationMa = options.annotationManager) === null || _options$annotationMa === void 0 || _options$annotationMa.emit({
+    (_options$annotationMa2 = options.annotationManager) === null || _options$annotationMa2 === void 0 || _options$annotationMa2.emit({
       name: 'draftAnnotationStarted',
       data: {
         targetElement: targetElement,
@@ -114,6 +135,7 @@ export var clearDraft = function clearDraft(editorView, options) {
 };
 export var applyDraft = function applyDraft(editorView, options) {
   return function (id) {
+    var _options$annotationMa3, _getAnnotationInlineN2;
     var _ref5 = inlineCommentPluginKey.getState(editorView.state) || {},
       isDrafting = _ref5.isDrafting,
       draftDecorationSet = _ref5.draftDecorationSet,
@@ -138,6 +160,17 @@ export var applyDraft = function applyDraft(editorView, options) {
     // Using the original decoration from position we should be able to locate the new target element.
     // This is because the new annotation will be created at the same position as the draft decoration.
     var targetElement = domRefFromPos(editorView, from);
+
+    // When a draft is applied it is automatically selected, so we need to set the selected annotation.
+    // emit the event for the selected annotation.
+    (_options$annotationMa3 = options.annotationManager) === null || _options$annotationMa3 === void 0 || _options$annotationMa3.emit({
+      name: 'annotationSelectionChanged',
+      data: {
+        annotationId: id,
+        isSelected: true,
+        inlineNodeTypes: (_getAnnotationInlineN2 = getAnnotationInlineNodeTypes(editorView.state, id)) !== null && _getAnnotationInlineN2 !== void 0 ? _getAnnotationInlineN2 : []
+      }
+    });
     return {
       success: true,
       // Get the dom element from the newly created annotation and return it here.
@@ -182,4 +215,133 @@ export var getDraft = function getDraft(editorView, options) {
       actionResult: undefined
     };
   };
+};
+export var setIsAnnotationSelected = function setIsAnnotationSelected(editorView, options) {
+  return function (id, isSelected) {
+    var _selectedAnnotations$;
+    var _ref7 = inlineCommentPluginKey.getState(editorView.state) || {},
+      annotations = _ref7.annotations,
+      isDrafting = _ref7.isDrafting,
+      selectedAnnotations = _ref7.selectedAnnotations;
+    if (isDrafting) {
+      return {
+        success: false,
+        reason: ERROR_REASON_DRAFT_IN_PROGRESS
+      };
+    }
+
+    // If there is no annotation state with this id then we can assume the annotation is invalid.
+    if (!(annotations !== null && annotations !== void 0 && annotations.hasOwnProperty(id))) {
+      return {
+        success: false,
+        reason: ERROR_REASON_ID_INVALID
+      };
+    }
+    var isCurrentlySelectedIndex = (_selectedAnnotations$ = selectedAnnotations === null || selectedAnnotations === void 0 ? void 0 : selectedAnnotations.findIndex(function (annotation) {
+      return annotation.id === id;
+    })) !== null && _selectedAnnotations$ !== void 0 ? _selectedAnnotations$ : -1;
+    var isCurrentlySelected = isCurrentlySelectedIndex !== -1;
+    if (isSelected !== isCurrentlySelected) {
+      // the annotation is selection is changing.
+      if (isCurrentlySelected && !isSelected) {
+        var _options$annotationMa4, _getAnnotationInlineN3;
+        // the selected annotaion is being unselected, so we need to close the view.
+        closeComponent()(editorView.state, editorView.dispatch);
+        (_options$annotationMa4 = options.annotationManager) === null || _options$annotationMa4 === void 0 || _options$annotationMa4.emit({
+          name: 'annotationSelectionChanged',
+          data: {
+            annotationId: id,
+            isSelected: false,
+            inlineNodeTypes: (_getAnnotationInlineN3 = getAnnotationInlineNodeTypes(editorView.state, id)) !== null && _getAnnotationInlineN3 !== void 0 ? _getAnnotationInlineN3 : []
+          }
+        });
+      } else if (!isCurrentlySelected && isSelected) {
+        var _options$annotationMa6, _getAnnotationInlineN5;
+        // the annotation is currently not selected and is being selected, so we need to open the view.
+        setSelectedAnnotation(id)(editorView.state, editorView.dispatch);
+
+        // the current annotations are going to be unselected. So we need to notify listeners of this change also.
+        selectedAnnotations === null || selectedAnnotations === void 0 || selectedAnnotations.forEach(function (annotation) {
+          if (annotation.id !== id) {
+            var _options$annotationMa5, _getAnnotationInlineN4;
+            (_options$annotationMa5 = options.annotationManager) === null || _options$annotationMa5 === void 0 || _options$annotationMa5.emit({
+              name: 'annotationSelectionChanged',
+              data: {
+                annotationId: annotation.id,
+                isSelected: false,
+                inlineNodeTypes: (_getAnnotationInlineN4 = getAnnotationInlineNodeTypes(editorView.state, annotation.id)) !== null && _getAnnotationInlineN4 !== void 0 ? _getAnnotationInlineN4 : []
+              }
+            });
+          }
+        });
+
+        // Lastly we need to emit the event for the selected annotation.
+        (_options$annotationMa6 = options.annotationManager) === null || _options$annotationMa6 === void 0 || _options$annotationMa6.emit({
+          name: 'annotationSelectionChanged',
+          data: {
+            annotationId: id,
+            isSelected: true,
+            inlineNodeTypes: (_getAnnotationInlineN5 = getAnnotationInlineNodeTypes(editorView.state, id)) !== null && _getAnnotationInlineN5 !== void 0 ? _getAnnotationInlineN5 : []
+          }
+        });
+      }
+    }
+    return {
+      success: true,
+      isSelected: isSelected
+    };
+  };
+};
+export var setIsAnnotationHovered = function setIsAnnotationHovered(editorView, options) {
+  return function (id, isHovered) {
+    var _hoveredAnnotations$f;
+    var _ref8 = inlineCommentPluginKey.getState(editorView.state) || {},
+      annotations = _ref8.annotations,
+      hoveredAnnotations = _ref8.hoveredAnnotations;
+
+    // If there is no annotation state with this id then we can assume the annotation is invalid.
+    if (!(annotations !== null && annotations !== void 0 && annotations.hasOwnProperty(id))) {
+      return {
+        success: false,
+        reason: ERROR_REASON_ID_INVALID
+      };
+    }
+    var isCurrentlyHoveredIndex = (_hoveredAnnotations$f = hoveredAnnotations === null || hoveredAnnotations === void 0 ? void 0 : hoveredAnnotations.findIndex(function (annotation) {
+      return annotation.id === id;
+    })) !== null && _hoveredAnnotations$f !== void 0 ? _hoveredAnnotations$f : -1;
+    var isCurrentlyHovered = isCurrentlyHoveredIndex !== -1;
+    if (isHovered !== isCurrentlyHovered) {
+      // the annotation in hovered is changing.
+      if (isCurrentlyHovered && !isHovered) {
+        // the hovered annotaion is being unhovered, so we should remove the hover state.
+        setHoveredAnnotation('')(editorView.state, editorView.dispatch);
+      } else if (!isCurrentlyHovered && isHovered) {
+        // the annotation is currently not hovered and is being hovered.
+        setHoveredAnnotation(id)(editorView.state, editorView.dispatch);
+      }
+    }
+    return {
+      success: true,
+      isHovered: isHovered
+    };
+  };
+};
+export var clearAnnotation = function clearAnnotation(editorView, options) {
+  return function (id) {
+    var _ref9 = inlineCommentPluginKey.getState(editorView.state) || {},
+      annotations = _ref9.annotations;
+
+    // If there is no annotation state with this id then we can assume the annotation is invalid.
+    if (!(annotations !== null && annotations !== void 0 && annotations.hasOwnProperty(id))) {
+      return {
+        success: false,
+        reason: ERROR_REASON_ID_INVALID
+      };
+    }
+    removeInlineCommentFromDoc(id, options.provider.supportedBlockNodes)(editorView.state, editorView.dispatch);
+    return {
+      success: true,
+      actionResult: undefined
+    };
+  };
 };