@atlaskit/editor-plugin-annotation
Version:
Annotation plugin for @atlaskit/editor-core
173 lines (170 loc) • 8.31 kB
JavaScript
import { AnnotationTypes } from '@atlaskit/adf-schema';
import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
import { applyMarkOnRange } from '@atlaskit/editor-common/mark';
import { getRangeInlineNodeNames } from '@atlaskit/editor-common/utils';
import { NodeSelection, TextSelection } from '@atlaskit/editor-prosemirror/state';
import { AddMarkStep } from '@atlaskit/editor-prosemirror/transform';
import { fg } from '@atlaskit/platform-feature-flags';
import { getDraftCommandAnalyticsPayload, getPluginState, resolveDraftBookmark } from '../pm-plugins/utils';
var isAnnotationStep = function isAnnotationStep(step) {
return step instanceof AddMarkStep && step.mark.type.name === 'annotation';
};
var addAnnotationMark = function addAnnotationMark(id, supportedBlockNodes) {
return function (transaction, state) {
var inlineCommentState = getPluginState(state);
var _ref = inlineCommentState || {},
bookmark = _ref.bookmark;
var annotationMark = state.schema.marks.annotation.create({
id: id,
type: AnnotationTypes.INLINE_COMMENT
});
var _resolveDraftBookmark = resolveDraftBookmark(state, bookmark, supportedBlockNodes),
from = _resolveDraftBookmark.from,
to = _resolveDraftBookmark.to,
head = _resolveDraftBookmark.head,
isBlockNode = _resolveDraftBookmark.isBlockNode;
var tr = transaction;
if (isBlockNode) {
tr = tr.addNodeMark(from, annotationMark);
// Set selection on the node so that we can display view component
tr.setSelection(NodeSelection.create(tr.doc, from));
} else {
// Apply the mark only to text node in the range.
var _tr = applyMarkOnRange(from, to, false, annotationMark, transaction);
// The mark may not be applied to the current "head" of the bookmark so determine what was applied
// above and use that instead
var annotationMarkStep = _tr.steps.reverse().find(isAnnotationStep);
var headBasedOnMark = from === head ? annotationMarkStep === null || annotationMarkStep === void 0 ? void 0 : annotationMarkStep.from : annotationMarkStep === null || annotationMarkStep === void 0 ? void 0 : annotationMarkStep.to;
_tr.setSelection(TextSelection.create(_tr.doc, headBasedOnMark !== null && headBasedOnMark !== void 0 ? headBasedOnMark : head));
}
return tr;
};
};
var addInlineComment = function addInlineComment(editorAnalyticsAPI, editorAPI) {
return function (id, supportedBlockNodes) {
return function (transaction, state) {
var _editorAPI$editorView, _pluginState$featureF;
var tr = addAnnotationMark(id, supportedBlockNodes)(transaction, state);
editorAPI === null || editorAPI === void 0 || (_editorAPI$editorView = editorAPI.editorViewModeEffects) === null || _editorAPI$editorView === void 0 || _editorAPI$editorView.actions.applyViewModeStepAt(tr);
// add insert analytics step to transaction
tr = addInsertAnalytics(editorAnalyticsAPI)(tr, state);
// add close analytics step to transaction
tr = addOpenCloseAnalytics(editorAnalyticsAPI)(false, INPUT_METHOD.TOOLBAR)(tr, state);
var pluginState = getPluginState(state);
var isAutoScrollBugFixEnabled = pluginState === null || pluginState === void 0 || (_pluginState$featureF = pluginState.featureFlagsPluginState) === null || _pluginState$featureF === void 0 ? void 0 : _pluginState$featureF.commentsOnMediaAutoscrollInEditor;
if (isAutoScrollBugFixEnabled) {
// Explicitly disable scrollIntoView as scrolling is handled by CommentSidebar
tr.setMeta('scrollIntoView', false);
}
return tr;
};
};
};
var addOpenCloseAnalytics = function addOpenCloseAnalytics(editorAnalyticsAPI) {
return function (drafting) {
var method = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : INPUT_METHOD.TOOLBAR;
return function (transaction, state) {
var draftingPayload = getDraftCommandAnalyticsPayload(drafting, method)(state);
editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 || editorAnalyticsAPI.attachAnalyticsEvent(draftingPayload)(transaction);
return transaction;
};
};
};
var handleDraftState = function handleDraftState(editorAnalyticsAPI) {
return function (drafting) {
var method = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : INPUT_METHOD.TOOLBAR;
return function (transaction, state) {
var _pluginState$featureF2;
var tr = addOpenCloseAnalytics(editorAnalyticsAPI)(drafting, method)(transaction, state);
var pluginState = getPluginState(state);
var isAutoScrollBugFixEnabled = pluginState === null || pluginState === void 0 || (_pluginState$featureF2 = pluginState.featureFlagsPluginState) === null || _pluginState$featureF2 === void 0 ? void 0 : _pluginState$featureF2.commentsOnMediaAutoscrollInEditor;
if (isAutoScrollBugFixEnabled) {
// Explicitly disable scrollIntoView as scrolling is handled by CommentSidebar
tr.setMeta('scrollIntoView', false);
}
return tr;
};
};
};
var addInsertAnalytics = function addInsertAnalytics(editorAnalyticsAPI) {
return function (transaction, state) {
var analyticsEvent = {
action: ACTION.INSERTED,
actionSubject: ACTION_SUBJECT.ANNOTATION,
eventType: EVENT_TYPE.TRACK,
actionSubjectId: ACTION_SUBJECT_ID.INLINE_COMMENT,
attributes: {}
};
if (fg('editor_inline_comments_on_inline_nodes')) {
var _ref2 = getPluginState(state) || {},
bookmark = _ref2.bookmark;
// When this FF is removed we can move the analytics event creation inside of the
// attachAnalyticsEvent and get type inference for the attributes.
// @ts-ignore
analyticsEvent.attributes.inlineNodeNames = getRangeInlineNodeNames({
doc: state.doc,
pos: resolveDraftBookmark(state, bookmark)
});
}
editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 || editorAnalyticsAPI.attachAnalyticsEvent(analyticsEvent)(transaction);
return transaction;
};
};
var addResolveAnalytics = function addResolveAnalytics(editorAnalyticsAPI) {
return function (method) {
return function (transaction, state) {
var resolvedPayload = {
action: ACTION.RESOLVED,
actionSubject: ACTION_SUBJECT.ANNOTATION,
actionSubjectId: ACTION_SUBJECT_ID.INLINE_COMMENT,
eventType: EVENT_TYPE.TRACK,
attributes: {
method: method
}
};
editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 || editorAnalyticsAPI.attachAnalyticsEvent(resolvedPayload)(transaction);
return transaction;
};
};
};
var addPreemptiveGateErrorAnalytics = function addPreemptiveGateErrorAnalytics(editorAnalyticsAPI) {
return function (errorReason) {
return function (transaction, state) {
var analyticsEvent = {
action: ACTION.ERROR,
actionSubject: ACTION_SUBJECT.ANNOTATION,
actionSubjectId: ACTION_SUBJECT_ID.INLINE_COMMENT,
eventType: EVENT_TYPE.OPERATIONAL,
attributes: {
errorReason: errorReason
}
};
editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 || editorAnalyticsAPI.attachAnalyticsEvent(analyticsEvent)(transaction);
return transaction;
};
};
};
var addDeleteAnalytics = function addDeleteAnalytics(editorAnalyticsAPI) {
return function (transaction, state) {
var analyticsEvent = {
action: ACTION.DELETED,
actionSubject: ACTION_SUBJECT.ANNOTATION,
actionSubjectId: ACTION_SUBJECT_ID.INLINE_COMMENT,
eventType: EVENT_TYPE.TRACK,
attributes: {}
};
editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 || editorAnalyticsAPI.attachAnalyticsEvent(analyticsEvent)(transaction);
return transaction;
};
};
var _default_1 = {
addAnnotationMark: addAnnotationMark,
addInlineComment: addInlineComment,
handleDraftState: handleDraftState,
addOpenCloseAnalytics: addOpenCloseAnalytics,
addInsertAnalytics: addInsertAnalytics,
addResolveAnalytics: addResolveAnalytics,
addPreemptiveGateErrorAnalytics: addPreemptiveGateErrorAnalytics,
addDeleteAnalytics: addDeleteAnalytics
};
export default _default_1;