@atlaskit/link-datasource 0.33.11 → 0.34.0

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @atlaskit/link-datasource
 
+## 0.34.0
+
+### Minor Changes
+
+- [`02ac9829cf8`](https://bitbucket.org/atlassian/atlassian-frontend/commits/02ac9829cf8) - [ux] Added support for richtext.
+
+## 0.33.12
+
+### Patch Changes
+
+- [`0aadfa0dc26`](https://bitbucket.org/atlassian/atlassian-frontend/commits/0aadfa0dc26) - Fix double loading inside table view
+
 ## 0.33.11
 
 ### Patch Changes

package/dist/cjs/ui/datasource-table-view/datasourceTableView.js

@@ -36,9 +36,16 @@ var DatasourceTableView = function DatasourceTableView(_ref) {
     totalCount = _useDatasourceTableSt.totalCount,
     loadDatasourceDetails = _useDatasourceTableSt.loadDatasourceDetails;
 
-  // Need this to make sure that the datasource in the editor gets updated new info if any edits are made in the modal
+  /*  Need this to make sure that the datasource in the editor gets updated new info if any edits are made in the modal
+      But we don't want to call it on initial load. This screws up useDatasourceTableState's internal
+      mechanism of initial loading. Use of ref here makes it basically work as a `componentDidUpdate` but not `componentDidMount`
+   */
+  var isInitialRender = (0, _react.useRef)(true);
   (0, _react.useEffect)(function () {
-    reset();
+    if (!isInitialRender.current) {
+      reset();
+    }
+    isInitialRender.current = false;
   }, [reset, parameters]);
   (0, _react.useEffect)(function () {
     if (onVisibleColumnKeysChange && (visibleColumnKeys || []).length === 0 && defaultVisibleColumnKeys.length > 0) {

package/dist/cjs/ui/issue-like-table/index.js

@@ -95,6 +95,7 @@ function getColumnWidth(key, type) {
     priority: BASE_WIDTH * 8,
     status: BASE_WIDTH * 18,
     summary: BASE_WIDTH * 45,
+    description: BASE_WIDTH * 31.25,
     type: BASE_WIDTH * 8
   };
   if (keyBasedWidth[key]) {

package/dist/cjs/ui/issue-like-table/render-type/index.js

@@ -11,6 +11,7 @@ var _dateTime = _interopRequireDefault(require("./date-time"));
 var _icon = _interopRequireDefault(require("./icon"));
 var _link = _interopRequireDefault(require("./link"));
 var _number = _interopRequireDefault(require("./number"));
+var _richtext = _interopRequireDefault(require("./richtext"));
 var _status = _interopRequireDefault(require("./status"));
 var _tag = _interopRequireDefault(require("./tag"));
 var _text = _interopRequireDefault(require("./text"));
@@ -58,6 +59,10 @@ var fallbackRenderType = function fallbackRenderType(item) {
       });
     case 'user':
       return /*#__PURE__*/_react.default.createElement(_user.default, item.value);
+    case 'richtext':
+      return /*#__PURE__*/_react.default.createElement(_richtext.default, {
+        value: item.value
+      });
     default:
       return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null);
   }

package/dist/cjs/ui/issue-like-table/render-type/richtext/index.js

@@ -0,0 +1,52 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _react = require("react");
+var _react2 = require("@emotion/react");
+var _schemaDefault = require("@atlaskit/adf-schema/schema-default");
+var _model = require("@atlaskit/editor-prosemirror/model");
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; } /** @jsx jsx */
+var rootStyles = (0, _react2.css)({
+  whiteSpace: 'nowrap',
+  textOverflow: 'ellipsis',
+  overflow: 'hidden',
+  position: 'relative',
+  display: 'block'
+});
+var RichTextType = function RichTextType(_ref) {
+  var value = _ref.value;
+  var adfPlainText = (0, _react.useMemo)(function () {
+    try {
+      if (value.type === 'adf') {
+        var adf = JSON.parse(value.text);
+        return _model.Node.fromJSON(_schemaDefault.defaultSchema, _objectSpread(_objectSpread({}, adf), {}, {
+          content: (0, _toConsumableArray2.default)(adf.content.slice(0, 2))
+        })).textContent;
+      }
+      return null;
+    } catch (e) {
+      // eslint-disable-next-line no-console
+      console.error('error parsing adf', e);
+      return null;
+    }
+  }, [value]);
+  if (adfPlainText) {
+    return (0, _react2.jsx)("div", {
+      css: rootStyles,
+      "data-testid": "richtext-plaintext"
+    }, adfPlainText);
+  } else {
+    return (0, _react2.jsx)("span", {
+      "data-testid": "richtext-unsupported"
+    });
+  }
+};
+var _default = RichTextType;
+exports.default = _default;

package/dist/cjs/ui/jira-issues-modal/modal/index.js

@@ -344,7 +344,7 @@ var analyticsContextAttributes = {
 };
 var analyticsContextData = {
   packageName: "@atlaskit/link-datasource",
-  packageVersion: "0.33.11",
+  packageVersion: "0.34.0",
   source: 'datasourceConfigModal'
 };
 var contextData = _objectSpread(_objectSpread({}, analyticsContextData), {}, {

package/dist/cjs/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/link-datasource",
-	"version": "0.33.11",
+	"version": "0.34.0",
 	"sideEffects": false
 }

package/dist/es2019/ui/datasource-table-view/datasourceTableView.js

@@ -1,5 +1,5 @@
 /** @jsx jsx */
-import { useCallback, useEffect } from 'react';
+import { useCallback, useEffect, useRef } from 'react';
 import { jsx } from '@emotion/react';
 import { useDatasourceTableState } from '../../hooks/useDatasourceTableState';
 import { AccessRequired } from '../common/error-state/access-required';
@@ -30,9 +30,16 @@ export const DatasourceTableView = ({
     fieldKeys: visibleColumnKeys
   });
 
-  // Need this to make sure that the datasource in the editor gets updated new info if any edits are made in the modal
+  /*  Need this to make sure that the datasource in the editor gets updated new info if any edits are made in the modal
+      But we don't want to call it on initial load. This screws up useDatasourceTableState's internal
+      mechanism of initial loading. Use of ref here makes it basically work as a `componentDidUpdate` but not `componentDidMount`
+   */
+  const isInitialRender = useRef(true);
   useEffect(() => {
-    reset();
+    if (!isInitialRender.current) {
+      reset();
+    }
+    isInitialRender.current = false;
   }, [reset, parameters]);
   useEffect(() => {
     if (onVisibleColumnKeysChange && (visibleColumnKeys || []).length === 0 && defaultVisibleColumnKeys.length > 0) {

package/dist/es2019/ui/issue-like-table/index.js

@@ -97,6 +97,7 @@ function getColumnWidth(key, type) {
     priority: BASE_WIDTH * 8,
     status: BASE_WIDTH * 18,
     summary: BASE_WIDTH * 45,
+    description: BASE_WIDTH * 31.25,
     type: BASE_WIDTH * 8
   };
   if (keyBasedWidth[key]) {

package/dist/es2019/ui/issue-like-table/render-type/index.js

@@ -4,6 +4,7 @@ import DateTimeRenderType from './date-time';
 import IconRenderType from './icon';
 import LinkRenderType from './link';
 import NumberRenderType from './number';
+import RichTextRenderType from './richtext';
 import StatusRenderType from './status';
 import TagRenderType from './tag';
 import StringRenderType from './text';
@@ -51,6 +52,10 @@ export const fallbackRenderType = item => {
       });
     case 'user':
       return /*#__PURE__*/React.createElement(UserRenderType, item.value);
+    case 'richtext':
+      return /*#__PURE__*/React.createElement(RichTextRenderType, {
+        value: item.value
+      });
     default:
       return /*#__PURE__*/React.createElement(React.Fragment, null);
   }

package/dist/es2019/ui/issue-like-table/render-type/richtext/index.js

@@ -0,0 +1,43 @@
+/** @jsx jsx */
+import { useMemo } from 'react';
+import { css, jsx } from '@emotion/react';
+import { defaultSchema } from '@atlaskit/adf-schema/schema-default';
+import { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
+const rootStyles = css({
+  whiteSpace: 'nowrap',
+  textOverflow: 'ellipsis',
+  overflow: 'hidden',
+  position: 'relative',
+  display: 'block'
+});
+const RichTextType = ({
+  value
+}) => {
+  const adfPlainText = useMemo(() => {
+    try {
+      if (value.type === 'adf') {
+        const adf = JSON.parse(value.text);
+        return PMNode.fromJSON(defaultSchema, {
+          ...adf,
+          content: [...adf.content.slice(0, 2)]
+        }).textContent;
+      }
+      return null;
+    } catch (e) {
+      // eslint-disable-next-line no-console
+      console.error('error parsing adf', e);
+      return null;
+    }
+  }, [value]);
+  if (adfPlainText) {
+    return jsx("div", {
+      css: rootStyles,
+      "data-testid": "richtext-plaintext"
+    }, adfPlainText);
+  } else {
+    return jsx("span", {
+      "data-testid": "richtext-unsupported"
+    });
+  }
+};
+export default RichTextType;

package/dist/es2019/ui/jira-issues-modal/modal/index.js

@@ -290,7 +290,7 @@ const analyticsContextAttributes = {
 };
 const analyticsContextData = {
   packageName: "@atlaskit/link-datasource",
-  packageVersion: "0.33.11",
+  packageVersion: "0.34.0",
   source: 'datasourceConfigModal'
 };
 const contextData = {

package/dist/es2019/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/link-datasource",
-	"version": "0.33.11",
+	"version": "0.34.0",
 	"sideEffects": false
 }

package/dist/esm/ui/datasource-table-view/datasourceTableView.js

@@ -1,5 +1,5 @@
 /** @jsx jsx */
-import { useCallback, useEffect } from 'react';
+import { useCallback, useEffect, useRef } from 'react';
 import { jsx } from '@emotion/react';
 import { useDatasourceTableState } from '../../hooks/useDatasourceTableState';
 import { AccessRequired } from '../common/error-state/access-required';
@@ -28,9 +28,16 @@ export var DatasourceTableView = function DatasourceTableView(_ref) {
     totalCount = _useDatasourceTableSt.totalCount,
     loadDatasourceDetails = _useDatasourceTableSt.loadDatasourceDetails;
 
-  // Need this to make sure that the datasource in the editor gets updated new info if any edits are made in the modal
+  /*  Need this to make sure that the datasource in the editor gets updated new info if any edits are made in the modal
+      But we don't want to call it on initial load. This screws up useDatasourceTableState's internal
+      mechanism of initial loading. Use of ref here makes it basically work as a `componentDidUpdate` but not `componentDidMount`
+   */
+  var isInitialRender = useRef(true);
   useEffect(function () {
-    reset();
+    if (!isInitialRender.current) {
+      reset();
+    }
+    isInitialRender.current = false;
   }, [reset, parameters]);
   useEffect(function () {
     if (onVisibleColumnKeysChange && (visibleColumnKeys || []).length === 0 && defaultVisibleColumnKeys.length > 0) {

package/dist/esm/ui/issue-like-table/index.js

@@ -88,6 +88,7 @@ function getColumnWidth(key, type) {
     priority: BASE_WIDTH * 8,
     status: BASE_WIDTH * 18,
     summary: BASE_WIDTH * 45,
+    description: BASE_WIDTH * 31.25,
     type: BASE_WIDTH * 8
   };
   if (keyBasedWidth[key]) {

package/dist/esm/ui/issue-like-table/render-type/index.js

@@ -4,6 +4,7 @@ import DateTimeRenderType from './date-time';
 import IconRenderType from './icon';
 import LinkRenderType from './link';
 import NumberRenderType from './number';
+import RichTextRenderType from './richtext';
 import StatusRenderType from './status';
 import TagRenderType from './tag';
 import StringRenderType from './text';
@@ -51,6 +52,10 @@ export var fallbackRenderType = function fallbackRenderType(item) {
       });
     case 'user':
       return /*#__PURE__*/React.createElement(UserRenderType, item.value);
+    case 'richtext':
+      return /*#__PURE__*/React.createElement(RichTextRenderType, {
+        value: item.value
+      });
     default:
       return /*#__PURE__*/React.createElement(React.Fragment, null);
   }

package/dist/esm/ui/issue-like-table/render-type/richtext/index.js

@@ -0,0 +1,45 @@
+import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+/** @jsx jsx */
+import { useMemo } from 'react';
+import { css, jsx } from '@emotion/react';
+import { defaultSchema } from '@atlaskit/adf-schema/schema-default';
+import { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
+var rootStyles = css({
+  whiteSpace: 'nowrap',
+  textOverflow: 'ellipsis',
+  overflow: 'hidden',
+  position: 'relative',
+  display: 'block'
+});
+var RichTextType = function RichTextType(_ref) {
+  var value = _ref.value;
+  var adfPlainText = useMemo(function () {
+    try {
+      if (value.type === 'adf') {
+        var adf = JSON.parse(value.text);
+        return PMNode.fromJSON(defaultSchema, _objectSpread(_objectSpread({}, adf), {}, {
+          content: _toConsumableArray(adf.content.slice(0, 2))
+        })).textContent;
+      }
+      return null;
+    } catch (e) {
+      // eslint-disable-next-line no-console
+      console.error('error parsing adf', e);
+      return null;
+    }
+  }, [value]);
+  if (adfPlainText) {
+    return jsx("div", {
+      css: rootStyles,
+      "data-testid": "richtext-plaintext"
+    }, adfPlainText);
+  } else {
+    return jsx("span", {
+      "data-testid": "richtext-unsupported"
+    });
+  }
+};
+export default RichTextType;

package/dist/esm/ui/jira-issues-modal/modal/index.js

@@ -334,7 +334,7 @@ var analyticsContextAttributes = {
 };
 var analyticsContextData = {
   packageName: "@atlaskit/link-datasource",
-  packageVersion: "0.33.11",
+  packageVersion: "0.34.0",
   source: 'datasourceConfigModal'
 };
 var contextData = _objectSpread(_objectSpread({}, analyticsContextData), {}, {

package/dist/esm/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/link-datasource",
-	"version": "0.33.11",
+	"version": "0.34.0",
 	"sideEffects": false
 }

package/dist/types/ui/issue-like-table/render-type/richtext/index.d.ts

@@ -0,0 +1,6 @@
+import { jsx } from '@emotion/react';
+import { RichText } from '@atlaskit/linking-types';
+declare const RichTextType: ({ value }: {
+    value: RichText;
+}) => jsx.JSX.Element;
+export default RichTextType;

package/dist/types-ts4.5/ui/issue-like-table/render-type/richtext/index.d.ts

@@ -0,0 +1,6 @@
+import { jsx } from '@emotion/react';
+import { RichText } from '@atlaskit/linking-types';
+declare const RichTextType: ({ value }: {
+    value: RichText;
+}) => jsx.JSX.Element;
+export default RichTextType;

package/examples-helpers/adfTable.json

@@ -0,0 +1,285 @@
+{
+  "type": "doc",
+  "version": 1,
+  "content": [
+    {
+      "type": "table",
+      "attrs": { "layout": "full-width" },
+      "content": [
+        {
+          "type": "tableRow",
+          "content": [
+            {
+              "type": "tableHeader",
+              "content": [
+                {
+                  "type": "paragraph",
+                  "content": [{ "type": "text", "text": "Header content 1" }]
+                }
+              ]
+            },
+            {
+              "type": "tableHeader",
+              "content": [
+                {
+                  "type": "paragraph",
+                  "content": [{ "type": "text", "text": "Header content 2" }]
+                }
+              ]
+            },
+            {
+              "type": "tableHeader",
+              "content": [
+                {
+                  "type": "paragraph",
+                  "content": [{ "type": "text", "text": "Header content 3" }]
+                }
+              ]
+            }
+          ]
+        },
+        {
+          "type": "tableRow",
+          "content": [
+            {
+              "type": "tableCell",
+              "content": [
+                {
+                  "type": "paragraph",
+                  "content": [{ "type": "text", "text": "Body content 1" }]
+                }
+              ]
+            },
+            {
+              "type": "tableCell",
+              "content": [
+                {
+                  "type": "paragraph",
+                  "content": [{ "type": "text", "text": "Body content 2" }]
+                }
+              ]
+            },
+            {
+              "type": "tableCell",
+              "content": [
+                {
+                  "type": "paragraph",
+                  "content": [{ "type": "text", "text": "Body content 3" }]
+                }
+              ]
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "type": "bodiedExtension",
+      "attrs": {
+        "extensionType": "com.atlassian.confluence.macro.core",
+        "extensionKey": "bodied-eh",
+        "parameters": {
+          "macroParams": {},
+          "macroMetadata": {
+            "macroId": { "value": 1532948101320 },
+            "placeholder": { "0": { "data": { "url": "" }, "type": "icon" } }
+          }
+        },
+        "layout": "wide"
+      },
+      "content": [
+        {
+          "type": "table",
+          "attrs": { "layout": "full-width" },
+          "content": [
+            {
+              "type": "tableRow",
+              "content": [
+                {
+                  "type": "tableHeader",
+                  "content": [
+                    {
+                      "type": "paragraph",
+                      "content": [
+                        { "type": "text", "text": "Header content 1" }
+                      ]
+                    }
+                  ]
+                },
+                {
+                  "type": "tableHeader",
+                  "content": [
+                    {
+                      "type": "paragraph",
+                      "content": [
+                        { "type": "text", "text": "Header content 2" }
+                      ]
+                    }
+                  ]
+                },
+                {
+                  "type": "tableHeader",
+                  "content": [
+                    {
+                      "type": "paragraph",
+                      "content": [
+                        { "type": "text", "text": "Header content 3" }
+                      ]
+                    }
+                  ]
+                }
+              ]
+            },
+            {
+              "type": "tableRow",
+              "content": [
+                {
+                  "type": "tableCell",
+                  "content": [
+                    {
+                      "type": "paragraph",
+                      "content": [
+                        {
+                          "type": "text",
+                          "text": "This table is inside a bodied extension."
+                        }
+                      ]
+                    }
+                  ]
+                },
+                {
+                  "type": "tableCell",
+                  "content": [
+                    {
+                      "type": "paragraph",
+                      "content": [{ "type": "text", "text": "Body content 2" }]
+                    }
+                  ]
+                },
+                {
+                  "type": "tableCell",
+                  "content": [
+                    {
+                      "type": "paragraph",
+                      "content": [{ "type": "text", "text": "Body content 3" }]
+                    }
+                  ]
+                }
+              ]
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "type": "table",
+      "attrs": { "isNumberColumnEnabled": true, "layout": "default" },
+      "content": [
+        {
+          "type": "tableRow",
+          "content": [
+            {
+              "type": "tableCell",
+              "attrs": {},
+              "content": [
+                {
+                  "type": "paragraph",
+                  "content": [{ "type": "text", "text": "Body content 1" }]
+                }
+              ]
+            },
+            {
+              "type": "tableCell",
+              "attrs": {},
+              "content": [
+                {
+                  "type": "paragraph",
+                  "content": [{ "type": "text", "text": "Body content 2" }]
+                }
+              ]
+            },
+            {
+              "type": "tableCell",
+              "attrs": {},
+              "content": [
+                {
+                  "type": "paragraph",
+                  "content": [{ "type": "text", "text": "Body content 3" }]
+                }
+              ]
+            }
+          ]
+        },
+        {
+          "type": "tableRow",
+          "content": [
+            {
+              "type": "tableCell",
+              "attrs": {},
+              "content": [
+                {
+                  "type": "paragraph",
+                  "content": [{ "type": "text", "text": "Body content 1" }]
+                }
+              ]
+            },
+            {
+              "type": "tableCell",
+              "attrs": {},
+              "content": [
+                {
+                  "type": "paragraph",
+                  "content": [{ "type": "text", "text": "Body content 2" }]
+                }
+              ]
+            },
+            {
+              "type": "tableCell",
+              "attrs": {},
+              "content": [
+                {
+                  "type": "paragraph",
+                  "content": [{ "type": "text", "text": "Body content 3" }]
+                }
+              ]
+            }
+          ]
+        },
+        {
+          "type": "tableRow",
+          "content": [
+            {
+              "type": "tableCell",
+              "attrs": {},
+              "content": [
+                {
+                  "type": "paragraph",
+                  "content": [{ "type": "text", "text": "Body content 1" }]
+                }
+              ]
+            },
+            {
+              "type": "tableCell",
+              "attrs": {},
+              "content": [
+                {
+                  "type": "paragraph",
+                  "content": [{ "type": "text", "text": "Body content 2" }]
+                }
+              ]
+            },
+            {
+              "type": "tableCell",
+              "attrs": {},
+              "content": [
+                {
+                  "type": "paragraph",
+                  "content": [{ "type": "text", "text": "Body content 3" }]
+                }
+              ]
+            }
+          ]
+        }
+      ]
+    }
+  ]
+}

package/examples-helpers/buildIssueLikeTable.tsx

@@ -7,7 +7,7 @@ import { IntlProvider } from 'react-intl-next';
 
 import { SmartCardProvider } from '@atlaskit/link-provider';
 import {
-  initialVisibleColumnKeys,
+  defaultInitialVisibleColumnKeys,
   mockDatasourceFetchRequests,
 } from '@atlaskit/link-test-helpers/datasource';
 
@@ -54,7 +54,7 @@ const ExampleBody = ({ isReadonly }: Props) => {
   });
 
   const [visibleColumnKeys, setVisibleColumnKeys] = useState<string[]>(
-    initialVisibleColumnKeys,
+    defaultInitialVisibleColumnKeys,
   );
 
   useEffect(() => {

package/examples-helpers/buildJiraIssuesTable.tsx

@@ -1,7 +1,7 @@
 import React, { useMemo, useState } from 'react';
 
 import {
-  initialVisibleColumnKeys,
+  defaultInitialVisibleColumnKeys,
   mockDatasourceFetchRequests,
 } from '@atlaskit/link-test-helpers/datasource';
 
@@ -14,7 +14,7 @@ export const ExampleJiraIssuesTableView = () => {
   const cloudId = 'some-cloud-id';
 
   const [visibleColumnKeys, setVisibleColumnKeys] = useState<string[]>(
-    initialVisibleColumnKeys,
+    defaultInitialVisibleColumnKeys,
   );
 
   const parameters = useMemo<JiraIssueDatasourceParameters>(

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/link-datasource",
-  "version": "0.33.11",
+  "version": "0.34.0",
   "description": "UI Components to support linking platform dataset feature",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -30,10 +30,12 @@
     "analytics:codegen": "yarn workspace @atlassian/analytics-tooling run analytics:codegen link-datasource --output ./src/analytics/generated"
   },
   "dependencies": {
+    "@atlaskit/adf-schema": "^28.0.0",
     "@atlaskit/analytics-next": "^9.1.3",
     "@atlaskit/avatar": "^21.3.0",
     "@atlaskit/button": "^16.9.0",
     "@atlaskit/dropdown-menu": "^11.11.0",
+    "@atlaskit/editor-prosemirror": "^1.1.0",
     "@atlaskit/empty-state": "^7.5.0",
     "@atlaskit/form": "^8.11.0",
     "@atlaskit/heading": "^1.3.0",