@atlaskit/editor-plugin-code-block 3.2.3 → 3.2.4

package/CHANGELOG.md

@@ -1,5 +1,14 @@
 # @atlaskit/editor-plugin-code-block
 
+## 3.2.4
+
+### Patch Changes
+
+- [#126818](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/126818)
+  [`197b047fbe6e6`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/197b047fbe6e6) -
+  ED-24245 - Adding analytics TRACK event that is triggered when the user clicks the toggle word
+  wrap button on the code block floating toolbar.
+
 ## 3.2.3
 
 ### Patch Changes

package/dist/cjs/actions.js

@@ -206,20 +206,39 @@ function insertCodeBlockWithAnalytics(inputMethod, analyticsAPI) {
 /**
  * Add the given node to the codeBlockWrappedStates WeakMap with the toggle boolean value.
  */
-var toggleWordWrapStateForCodeBlockNode = exports.toggleWordWrapStateForCodeBlockNode = function toggleWordWrapStateForCodeBlockNode(state) {
-  var _findCodeBlock;
-  if (!(0, _platformFeatureFlags.fg)('editor_support_code_block_wrapping')) {
-    return false;
-  }
-  var codeBlockNode = (_findCodeBlock = (0, _utils2.findCodeBlock)(state)) === null || _findCodeBlock === void 0 ? void 0 : _findCodeBlock.node;
-  if (!_codeBlock.codeBlockWrappedStates || !codeBlockNode) {
-    return false;
-  }
-  var currentValue = (0, _codeBlock.isCodeBlockWordWrapEnabled)(codeBlockNode);
-  _codeBlock.codeBlockWrappedStates.set(codeBlockNode, !currentValue);
+var toggleWordWrapStateForCodeBlockNode = exports.toggleWordWrapStateForCodeBlockNode = function toggleWordWrapStateForCodeBlockNode(editorAnalyticsAPI) {
+  return function (state, dispatch) {
+    var _findCodeBlock;
+    if (!(0, _platformFeatureFlags.fg)('editor_support_code_block_wrapping')) {
+      return false;
+    }
+    var codeBlockNode = (_findCodeBlock = (0, _utils2.findCodeBlock)(state)) === null || _findCodeBlock === void 0 ? void 0 : _findCodeBlock.node;
+    var tr = state.tr;
+    if (!_codeBlock.codeBlockWrappedStates || !codeBlockNode) {
+      return false;
+    }
+    var updatedToggleState = !(0, _codeBlock.isCodeBlockWordWrapEnabled)(codeBlockNode);
+    _codeBlock.codeBlockWrappedStates.set(codeBlockNode, updatedToggleState);
 
-  // TODO: Remove in ED-24222. Leaving here for demo purposes.
-  // eslint-disable-next-line no-console
-  console.log("Code Block Word Wrap: Updating codeBlockWrappedStates with: ".concat(_codeBlock.codeBlockWrappedStates.get(codeBlockNode)));
-  return true;
+    // TODO: Remove in ED-24222. Leaving here for demo purposes.
+    // eslint-disable-next-line no-console
+    console.log("Code Block Word Wrap: Updating codeBlockWrappedStates with: ".concat(updatedToggleState));
+    if (dispatch) {
+      var payload = {
+        action: _analytics.ACTION.TOGGLE_CODE_BLOCK_WRAP,
+        actionSubject: _analytics.ACTION_SUBJECT.CODE_BLOCK,
+        attributes: {
+          platform: _analytics.PLATFORMS.WEB,
+          mode: _analytics.MODE.EDITOR,
+          wordWrapEnabled: updatedToggleState
+        },
+        eventType: _analytics.EVENT_TYPE.TRACK
+      };
+
+      // TODO: ED-24320 should convert this to attachAnalyticsEvent if it is dispatching a transaction here.
+      editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 || editorAnalyticsAPI.fireAnalyticsEvent(payload);
+      dispatch(tr);
+    }
+    return true;
+  };
 };

package/dist/cjs/toolbar.js

@@ -105,7 +105,7 @@ var getToolbarConfig = exports.getToolbarConfig = function getToolbarConfig() {
       id: 'editor.codeBlock.wrap',
       type: 'button',
       icon: _WrapIcon.WrapIcon,
-      onClick: _actions.toggleWordWrapStateForCodeBlockNode,
+      onClick: (0, _actions.toggleWordWrapStateForCodeBlockNode)(editorAnalyticsAPI),
       // Hooking up here for demo purposes. To be revisited with ED-24222.
       title: formatMessage(_messages.codeBlockButtonMessages.wrapCode),
       tabIndex: null

package/dist/es2019/actions.js

@@ -1,4 +1,4 @@
-import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
+import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, MODE, PLATFORMS } from '@atlaskit/editor-common/analytics';
 import { copyToClipboard } from '@atlaskit/editor-common/clipboard';
 import { codeBlockWrappedStates, isCodeBlockWordWrapEnabled } from '@atlaskit/editor-common/code-block';
 import { withAnalytics } from '@atlaskit/editor-common/editor-analytics';
@@ -216,20 +216,39 @@ export function insertCodeBlockWithAnalytics(inputMethod, analyticsAPI) {
 /**
  * Add the given node to the codeBlockWrappedStates WeakMap with the toggle boolean value.
  */
-export const toggleWordWrapStateForCodeBlockNode = state => {
+export const toggleWordWrapStateForCodeBlockNode = editorAnalyticsAPI => (state, dispatch) => {
   var _findCodeBlock;
   if (!fg('editor_support_code_block_wrapping')) {
     return false;
   }
   const codeBlockNode = (_findCodeBlock = findCodeBlock(state)) === null || _findCodeBlock === void 0 ? void 0 : _findCodeBlock.node;
+  const {
+    tr
+  } = state;
   if (!codeBlockWrappedStates || !codeBlockNode) {
     return false;
   }
-  const currentValue = isCodeBlockWordWrapEnabled(codeBlockNode);
-  codeBlockWrappedStates.set(codeBlockNode, !currentValue);
+  const updatedToggleState = !isCodeBlockWordWrapEnabled(codeBlockNode);
+  codeBlockWrappedStates.set(codeBlockNode, updatedToggleState);
 
   // TODO: Remove in ED-24222. Leaving here for demo purposes.
   // eslint-disable-next-line no-console
-  console.log(`Code Block Word Wrap: Updating codeBlockWrappedStates with: ${codeBlockWrappedStates.get(codeBlockNode)}`);
+  console.log(`Code Block Word Wrap: Updating codeBlockWrappedStates with: ${updatedToggleState}`);
+  if (dispatch) {
+    const payload = {
+      action: ACTION.TOGGLE_CODE_BLOCK_WRAP,
+      actionSubject: ACTION_SUBJECT.CODE_BLOCK,
+      attributes: {
+        platform: PLATFORMS.WEB,
+        mode: MODE.EDITOR,
+        wordWrapEnabled: updatedToggleState
+      },
+      eventType: EVENT_TYPE.TRACK
+    };
+
+    // TODO: ED-24320 should convert this to attachAnalyticsEvent if it is dispatching a transaction here.
+    editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 ? void 0 : editorAnalyticsAPI.fireAnalyticsEvent(payload);
+    dispatch(tr);
+  }
   return true;
 };

package/dist/es2019/toolbar.js

@@ -86,7 +86,7 @@ export const getToolbarConfig = (allowCopyToClipboard = false, api) => (state, {
     id: 'editor.codeBlock.wrap',
     type: 'button',
     icon: WrapIcon,
-    onClick: toggleWordWrapStateForCodeBlockNode,
+    onClick: toggleWordWrapStateForCodeBlockNode(editorAnalyticsAPI),
     // Hooking up here for demo purposes. To be revisited with ED-24222.
     title: formatMessage(codeBlockButtonMessages.wrapCode),
     tabIndex: null

package/dist/esm/actions.js

@@ -1,4 +1,4 @@
-import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
+import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, MODE, PLATFORMS } from '@atlaskit/editor-common/analytics';
 import { copyToClipboard } from '@atlaskit/editor-common/clipboard';
 import { codeBlockWrappedStates, isCodeBlockWordWrapEnabled } from '@atlaskit/editor-common/code-block';
 import { withAnalytics } from '@atlaskit/editor-common/editor-analytics';
@@ -196,20 +196,39 @@ export function insertCodeBlockWithAnalytics(inputMethod, analyticsAPI) {
 /**
  * Add the given node to the codeBlockWrappedStates WeakMap with the toggle boolean value.
  */
-export var toggleWordWrapStateForCodeBlockNode = function toggleWordWrapStateForCodeBlockNode(state) {
-  var _findCodeBlock;
-  if (!fg('editor_support_code_block_wrapping')) {
-    return false;
-  }
-  var codeBlockNode = (_findCodeBlock = findCodeBlock(state)) === null || _findCodeBlock === void 0 ? void 0 : _findCodeBlock.node;
-  if (!codeBlockWrappedStates || !codeBlockNode) {
-    return false;
-  }
-  var currentValue = isCodeBlockWordWrapEnabled(codeBlockNode);
-  codeBlockWrappedStates.set(codeBlockNode, !currentValue);
+export var toggleWordWrapStateForCodeBlockNode = function toggleWordWrapStateForCodeBlockNode(editorAnalyticsAPI) {
+  return function (state, dispatch) {
+    var _findCodeBlock;
+    if (!fg('editor_support_code_block_wrapping')) {
+      return false;
+    }
+    var codeBlockNode = (_findCodeBlock = findCodeBlock(state)) === null || _findCodeBlock === void 0 ? void 0 : _findCodeBlock.node;
+    var tr = state.tr;
+    if (!codeBlockWrappedStates || !codeBlockNode) {
+      return false;
+    }
+    var updatedToggleState = !isCodeBlockWordWrapEnabled(codeBlockNode);
+    codeBlockWrappedStates.set(codeBlockNode, updatedToggleState);
 
-  // TODO: Remove in ED-24222. Leaving here for demo purposes.
-  // eslint-disable-next-line no-console
-  console.log("Code Block Word Wrap: Updating codeBlockWrappedStates with: ".concat(codeBlockWrappedStates.get(codeBlockNode)));
-  return true;
+    // TODO: Remove in ED-24222. Leaving here for demo purposes.
+    // eslint-disable-next-line no-console
+    console.log("Code Block Word Wrap: Updating codeBlockWrappedStates with: ".concat(updatedToggleState));
+    if (dispatch) {
+      var payload = {
+        action: ACTION.TOGGLE_CODE_BLOCK_WRAP,
+        actionSubject: ACTION_SUBJECT.CODE_BLOCK,
+        attributes: {
+          platform: PLATFORMS.WEB,
+          mode: MODE.EDITOR,
+          wordWrapEnabled: updatedToggleState
+        },
+        eventType: EVENT_TYPE.TRACK
+      };
+
+      // TODO: ED-24320 should convert this to attachAnalyticsEvent if it is dispatching a transaction here.
+      editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 || editorAnalyticsAPI.fireAnalyticsEvent(payload);
+      dispatch(tr);
+    }
+    return true;
+  };
 };

package/dist/esm/toolbar.js

@@ -95,7 +95,7 @@ export var getToolbarConfig = function getToolbarConfig() {
       id: 'editor.codeBlock.wrap',
       type: 'button',
       icon: WrapIcon,
-      onClick: toggleWordWrapStateForCodeBlockNode,
+      onClick: toggleWordWrapStateForCodeBlockNode(editorAnalyticsAPI),
       // Hooking up here for demo purposes. To be revisited with ED-24222.
       title: formatMessage(codeBlockButtonMessages.wrapCode),
       tabIndex: null

package/dist/types/actions.d.ts

@@ -19,4 +19,4 @@ export declare function insertCodeBlockWithAnalytics(inputMethod: INPUT_METHOD,
 /**
  * Add the given node to the codeBlockWrappedStates WeakMap with the toggle boolean value.
  */
-export declare const toggleWordWrapStateForCodeBlockNode: Command;
+export declare const toggleWordWrapStateForCodeBlockNode: (editorAnalyticsAPI: EditorAnalyticsAPI | undefined) => Command;

package/dist/types-ts4.5/actions.d.ts

@@ -19,4 +19,4 @@ export declare function insertCodeBlockWithAnalytics(inputMethod: INPUT_METHOD,
 /**
  * Add the given node to the codeBlockWrappedStates WeakMap with the toggle boolean value.
  */
-export declare const toggleWordWrapStateForCodeBlockNode: Command;
+export declare const toggleWordWrapStateForCodeBlockNode: (editorAnalyticsAPI: EditorAnalyticsAPI | undefined) => Command;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-code-block",
-	"version": "3.2.3",
+	"version": "3.2.4",
 	"description": "Code block plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -35,13 +35,13 @@
 	"dependencies": {
 		"@atlaskit/adf-schema": "^40.3.0",
 		"@atlaskit/code": "^15.4.0",
-		"@atlaskit/editor-common": "^87.0.0",
+		"@atlaskit/editor-common": "^87.3.0",
 		"@atlaskit/editor-plugin-analytics": "^1.6.0",
 		"@atlaskit/editor-plugin-composition": "^1.2.0",
 		"@atlaskit/editor-plugin-decorations": "^1.2.0",
 		"@atlaskit/editor-plugin-editor-disabled": "^1.2.0",
 		"@atlaskit/editor-prosemirror": "5.0.1",
-		"@atlaskit/icon": "^22.8.0",
+		"@atlaskit/icon": "^22.10.0",
 		"@atlaskit/platform-feature-flags": "^0.3.0",
 		"@atlaskit/prosemirror-input-rules": "^3.2.0",
 		"@babel/runtime": "^7.0.0",