@atlaskit/link-datasource 3.8.7 → 3.8.9

package/CHANGELOG.md

@@ -1,5 +1,20 @@
 # @atlaskit/link-datasource
 
+## 3.8.9
+
+### Patch Changes
+
+- [`e7175d6f8d396`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/e7175d6f8d396) -
+  Adding UFO analytics to inline editable fields for J2WS
+
+## 3.8.8
+
+### Patch Changes
+
+- [#163413](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/163413)
+  [`85d906a810a1d`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/85d906a810a1d) -
+  Fix an issue where all columns don't load from server when picker is opened with React18
+
 ## 3.8.7
 
 ### Patch Changes

package/dist/cjs/analytics/ufoExperiences/index.js

@@ -19,9 +19,17 @@ var columnPickerCustomExperienceConfig = {
   type: _ufo.ExperienceTypes.Operation,
   performanceType: _ufo.ExperiencePerformanceTypes.Custom
 };
+var inlineEditCustomExperienceConfig = {
+  platform: {
+    component: 'datasource'
+  },
+  type: _ufo.ExperienceTypes.Load,
+  performanceType: _ufo.ExperiencePerformanceTypes.InlineResult
+};
 var ufoExperiences = {
   'datasource-rendered': new _ufo.ConcurrentExperience('datasource-rendered', datasourcePageSegmentLoadExperienceConfig),
-  'column-picker-rendered': new _ufo.ConcurrentExperience('column-picker-rendered', columnPickerCustomExperienceConfig)
+  'column-picker-rendered': new _ufo.ConcurrentExperience('column-picker-rendered', columnPickerCustomExperienceConfig),
+  'inline-edit-rendered': new _ufo.ConcurrentExperience('inline-edit-rendered', inlineEditCustomExperienceConfig)
 };
 var startUfoExperience = exports.startUfoExperience = function startUfoExperience(_ref, id) {
   var name = _ref.name,

package/dist/cjs/state/actions/index.js

@@ -169,7 +169,7 @@ var getFieldUpdateActionByAri = function getFieldUpdateActionByAri(state, _ref4)
   }
   return {
     schema: (_state$actionsByInteg = state.actionsByIntegration[integrationKey]) === null || _state$actionsByInteg === void 0 ? void 0 : _state$actionsByInteg[fieldKey],
-    fetchSchema: (_state$actionsByInteg2 = state.actionsByIntegration[integrationKey]) === null || _state$actionsByInteg2 === void 0 ? void 0 : _state$actionsByInteg2[fieldKey].fetchAction
+    fetchSchema: (_state$actionsByInteg2 = state.actionsByIntegration[integrationKey]) === null || _state$actionsByInteg2 === void 0 || (_state$actionsByInteg2 = _state$actionsByInteg2[fieldKey]) === null || _state$actionsByInteg2 === void 0 ? void 0 : _state$actionsByInteg2.fetchAction
   };
 };
 

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

@@ -14,6 +14,9 @@ var _react = _interopRequireWildcard(require("react"));
 var _linkingTypes = require("@atlaskit/linking-types");
 var _lozenge = _interopRequireDefault(require("@atlaskit/lozenge"));
 var _select = _interopRequireDefault(require("@atlaskit/select"));
+var _ufoExperiences = require("../../../../analytics/ufoExperiences");
+var _datasourceExperienceId = require("../../../../contexts/datasource-experience-id");
+var _inlineEdit = require("../../table-cell-content/inline-edit");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 var StatusEditType = function StatusEditType(props) {
@@ -22,10 +25,24 @@ var StatusEditType = function StatusEditType(props) {
     executeFetch = props.executeFetch;
   var _useStatusOptions = useStatusOptions(currentValue, executeFetch),
     options = _useStatusOptions.options,
-    isLoading = _useStatusOptions.isLoading;
-  return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_select.default, (0, _extends2.default)({}, props, {
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop, @atlaskit/design-system/no-unsafe-style-overrides -- Ignored via go/DSP-18766
-    className: "single-select",
+    isLoading = _useStatusOptions.isLoading,
+    hasFailed = _useStatusOptions.hasFailed;
+  var experienceId = (0, _datasourceExperienceId.useDatasourceExperienceId)();
+  (0, _react.useEffect)(function () {
+    if (!experienceId) {
+      return;
+    }
+    if (hasFailed) {
+      (0, _ufoExperiences.failUfoExperience)({
+        name: _inlineEdit.InlineEditUFOExperience
+      }, experienceId);
+    } else if (!isLoading) {
+      (0, _ufoExperiences.succeedUfoExperience)({
+        name: _inlineEdit.InlineEditUFOExperience
+      }, experienceId);
+    }
+  }, [experienceId, isLoading, hasFailed]);
+  return /*#__PURE__*/_react.default.createElement(_select.default, (0, _extends2.default)({}, props, {
     testId: "inline-edit-status",
     autoFocus: true,
     defaultMenuIsOpen: true,
@@ -48,7 +65,7 @@ var StatusEditType = function StatusEditType(props) {
         values: e ? [e] : []
       });
     }
-  })));
+  }));
 };
 var filterOption = function filterOption(option, inputValue) {
   return option.data.text.toLowerCase().includes(inputValue.toLowerCase());
@@ -56,12 +73,14 @@ var filterOption = function filterOption(option, inputValue) {
 var useStatusOptions = function useStatusOptions(currentValue, executeFetch) {
   var _useState = (0, _react.useState)({
       isLoading: true,
-      options: []
+      options: [],
+      hasFailed: false
     }),
     _useState2 = (0, _slicedToArray2.default)(_useState, 2),
     _useState2$ = _useState2[0],
     options = _useState2$.options,
     isLoading = _useState2$.isLoading,
+    hasFailed = _useState2$.hasFailed,
     setOptions = _useState2[1];
   (0, _react.useEffect)(function () {
     var isMounted = true;
@@ -69,9 +88,16 @@ var useStatusOptions = function useStatusOptions(currentValue, executeFetch) {
       if (isMounted) {
         setOptions({
           isLoading: false,
-          options: options
+          options: options,
+          hasFailed: false
         });
       }
+    }).catch(function (err) {
+      setOptions({
+        isLoading: false,
+        options: [],
+        hasFailed: true
+      });
     });
     return function () {
       isMounted = false;
@@ -79,7 +105,8 @@ var useStatusOptions = function useStatusOptions(currentValue, executeFetch) {
   }, [currentValue, executeFetch]);
   return {
     options: options,
-    isLoading: isLoading
+    isLoading: isLoading,
+    hasFailed: hasFailed
   };
 };
 var loadOptions = /*#__PURE__*/function () {
@@ -89,7 +116,7 @@ var loadOptions = /*#__PURE__*/function () {
       while (1) switch (_context.prev = _context.next) {
         case 0:
           if (!executeFetch) {
-            _context.next = 7;
+            _context.next = 9;
             break;
           }
           _context.next = 3;
@@ -97,10 +124,16 @@ var loadOptions = /*#__PURE__*/function () {
         case 3:
           result = _context.sent;
           operationStatus = result.operationStatus, entities = result.entities;
-          if (!(operationStatus === _linkingTypes.ActionOperationStatus.SUCCESS && entities)) {
+          if (!(operationStatus === _linkingTypes.ActionOperationStatus.FAILURE)) {
             _context.next = 7;
             break;
           }
+          throw new Error('Failed to fetch status options');
+        case 7:
+          if (!entities) {
+            _context.next = 9;
+            break;
+          }
           return _context.abrupt("return", entities.map(function (entity) {
             return {
               id: entity.id,
@@ -109,9 +142,9 @@ var loadOptions = /*#__PURE__*/function () {
               transitionId: entity.transitionId
             };
           }));
-        case 7:
+        case 9:
           return _context.abrupt("return", []);
-        case 8:
+        case 10:
         case "end":
           return _context.stop();
       }

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

@@ -1,19 +1,32 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.toTextValue = exports.default = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 var _layering = require("@atlaskit/layering");
 var _textfield = _interopRequireDefault(require("@atlaskit/textfield"));
+var _ufoExperiences = require("../../../../analytics/ufoExperiences");
+var _datasourceExperienceId = require("../../../../contexts/datasource-experience-id");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 var toTextValue = exports.toTextValue = function toTextValue(typeWithValues) {
   var _ref, _typeWithValues$value;
   return (_ref = (_typeWithValues$value = typeWithValues.values) === null || _typeWithValues$value === void 0 ? void 0 : _typeWithValues$value[0]) !== null && _ref !== void 0 ? _ref : '';
 };
 var TextEditType = function TextEditType(props) {
+  var experienceId = (0, _datasourceExperienceId.useDatasourceExperienceId)();
+  (0, _react.useEffect)(function () {
+    if (experienceId) {
+      (0, _ufoExperiences.succeedUfoExperience)({
+        name: 'inline-edit-rendered'
+      }, experienceId);
+    }
+  }, [experienceId]);
   return /*#__PURE__*/_react.default.createElement(_layering.Layering, {
     isDisabled: false
   }, /*#__PURE__*/_react.default.createElement(_textfield.default, (0, _extends2.default)({}, props, {

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

@@ -310,10 +310,10 @@ var IssueLikeDataTableView = exports.IssueLikeDataTableView = function IssueLike
     }
   }, [containerRef]);
   (0, _react.useEffect)(function () {
-    if (!hasFullSchema) {
+    if (orderedColumns.length !== columns.length) {
       setOrderedColumns(getOrderedColumns((0, _toConsumableArray2.default)(columns), (0, _toConsumableArray2.default)(visibleColumnKeys)));
     }
-  }, [columns, visibleColumnKeys, hasFullSchema]);
+  }, [columns, visibleColumnKeys, orderedColumns]);
   (0, _react.useEffect)(function () {
     if (experienceId && status === 'resolved') {
       (0, _ufoExperiences.succeedUfoExperience)({
@@ -602,6 +602,8 @@ var IssueLikeDataTableView = exports.IssueLikeDataTableView = function IssueLike
     }, _callee, null, [[3, 9]]);
   })), [experienceId, extensionKey, hasFullSchema, onLoadDatasourceDetails]);
   var isEditable = onVisibleColumnKeysChange && hasData;
+  var orderedColumnsAreUpToDate = orderedColumns.length === columns.length;
+  var shouldDisplayColumnsInPicker = hasFullSchema && orderedColumnsAreUpToDate;
   var view = (0, _react2.jsx)("div", {
     /* There is required contentEditable={true} in editor-card-plugin
      * But this brakes how DND works. We set contentEditable={false} to allow DND to work
@@ -693,8 +695,8 @@ var IssueLikeDataTableView = exports.IssueLikeDataTableView = function IssueLike
       }, heading);
     }
   }), onVisibleColumnKeysChange && (0, _react2.jsx)(ColumnPickerHeader, null, (0, _react2.jsx)(_columnPicker.ColumnPicker, {
-    columns: hasFullSchema ? orderedColumns : [],
-    selectedColumnKeys: hasFullSchema ? visibleColumnKeys : [],
+    columns: shouldDisplayColumnsInPicker ? orderedColumns : [],
+    selectedColumnKeys: shouldDisplayColumnsInPicker ? visibleColumnKeys : [],
     onSelectedColumnKeysChange: onSelectedColumnKeysChange,
     onOpen: handlePickerOpen
   })))), (0, _react2.jsx)("tbody", {

package/dist/cjs/ui/issue-like-table/table-cell-content/inline-edit.js

@@ -5,7 +5,7 @@ var _typeof3 = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.InlineEdit = void 0;
+exports.InlineEditUFOExperience = exports.InlineEdit = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
@@ -15,6 +15,8 @@ var _inlineEdit = _interopRequireDefault(require("@atlaskit/inline-edit"));
 var _primitives = require("@atlaskit/primitives");
 var _hooks = require("@atlaskit/smart-card/hooks");
 var _analytics = require("../../../analytics");
+var _ufoExperiences = require("../../../analytics/ufoExperiences");
+var _datasourceExperienceId = require("../../../contexts/datasource-experience-id");
 var _useDatasourceTableFlag = require("../../../hooks/useDatasourceTableFlag");
 var _state = require("../../../state");
 var _editType = require("../edit-type");
@@ -22,6 +24,7 @@ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof3(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var InlineEditUFOExperience = exports.InlineEditUFOExperience = 'inline-edit-rendered';
 var editContainerStyles = (0, _primitives.xcss)({
   marginBlockStart: 'space.negative.100'
 });
@@ -94,6 +97,7 @@ var InlineEdit = exports.InlineEdit = function InlineEdit(_ref) {
   var _useDatasourceAnalyti = (0, _analytics.useDatasourceAnalyticsEvents)(),
     fireEvent = _useDatasourceAnalyti.fireEvent;
   var refreshDatasourceItem = useRefreshDatasourceItem(item);
+  var experienceId = (0, _datasourceExperienceId.useDatasourceExperienceId)();
   var onCommitUpdate = (0, _react.useCallback)(function (newValue) {
     if (!item) {
       setIsEditing(false);
@@ -118,6 +122,11 @@ var InlineEdit = exports.InlineEdit = function InlineEdit(_ref) {
   }, [item, columnKey, onUpdateItem, ari, refreshDatasourceItem, fireEvent, execute, showErrorFlag]);
   var onEdit = (0, _react.useCallback)(function () {
     setIsEditing(true);
+    if (experienceId) {
+      (0, _ufoExperiences.startUfoExperience)({
+        name: InlineEditUFOExperience
+      }, experienceId);
+    }
     if (integrationKey && entityType) {
       fireEvent('ui.inlineEdit.clicked.datasource', {
         integrationKey: integrationKey,
@@ -125,7 +134,7 @@ var InlineEdit = exports.InlineEdit = function InlineEdit(_ref) {
         fieldKey: columnKey
       });
     }
-  }, [columnKey, entityType, fireEvent, integrationKey]);
+  }, [columnKey, entityType, experienceId, fireEvent, integrationKey]);
   var onCancelEdit = (0, _react.useCallback)(function () {
     setIsEditing(false);
     if (integrationKey && entityType) {

package/dist/es2019/analytics/ufoExperiences/index.js

@@ -13,9 +13,17 @@ const columnPickerCustomExperienceConfig = {
   type: ExperienceTypes.Operation,
   performanceType: ExperiencePerformanceTypes.Custom
 };
+const inlineEditCustomExperienceConfig = {
+  platform: {
+    component: 'datasource'
+  },
+  type: ExperienceTypes.Load,
+  performanceType: ExperiencePerformanceTypes.InlineResult
+};
 const ufoExperiences = {
   'datasource-rendered': new ConcurrentExperience('datasource-rendered', datasourcePageSegmentLoadExperienceConfig),
-  'column-picker-rendered': new ConcurrentExperience('column-picker-rendered', columnPickerCustomExperienceConfig)
+  'column-picker-rendered': new ConcurrentExperience('column-picker-rendered', columnPickerCustomExperienceConfig),
+  'inline-edit-rendered': new ConcurrentExperience('inline-edit-rendered', inlineEditCustomExperienceConfig)
 };
 export const startUfoExperience = ({
   name,

package/dist/es2019/state/actions/index.js

@@ -144,14 +144,14 @@ const getFieldUpdateActionByAri = (state, {
   fieldKey,
   integrationKey
 }) => {
-  var _state$permissions$ar, _state$permissions$ar2, _state$actionsByInteg, _state$actionsByInteg2;
+  var _state$permissions$ar, _state$permissions$ar2, _state$actionsByInteg, _state$actionsByInteg2, _state$actionsByInteg3;
   const isEditable = (_state$permissions$ar = state.permissions[ari]) === null || _state$permissions$ar === void 0 ? void 0 : (_state$permissions$ar2 = _state$permissions$ar[fieldKey]) === null || _state$permissions$ar2 === void 0 ? void 0 : _state$permissions$ar2.isEditable;
   if (!isEditable) {
     return {};
   }
   return {
     schema: (_state$actionsByInteg = state.actionsByIntegration[integrationKey]) === null || _state$actionsByInteg === void 0 ? void 0 : _state$actionsByInteg[fieldKey],
-    fetchSchema: (_state$actionsByInteg2 = state.actionsByIntegration[integrationKey]) === null || _state$actionsByInteg2 === void 0 ? void 0 : _state$actionsByInteg2[fieldKey].fetchAction
+    fetchSchema: (_state$actionsByInteg2 = state.actionsByIntegration[integrationKey]) === null || _state$actionsByInteg2 === void 0 ? void 0 : (_state$actionsByInteg3 = _state$actionsByInteg2[fieldKey]) === null || _state$actionsByInteg3 === void 0 ? void 0 : _state$actionsByInteg3.fetchAction
   };
 };
 

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

@@ -3,6 +3,9 @@ import React, { useEffect, useState } from 'react';
 import { ActionOperationStatus } from '@atlaskit/linking-types';
 import Lozenge from '@atlaskit/lozenge';
 import Select from '@atlaskit/select';
+import { failUfoExperience, succeedUfoExperience } from "../../../../analytics/ufoExperiences";
+import { useDatasourceExperienceId } from "../../../../contexts/datasource-experience-id";
+import { InlineEditUFOExperience } from "../../table-cell-content/inline-edit";
 const StatusEditType = props => {
   var _currentValue$values;
   const {
@@ -11,11 +14,25 @@ const StatusEditType = props => {
   } = props;
   const {
     options,
-    isLoading
+    isLoading,
+    hasFailed
   } = useStatusOptions(currentValue, executeFetch);
-  return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Select, _extends({}, props, {
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop, @atlaskit/design-system/no-unsafe-style-overrides -- Ignored via go/DSP-18766
-    className: "single-select",
+  const experienceId = useDatasourceExperienceId();
+  useEffect(() => {
+    if (!experienceId) {
+      return;
+    }
+    if (hasFailed) {
+      failUfoExperience({
+        name: InlineEditUFOExperience
+      }, experienceId);
+    } else if (!isLoading) {
+      succeedUfoExperience({
+        name: InlineEditUFOExperience
+      }, experienceId);
+    }
+  }, [experienceId, isLoading, hasFailed]);
+  return /*#__PURE__*/React.createElement(Select, _extends({}, props, {
     testId: "inline-edit-status",
     autoFocus: true,
     defaultMenuIsOpen: true,
@@ -32,16 +49,18 @@ const StatusEditType = props => {
       type: 'status',
       values: e ? [e] : []
     })
-  })));
+  }));
 };
 const filterOption = (option, inputValue) => option.data.text.toLowerCase().includes(inputValue.toLowerCase());
 const useStatusOptions = (currentValue, executeFetch) => {
   const [{
     options,
-    isLoading
+    isLoading,
+    hasFailed
   }, setOptions] = useState({
     isLoading: true,
-    options: []
+    options: [],
+    hasFailed: false
   });
   useEffect(() => {
     let isMounted = true;
@@ -49,9 +68,16 @@ const useStatusOptions = (currentValue, executeFetch) => {
       if (isMounted) {
         setOptions({
           isLoading: false,
-          options
+          options,
+          hasFailed: false
         });
       }
+    }).catch(err => {
+      setOptions({
+        isLoading: false,
+        options: [],
+        hasFailed: true
+      });
     });
     return () => {
       isMounted = false;
@@ -59,7 +85,8 @@ const useStatusOptions = (currentValue, executeFetch) => {
   }, [currentValue, executeFetch]);
   return {
     options,
-    isLoading
+    isLoading,
+    hasFailed
   };
 };
 const loadOptions = async (currentValue, executeFetch) => {
@@ -69,7 +96,10 @@ const loadOptions = async (currentValue, executeFetch) => {
       operationStatus,
       entities
     } = result;
-    if (operationStatus === ActionOperationStatus.SUCCESS && entities) {
+    if (operationStatus === ActionOperationStatus.FAILURE) {
+      throw new Error('Failed to fetch status options');
+    }
+    if (entities) {
       return entities.map(entity => ({
         id: entity.id,
         text: entity.text,

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

@@ -1,12 +1,22 @@
 import _extends from "@babel/runtime/helpers/extends";
-import React from 'react';
+import React, { useEffect } from 'react';
 import { Layering } from '@atlaskit/layering';
 import Textfield from '@atlaskit/textfield';
+import { succeedUfoExperience } from "../../../../analytics/ufoExperiences";
+import { useDatasourceExperienceId } from "../../../../contexts/datasource-experience-id";
 export const toTextValue = typeWithValues => {
   var _ref, _typeWithValues$value;
   return (_ref = (_typeWithValues$value = typeWithValues.values) === null || _typeWithValues$value === void 0 ? void 0 : _typeWithValues$value[0]) !== null && _ref !== void 0 ? _ref : '';
 };
 const TextEditType = props => {
+  const experienceId = useDatasourceExperienceId();
+  useEffect(() => {
+    if (experienceId) {
+      succeedUfoExperience({
+        name: 'inline-edit-rendered'
+      }, experienceId);
+    }
+  }, [experienceId]);
   return /*#__PURE__*/React.createElement(Layering, {
     isDisabled: false
   }, /*#__PURE__*/React.createElement(Textfield, _extends({}, props, {

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

@@ -322,10 +322,10 @@ export const IssueLikeDataTableView = ({
     }
   }, [containerRef]);
   useEffect(() => {
-    if (!hasFullSchema) {
+    if (orderedColumns.length !== columns.length) {
       setOrderedColumns(getOrderedColumns([...columns], [...visibleColumnKeys]));
     }
-  }, [columns, visibleColumnKeys, hasFullSchema]);
+  }, [columns, visibleColumnKeys, orderedColumns]);
   useEffect(() => {
     if (experienceId && status === 'resolved') {
       succeedUfoExperience({
@@ -573,6 +573,8 @@ export const IssueLikeDataTableView = ({
     }
   }, [experienceId, extensionKey, hasFullSchema, onLoadDatasourceDetails]);
   const isEditable = onVisibleColumnKeysChange && hasData;
+  const orderedColumnsAreUpToDate = orderedColumns.length === columns.length;
+  const shouldDisplayColumnsInPicker = hasFullSchema && orderedColumnsAreUpToDate;
   const view = jsx("div", {
     /* There is required contentEditable={true} in editor-card-plugin
      * But this brakes how DND works. We set contentEditable={false} to allow DND to work
@@ -665,8 +667,8 @@ export const IssueLikeDataTableView = ({
       }, heading);
     }
   }), onVisibleColumnKeysChange && jsx(ColumnPickerHeader, null, jsx(ColumnPicker, {
-    columns: hasFullSchema ? orderedColumns : [],
-    selectedColumnKeys: hasFullSchema ? visibleColumnKeys : [],
+    columns: shouldDisplayColumnsInPicker ? orderedColumns : [],
+    selectedColumnKeys: shouldDisplayColumnsInPicker ? visibleColumnKeys : [],
     onSelectedColumnKeysChange: onSelectedColumnKeysChange,
     onOpen: handlePickerOpen
   })))), jsx("tbody", {

package/dist/es2019/ui/issue-like-table/table-cell-content/inline-edit.js

@@ -4,9 +4,12 @@ import AKInlineEdit from '@atlaskit/inline-edit';
 import { Box, xcss } from '@atlaskit/primitives';
 import { useSmartLinkReload } from '@atlaskit/smart-card/hooks';
 import { useDatasourceAnalyticsEvents } from '../../../analytics';
+import { startUfoExperience } from "../../../analytics/ufoExperiences";
+import { useDatasourceExperienceId } from "../../../contexts/datasource-experience-id";
 import { useDatasourceTableFlag } from '../../../hooks/useDatasourceTableFlag';
 import { useDatasourceActions, useDatasourceItem } from '../../../state';
 import { editType } from '../edit-type';
+export const InlineEditUFOExperience = 'inline-edit-rendered';
 const editContainerStyles = xcss({
   marginBlockStart: 'space.negative.100'
 });
@@ -84,6 +87,7 @@ export const InlineEdit = ({
     fireEvent
   } = useDatasourceAnalyticsEvents();
   const refreshDatasourceItem = useRefreshDatasourceItem(item);
+  const experienceId = useDatasourceExperienceId();
   const onCommitUpdate = useCallback(newValue => {
     if (!item) {
       setIsEditing(false);
@@ -108,6 +112,11 @@ export const InlineEdit = ({
   }, [item, columnKey, onUpdateItem, ari, refreshDatasourceItem, fireEvent, execute, showErrorFlag]);
   const onEdit = useCallback(() => {
     setIsEditing(true);
+    if (experienceId) {
+      startUfoExperience({
+        name: InlineEditUFOExperience
+      }, experienceId);
+    }
     if (integrationKey && entityType) {
       fireEvent('ui.inlineEdit.clicked.datasource', {
         integrationKey,
@@ -115,7 +124,7 @@ export const InlineEdit = ({
         fieldKey: columnKey
       });
     }
-  }, [columnKey, entityType, fireEvent, integrationKey]);
+  }, [columnKey, entityType, experienceId, fireEvent, integrationKey]);
   const onCancelEdit = useCallback(() => {
     setIsEditing(false);
     if (integrationKey && entityType) {

package/dist/esm/analytics/ufoExperiences/index.js

@@ -13,9 +13,17 @@ var columnPickerCustomExperienceConfig = {
   type: ExperienceTypes.Operation,
   performanceType: ExperiencePerformanceTypes.Custom
 };
+var inlineEditCustomExperienceConfig = {
+  platform: {
+    component: 'datasource'
+  },
+  type: ExperienceTypes.Load,
+  performanceType: ExperiencePerformanceTypes.InlineResult
+};
 var ufoExperiences = {
   'datasource-rendered': new ConcurrentExperience('datasource-rendered', datasourcePageSegmentLoadExperienceConfig),
-  'column-picker-rendered': new ConcurrentExperience('column-picker-rendered', columnPickerCustomExperienceConfig)
+  'column-picker-rendered': new ConcurrentExperience('column-picker-rendered', columnPickerCustomExperienceConfig),
+  'inline-edit-rendered': new ConcurrentExperience('inline-edit-rendered', inlineEditCustomExperienceConfig)
 };
 export var startUfoExperience = function startUfoExperience(_ref, id) {
   var name = _ref.name,

package/dist/esm/state/actions/index.js

@@ -163,7 +163,7 @@ var getFieldUpdateActionByAri = function getFieldUpdateActionByAri(state, _ref4)
   }
   return {
     schema: (_state$actionsByInteg = state.actionsByIntegration[integrationKey]) === null || _state$actionsByInteg === void 0 ? void 0 : _state$actionsByInteg[fieldKey],
-    fetchSchema: (_state$actionsByInteg2 = state.actionsByIntegration[integrationKey]) === null || _state$actionsByInteg2 === void 0 ? void 0 : _state$actionsByInteg2[fieldKey].fetchAction
+    fetchSchema: (_state$actionsByInteg2 = state.actionsByIntegration[integrationKey]) === null || _state$actionsByInteg2 === void 0 || (_state$actionsByInteg2 = _state$actionsByInteg2[fieldKey]) === null || _state$actionsByInteg2 === void 0 ? void 0 : _state$actionsByInteg2.fetchAction
   };
 };
 

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

@@ -6,16 +6,33 @@ import React, { useEffect, useState } from 'react';
 import { ActionOperationStatus } from '@atlaskit/linking-types';
 import Lozenge from '@atlaskit/lozenge';
 import Select from '@atlaskit/select';
+import { failUfoExperience, succeedUfoExperience } from "../../../../analytics/ufoExperiences";
+import { useDatasourceExperienceId } from "../../../../contexts/datasource-experience-id";
+import { InlineEditUFOExperience } from "../../table-cell-content/inline-edit";
 var StatusEditType = function StatusEditType(props) {
   var _currentValue$values;
   var currentValue = props.currentValue,
     executeFetch = props.executeFetch;
   var _useStatusOptions = useStatusOptions(currentValue, executeFetch),
     options = _useStatusOptions.options,
-    isLoading = _useStatusOptions.isLoading;
-  return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Select, _extends({}, props, {
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop, @atlaskit/design-system/no-unsafe-style-overrides -- Ignored via go/DSP-18766
-    className: "single-select",
+    isLoading = _useStatusOptions.isLoading,
+    hasFailed = _useStatusOptions.hasFailed;
+  var experienceId = useDatasourceExperienceId();
+  useEffect(function () {
+    if (!experienceId) {
+      return;
+    }
+    if (hasFailed) {
+      failUfoExperience({
+        name: InlineEditUFOExperience
+      }, experienceId);
+    } else if (!isLoading) {
+      succeedUfoExperience({
+        name: InlineEditUFOExperience
+      }, experienceId);
+    }
+  }, [experienceId, isLoading, hasFailed]);
+  return /*#__PURE__*/React.createElement(Select, _extends({}, props, {
     testId: "inline-edit-status",
     autoFocus: true,
     defaultMenuIsOpen: true,
@@ -38,7 +55,7 @@ var StatusEditType = function StatusEditType(props) {
         values: e ? [e] : []
       });
     }
-  })));
+  }));
 };
 var filterOption = function filterOption(option, inputValue) {
   return option.data.text.toLowerCase().includes(inputValue.toLowerCase());
@@ -46,12 +63,14 @@ var filterOption = function filterOption(option, inputValue) {
 var useStatusOptions = function useStatusOptions(currentValue, executeFetch) {
   var _useState = useState({
       isLoading: true,
-      options: []
+      options: [],
+      hasFailed: false
     }),
     _useState2 = _slicedToArray(_useState, 2),
     _useState2$ = _useState2[0],
     options = _useState2$.options,
     isLoading = _useState2$.isLoading,
+    hasFailed = _useState2$.hasFailed,
     setOptions = _useState2[1];
   useEffect(function () {
     var isMounted = true;
@@ -59,9 +78,16 @@ var useStatusOptions = function useStatusOptions(currentValue, executeFetch) {
       if (isMounted) {
         setOptions({
           isLoading: false,
-          options: options
+          options: options,
+          hasFailed: false
         });
       }
+    }).catch(function (err) {
+      setOptions({
+        isLoading: false,
+        options: [],
+        hasFailed: true
+      });
     });
     return function () {
       isMounted = false;
@@ -69,7 +95,8 @@ var useStatusOptions = function useStatusOptions(currentValue, executeFetch) {
   }, [currentValue, executeFetch]);
   return {
     options: options,
-    isLoading: isLoading
+    isLoading: isLoading,
+    hasFailed: hasFailed
   };
 };
 var loadOptions = /*#__PURE__*/function () {
@@ -79,7 +106,7 @@ var loadOptions = /*#__PURE__*/function () {
       while (1) switch (_context.prev = _context.next) {
         case 0:
           if (!executeFetch) {
-            _context.next = 7;
+            _context.next = 9;
             break;
           }
           _context.next = 3;
@@ -87,10 +114,16 @@ var loadOptions = /*#__PURE__*/function () {
         case 3:
           result = _context.sent;
           operationStatus = result.operationStatus, entities = result.entities;
-          if (!(operationStatus === ActionOperationStatus.SUCCESS && entities)) {
+          if (!(operationStatus === ActionOperationStatus.FAILURE)) {
             _context.next = 7;
             break;
           }
+          throw new Error('Failed to fetch status options');
+        case 7:
+          if (!entities) {
+            _context.next = 9;
+            break;
+          }
           return _context.abrupt("return", entities.map(function (entity) {
             return {
               id: entity.id,
@@ -99,9 +132,9 @@ var loadOptions = /*#__PURE__*/function () {
               transitionId: entity.transitionId
             };
           }));
-        case 7:
+        case 9:
           return _context.abrupt("return", []);
-        case 8:
+        case 10:
         case "end":
           return _context.stop();
       }

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

@@ -1,12 +1,22 @@
 import _extends from "@babel/runtime/helpers/extends";
-import React from 'react';
+import React, { useEffect } from 'react';
 import { Layering } from '@atlaskit/layering';
 import Textfield from '@atlaskit/textfield';
+import { succeedUfoExperience } from "../../../../analytics/ufoExperiences";
+import { useDatasourceExperienceId } from "../../../../contexts/datasource-experience-id";
 export var toTextValue = function toTextValue(typeWithValues) {
   var _ref, _typeWithValues$value;
   return (_ref = (_typeWithValues$value = typeWithValues.values) === null || _typeWithValues$value === void 0 ? void 0 : _typeWithValues$value[0]) !== null && _ref !== void 0 ? _ref : '';
 };
 var TextEditType = function TextEditType(props) {
+  var experienceId = useDatasourceExperienceId();
+  useEffect(function () {
+    if (experienceId) {
+      succeedUfoExperience({
+        name: 'inline-edit-rendered'
+      }, experienceId);
+    }
+  }, [experienceId]);
   return /*#__PURE__*/React.createElement(Layering, {
     isDisabled: false
   }, /*#__PURE__*/React.createElement(Textfield, _extends({}, props, {

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

@@ -306,10 +306,10 @@ export var IssueLikeDataTableView = function IssueLikeDataTableView(_ref5) {
     }
   }, [containerRef]);
   useEffect(function () {
-    if (!hasFullSchema) {
+    if (orderedColumns.length !== columns.length) {
       setOrderedColumns(getOrderedColumns(_toConsumableArray(columns), _toConsumableArray(visibleColumnKeys)));
     }
-  }, [columns, visibleColumnKeys, hasFullSchema]);
+  }, [columns, visibleColumnKeys, orderedColumns]);
   useEffect(function () {
     if (experienceId && status === 'resolved') {
       succeedUfoExperience({
@@ -598,6 +598,8 @@ export var IssueLikeDataTableView = function IssueLikeDataTableView(_ref5) {
     }, _callee, null, [[3, 9]]);
   })), [experienceId, extensionKey, hasFullSchema, onLoadDatasourceDetails]);
   var isEditable = onVisibleColumnKeysChange && hasData;
+  var orderedColumnsAreUpToDate = orderedColumns.length === columns.length;
+  var shouldDisplayColumnsInPicker = hasFullSchema && orderedColumnsAreUpToDate;
   var view = jsx("div", {
     /* There is required contentEditable={true} in editor-card-plugin
      * But this brakes how DND works. We set contentEditable={false} to allow DND to work
@@ -689,8 +691,8 @@ export var IssueLikeDataTableView = function IssueLikeDataTableView(_ref5) {
       }, heading);
     }
   }), onVisibleColumnKeysChange && jsx(ColumnPickerHeader, null, jsx(ColumnPicker, {
-    columns: hasFullSchema ? orderedColumns : [],
-    selectedColumnKeys: hasFullSchema ? visibleColumnKeys : [],
+    columns: shouldDisplayColumnsInPicker ? orderedColumns : [],
+    selectedColumnKeys: shouldDisplayColumnsInPicker ? visibleColumnKeys : [],
     onSelectedColumnKeysChange: onSelectedColumnKeysChange,
     onOpen: handlePickerOpen
   })))), jsx("tbody", {

package/dist/esm/ui/issue-like-table/table-cell-content/inline-edit.js

@@ -9,9 +9,12 @@ import AKInlineEdit from '@atlaskit/inline-edit';
 import { Box, xcss } from '@atlaskit/primitives';
 import { useSmartLinkReload } from '@atlaskit/smart-card/hooks';
 import { useDatasourceAnalyticsEvents } from '../../../analytics';
+import { startUfoExperience } from "../../../analytics/ufoExperiences";
+import { useDatasourceExperienceId } from "../../../contexts/datasource-experience-id";
 import { useDatasourceTableFlag } from '../../../hooks/useDatasourceTableFlag';
 import { useDatasourceActions, useDatasourceItem } from '../../../state';
 import { editType } from '../edit-type';
+export var InlineEditUFOExperience = 'inline-edit-rendered';
 var editContainerStyles = xcss({
   marginBlockStart: 'space.negative.100'
 });
@@ -84,6 +87,7 @@ export var InlineEdit = function InlineEdit(_ref) {
   var _useDatasourceAnalyti = useDatasourceAnalyticsEvents(),
     fireEvent = _useDatasourceAnalyti.fireEvent;
   var refreshDatasourceItem = useRefreshDatasourceItem(item);
+  var experienceId = useDatasourceExperienceId();
   var onCommitUpdate = useCallback(function (newValue) {
     if (!item) {
       setIsEditing(false);
@@ -108,6 +112,11 @@ export var InlineEdit = function InlineEdit(_ref) {
   }, [item, columnKey, onUpdateItem, ari, refreshDatasourceItem, fireEvent, execute, showErrorFlag]);
   var onEdit = useCallback(function () {
     setIsEditing(true);
+    if (experienceId) {
+      startUfoExperience({
+        name: InlineEditUFOExperience
+      }, experienceId);
+    }
     if (integrationKey && entityType) {
       fireEvent('ui.inlineEdit.clicked.datasource', {
         integrationKey: integrationKey,
@@ -115,7 +124,7 @@ export var InlineEdit = function InlineEdit(_ref) {
         fieldKey: columnKey
       });
     }
-  }, [columnKey, entityType, fireEvent, integrationKey]);
+  }, [columnKey, entityType, experienceId, fireEvent, integrationKey]);
   var onCancelEdit = useCallback(function () {
     setIsEditing(false);
     if (integrationKey && entityType) {

package/dist/types/analytics/ufoExperiences/types.d.ts

@@ -10,5 +10,11 @@ interface ColumnPickerRendered {
         extensionKey?: string;
     };
 }
-export type UfoExperience = DatasourceRendered | ColumnPickerRendered;
+interface InlineEditRendered {
+    name: 'inline-edit-rendered';
+    metadata?: {
+        extensionKey?: string;
+    };
+}
+export type UfoExperience = DatasourceRendered | ColumnPickerRendered | InlineEditRendered;
 export {};

package/dist/types/hooks/useDatasourceTableState.d.ts

@@ -19,7 +19,7 @@ export interface DatasourceTableState {
     /** Resets state of the hook to be as if it is a first time it is being called. */
     reset: (options?: ResetOptions) => void;
     /** Requests the available column schemas that can be displayed within the table */
-    loadDatasourceDetails: () => void;
+    loadDatasourceDetails: () => Promise<void>;
     /** Item ids to be hydrated from a store by consumers [NOTE: They must be in the same order as responseItems] */
     responseItemIds: string[];
     /** Items to be rendered within the table */

package/dist/types/ui/assets-modal/modal/render-assets-content/index.d.ts

@@ -11,7 +11,7 @@ export interface RenderAssetsContentProps {
     schemaId?: string;
     onNextPage: () => void;
     hasNextPage: boolean;
-    loadDatasourceDetails: () => void;
+    loadDatasourceDetails: () => Promise<void>;
     columns: DatasourceResponseSchemaProperty[];
     defaultVisibleColumnKeys: string[];
     onVisibleColumnKeysChange: (visibleColumnKeys: string[]) => void;

package/dist/types/ui/issue-like-table/table-cell-content/inline-edit.d.ts

@@ -1,6 +1,7 @@
 import React from 'react';
 import { type AtomicActionExecuteResponse } from '@atlaskit/linking-types';
 import type { DatasourceTypeWithOnlyValues } from '../types';
+export declare const InlineEditUFOExperience = "inline-edit-rendered";
 interface InlineEditProps {
     ari: string;
     columnKey: string;

package/dist/types/ui/issue-like-table/types.d.ts

@@ -34,7 +34,7 @@ export interface IssueLikeDataTableViewProps {
     items: DatasourceDataResponseItem[];
     itemIds: string[];
     onNextPage: NextPageType;
-    onLoadDatasourceDetails: () => void;
+    onLoadDatasourceDetails: () => Promise<void>;
     /**
      * A function to define new or override existing render components.
      * eg:

package/dist/types-ts4.5/analytics/ufoExperiences/types.d.ts

@@ -10,5 +10,11 @@ interface ColumnPickerRendered {
         extensionKey?: string;
     };
 }
-export type UfoExperience = DatasourceRendered | ColumnPickerRendered;
+interface InlineEditRendered {
+    name: 'inline-edit-rendered';
+    metadata?: {
+        extensionKey?: string;
+    };
+}
+export type UfoExperience = DatasourceRendered | ColumnPickerRendered | InlineEditRendered;
 export {};

package/dist/types-ts4.5/hooks/useDatasourceTableState.d.ts

@@ -19,7 +19,7 @@ export interface DatasourceTableState {
     /** Resets state of the hook to be as if it is a first time it is being called. */
     reset: (options?: ResetOptions) => void;
     /** Requests the available column schemas that can be displayed within the table */
-    loadDatasourceDetails: () => void;
+    loadDatasourceDetails: () => Promise<void>;
     /** Item ids to be hydrated from a store by consumers [NOTE: They must be in the same order as responseItems] */
     responseItemIds: string[];
     /** Items to be rendered within the table */

package/dist/types-ts4.5/ui/assets-modal/modal/render-assets-content/index.d.ts

@@ -11,7 +11,7 @@ export interface RenderAssetsContentProps {
     schemaId?: string;
     onNextPage: () => void;
     hasNextPage: boolean;
-    loadDatasourceDetails: () => void;
+    loadDatasourceDetails: () => Promise<void>;
     columns: DatasourceResponseSchemaProperty[];
     defaultVisibleColumnKeys: string[];
     onVisibleColumnKeysChange: (visibleColumnKeys: string[]) => void;

package/dist/types-ts4.5/ui/issue-like-table/table-cell-content/inline-edit.d.ts

@@ -1,6 +1,7 @@
 import React from 'react';
 import { type AtomicActionExecuteResponse } from '@atlaskit/linking-types';
 import type { DatasourceTypeWithOnlyValues } from '../types';
+export declare const InlineEditUFOExperience = "inline-edit-rendered";
 interface InlineEditProps {
     ari: string;
     columnKey: string;

package/dist/types-ts4.5/ui/issue-like-table/types.d.ts

@@ -34,7 +34,7 @@ export interface IssueLikeDataTableViewProps {
     items: DatasourceDataResponseItem[];
     itemIds: string[];
     onNextPage: NextPageType;
-    onLoadDatasourceDetails: () => void;
+    onLoadDatasourceDetails: () => Promise<void>;
     /**
      * A function to define new or override existing render components.
      * eg:

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/link-datasource",
-	"version": "3.8.7",
+	"version": "3.8.9",
 	"description": "UI Components to support linking platform dataset feature",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -56,7 +56,7 @@
 		"@atlaskit/jql-ast": "^3.3.0",
 		"@atlaskit/jql-editor": "^4.10.0",
 		"@atlaskit/jql-editor-autocomplete-rest": "^2.1.0",
-		"@atlaskit/layering": "^0.7.0",
+		"@atlaskit/layering": "^0.7.3",
 		"@atlaskit/link-client-extension": "^2.4.0",
 		"@atlaskit/linking-common": "^6.0.0",
 		"@atlaskit/linking-types": "^9.5.0",