@atlaskit/link-datasource 3.8.8 → 3.8.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,12 @@
1
1
  # @atlaskit/link-datasource
2
2
 
3
+ ## 3.8.9
4
+
5
+ ### Patch Changes
6
+
7
+ - [`e7175d6f8d396`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/e7175d6f8d396) -
8
+ Adding UFO analytics to inline editable fields for J2WS
9
+
3
10
  ## 3.8.8
4
11
 
5
12
  ### Patch Changes
@@ -19,9 +19,17 @@ var columnPickerCustomExperienceConfig = {
19
19
  type: _ufo.ExperienceTypes.Operation,
20
20
  performanceType: _ufo.ExperiencePerformanceTypes.Custom
21
21
  };
22
+ var inlineEditCustomExperienceConfig = {
23
+ platform: {
24
+ component: 'datasource'
25
+ },
26
+ type: _ufo.ExperienceTypes.Load,
27
+ performanceType: _ufo.ExperiencePerformanceTypes.InlineResult
28
+ };
22
29
  var ufoExperiences = {
23
30
  'datasource-rendered': new _ufo.ConcurrentExperience('datasource-rendered', datasourcePageSegmentLoadExperienceConfig),
24
- 'column-picker-rendered': new _ufo.ConcurrentExperience('column-picker-rendered', columnPickerCustomExperienceConfig)
31
+ 'column-picker-rendered': new _ufo.ConcurrentExperience('column-picker-rendered', columnPickerCustomExperienceConfig),
32
+ 'inline-edit-rendered': new _ufo.ConcurrentExperience('inline-edit-rendered', inlineEditCustomExperienceConfig)
25
33
  };
26
34
  var startUfoExperience = exports.startUfoExperience = function startUfoExperience(_ref, id) {
27
35
  var name = _ref.name,
@@ -169,7 +169,7 @@ var getFieldUpdateActionByAri = function getFieldUpdateActionByAri(state, _ref4)
169
169
  }
170
170
  return {
171
171
  schema: (_state$actionsByInteg = state.actionsByIntegration[integrationKey]) === null || _state$actionsByInteg === void 0 ? void 0 : _state$actionsByInteg[fieldKey],
172
- fetchSchema: (_state$actionsByInteg2 = state.actionsByIntegration[integrationKey]) === null || _state$actionsByInteg2 === void 0 ? void 0 : _state$actionsByInteg2[fieldKey].fetchAction
172
+ 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
173
173
  };
174
174
  };
175
175
 
@@ -14,6 +14,9 @@ var _react = _interopRequireWildcard(require("react"));
14
14
  var _linkingTypes = require("@atlaskit/linking-types");
15
15
  var _lozenge = _interopRequireDefault(require("@atlaskit/lozenge"));
16
16
  var _select = _interopRequireDefault(require("@atlaskit/select"));
17
+ var _ufoExperiences = require("../../../../analytics/ufoExperiences");
18
+ var _datasourceExperienceId = require("../../../../contexts/datasource-experience-id");
19
+ var _inlineEdit = require("../../table-cell-content/inline-edit");
17
20
  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); }
18
21
  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; }
19
22
  var StatusEditType = function StatusEditType(props) {
@@ -22,10 +25,24 @@ var StatusEditType = function StatusEditType(props) {
22
25
  executeFetch = props.executeFetch;
23
26
  var _useStatusOptions = useStatusOptions(currentValue, executeFetch),
24
27
  options = _useStatusOptions.options,
25
- isLoading = _useStatusOptions.isLoading;
26
- return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_select.default, (0, _extends2.default)({}, props, {
27
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop, @atlaskit/design-system/no-unsafe-style-overrides -- Ignored via go/DSP-18766
28
- className: "single-select",
28
+ isLoading = _useStatusOptions.isLoading,
29
+ hasFailed = _useStatusOptions.hasFailed;
30
+ var experienceId = (0, _datasourceExperienceId.useDatasourceExperienceId)();
31
+ (0, _react.useEffect)(function () {
32
+ if (!experienceId) {
33
+ return;
34
+ }
35
+ if (hasFailed) {
36
+ (0, _ufoExperiences.failUfoExperience)({
37
+ name: _inlineEdit.InlineEditUFOExperience
38
+ }, experienceId);
39
+ } else if (!isLoading) {
40
+ (0, _ufoExperiences.succeedUfoExperience)({
41
+ name: _inlineEdit.InlineEditUFOExperience
42
+ }, experienceId);
43
+ }
44
+ }, [experienceId, isLoading, hasFailed]);
45
+ return /*#__PURE__*/_react.default.createElement(_select.default, (0, _extends2.default)({}, props, {
29
46
  testId: "inline-edit-status",
30
47
  autoFocus: true,
31
48
  defaultMenuIsOpen: true,
@@ -48,7 +65,7 @@ var StatusEditType = function StatusEditType(props) {
48
65
  values: e ? [e] : []
49
66
  });
50
67
  }
51
- })));
68
+ }));
52
69
  };
53
70
  var filterOption = function filterOption(option, inputValue) {
54
71
  return option.data.text.toLowerCase().includes(inputValue.toLowerCase());
@@ -56,12 +73,14 @@ var filterOption = function filterOption(option, inputValue) {
56
73
  var useStatusOptions = function useStatusOptions(currentValue, executeFetch) {
57
74
  var _useState = (0, _react.useState)({
58
75
  isLoading: true,
59
- options: []
76
+ options: [],
77
+ hasFailed: false
60
78
  }),
61
79
  _useState2 = (0, _slicedToArray2.default)(_useState, 2),
62
80
  _useState2$ = _useState2[0],
63
81
  options = _useState2$.options,
64
82
  isLoading = _useState2$.isLoading,
83
+ hasFailed = _useState2$.hasFailed,
65
84
  setOptions = _useState2[1];
66
85
  (0, _react.useEffect)(function () {
67
86
  var isMounted = true;
@@ -69,9 +88,16 @@ var useStatusOptions = function useStatusOptions(currentValue, executeFetch) {
69
88
  if (isMounted) {
70
89
  setOptions({
71
90
  isLoading: false,
72
- options: options
91
+ options: options,
92
+ hasFailed: false
73
93
  });
74
94
  }
95
+ }).catch(function (err) {
96
+ setOptions({
97
+ isLoading: false,
98
+ options: [],
99
+ hasFailed: true
100
+ });
75
101
  });
76
102
  return function () {
77
103
  isMounted = false;
@@ -79,7 +105,8 @@ var useStatusOptions = function useStatusOptions(currentValue, executeFetch) {
79
105
  }, [currentValue, executeFetch]);
80
106
  return {
81
107
  options: options,
82
- isLoading: isLoading
108
+ isLoading: isLoading,
109
+ hasFailed: hasFailed
83
110
  };
84
111
  };
85
112
  var loadOptions = /*#__PURE__*/function () {
@@ -89,7 +116,7 @@ var loadOptions = /*#__PURE__*/function () {
89
116
  while (1) switch (_context.prev = _context.next) {
90
117
  case 0:
91
118
  if (!executeFetch) {
92
- _context.next = 7;
119
+ _context.next = 9;
93
120
  break;
94
121
  }
95
122
  _context.next = 3;
@@ -97,10 +124,16 @@ var loadOptions = /*#__PURE__*/function () {
97
124
  case 3:
98
125
  result = _context.sent;
99
126
  operationStatus = result.operationStatus, entities = result.entities;
100
- if (!(operationStatus === _linkingTypes.ActionOperationStatus.SUCCESS && entities)) {
127
+ if (!(operationStatus === _linkingTypes.ActionOperationStatus.FAILURE)) {
101
128
  _context.next = 7;
102
129
  break;
103
130
  }
131
+ throw new Error('Failed to fetch status options');
132
+ case 7:
133
+ if (!entities) {
134
+ _context.next = 9;
135
+ break;
136
+ }
104
137
  return _context.abrupt("return", entities.map(function (entity) {
105
138
  return {
106
139
  id: entity.id,
@@ -109,9 +142,9 @@ var loadOptions = /*#__PURE__*/function () {
109
142
  transitionId: entity.transitionId
110
143
  };
111
144
  }));
112
- case 7:
145
+ case 9:
113
146
  return _context.abrupt("return", []);
114
- case 8:
147
+ case 10:
115
148
  case "end":
116
149
  return _context.stop();
117
150
  }
@@ -1,19 +1,32 @@
1
1
  "use strict";
2
2
 
3
3
  var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ var _typeof = require("@babel/runtime/helpers/typeof");
4
5
  Object.defineProperty(exports, "__esModule", {
5
6
  value: true
6
7
  });
7
8
  exports.toTextValue = exports.default = void 0;
8
9
  var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
9
- var _react = _interopRequireDefault(require("react"));
10
+ var _react = _interopRequireWildcard(require("react"));
10
11
  var _layering = require("@atlaskit/layering");
11
12
  var _textfield = _interopRequireDefault(require("@atlaskit/textfield"));
13
+ var _ufoExperiences = require("../../../../analytics/ufoExperiences");
14
+ var _datasourceExperienceId = require("../../../../contexts/datasource-experience-id");
15
+ 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); }
16
+ 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; }
12
17
  var toTextValue = exports.toTextValue = function toTextValue(typeWithValues) {
13
18
  var _ref, _typeWithValues$value;
14
19
  return (_ref = (_typeWithValues$value = typeWithValues.values) === null || _typeWithValues$value === void 0 ? void 0 : _typeWithValues$value[0]) !== null && _ref !== void 0 ? _ref : '';
15
20
  };
16
21
  var TextEditType = function TextEditType(props) {
22
+ var experienceId = (0, _datasourceExperienceId.useDatasourceExperienceId)();
23
+ (0, _react.useEffect)(function () {
24
+ if (experienceId) {
25
+ (0, _ufoExperiences.succeedUfoExperience)({
26
+ name: 'inline-edit-rendered'
27
+ }, experienceId);
28
+ }
29
+ }, [experienceId]);
17
30
  return /*#__PURE__*/_react.default.createElement(_layering.Layering, {
18
31
  isDisabled: false
19
32
  }, /*#__PURE__*/_react.default.createElement(_textfield.default, (0, _extends2.default)({}, props, {
@@ -5,7 +5,7 @@ var _typeof3 = require("@babel/runtime/helpers/typeof");
5
5
  Object.defineProperty(exports, "__esModule", {
6
6
  value: true
7
7
  });
8
- exports.InlineEdit = void 0;
8
+ exports.InlineEditUFOExperience = exports.InlineEdit = void 0;
9
9
  var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
10
10
  var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
11
11
  var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
@@ -15,6 +15,8 @@ var _inlineEdit = _interopRequireDefault(require("@atlaskit/inline-edit"));
15
15
  var _primitives = require("@atlaskit/primitives");
16
16
  var _hooks = require("@atlaskit/smart-card/hooks");
17
17
  var _analytics = require("../../../analytics");
18
+ var _ufoExperiences = require("../../../analytics/ufoExperiences");
19
+ var _datasourceExperienceId = require("../../../contexts/datasource-experience-id");
18
20
  var _useDatasourceTableFlag = require("../../../hooks/useDatasourceTableFlag");
19
21
  var _state = require("../../../state");
20
22
  var _editType = require("../edit-type");
@@ -22,6 +24,7 @@ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return
22
24
  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; }
23
25
  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; }
24
26
  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; }
27
+ var InlineEditUFOExperience = exports.InlineEditUFOExperience = 'inline-edit-rendered';
25
28
  var editContainerStyles = (0, _primitives.xcss)({
26
29
  marginBlockStart: 'space.negative.100'
27
30
  });
@@ -94,6 +97,7 @@ var InlineEdit = exports.InlineEdit = function InlineEdit(_ref) {
94
97
  var _useDatasourceAnalyti = (0, _analytics.useDatasourceAnalyticsEvents)(),
95
98
  fireEvent = _useDatasourceAnalyti.fireEvent;
96
99
  var refreshDatasourceItem = useRefreshDatasourceItem(item);
100
+ var experienceId = (0, _datasourceExperienceId.useDatasourceExperienceId)();
97
101
  var onCommitUpdate = (0, _react.useCallback)(function (newValue) {
98
102
  if (!item) {
99
103
  setIsEditing(false);
@@ -118,6 +122,11 @@ var InlineEdit = exports.InlineEdit = function InlineEdit(_ref) {
118
122
  }, [item, columnKey, onUpdateItem, ari, refreshDatasourceItem, fireEvent, execute, showErrorFlag]);
119
123
  var onEdit = (0, _react.useCallback)(function () {
120
124
  setIsEditing(true);
125
+ if (experienceId) {
126
+ (0, _ufoExperiences.startUfoExperience)({
127
+ name: InlineEditUFOExperience
128
+ }, experienceId);
129
+ }
121
130
  if (integrationKey && entityType) {
122
131
  fireEvent('ui.inlineEdit.clicked.datasource', {
123
132
  integrationKey: integrationKey,
@@ -125,7 +134,7 @@ var InlineEdit = exports.InlineEdit = function InlineEdit(_ref) {
125
134
  fieldKey: columnKey
126
135
  });
127
136
  }
128
- }, [columnKey, entityType, fireEvent, integrationKey]);
137
+ }, [columnKey, entityType, experienceId, fireEvent, integrationKey]);
129
138
  var onCancelEdit = (0, _react.useCallback)(function () {
130
139
  setIsEditing(false);
131
140
  if (integrationKey && entityType) {
@@ -13,9 +13,17 @@ const columnPickerCustomExperienceConfig = {
13
13
  type: ExperienceTypes.Operation,
14
14
  performanceType: ExperiencePerformanceTypes.Custom
15
15
  };
16
+ const inlineEditCustomExperienceConfig = {
17
+ platform: {
18
+ component: 'datasource'
19
+ },
20
+ type: ExperienceTypes.Load,
21
+ performanceType: ExperiencePerformanceTypes.InlineResult
22
+ };
16
23
  const ufoExperiences = {
17
24
  'datasource-rendered': new ConcurrentExperience('datasource-rendered', datasourcePageSegmentLoadExperienceConfig),
18
- 'column-picker-rendered': new ConcurrentExperience('column-picker-rendered', columnPickerCustomExperienceConfig)
25
+ 'column-picker-rendered': new ConcurrentExperience('column-picker-rendered', columnPickerCustomExperienceConfig),
26
+ 'inline-edit-rendered': new ConcurrentExperience('inline-edit-rendered', inlineEditCustomExperienceConfig)
19
27
  };
20
28
  export const startUfoExperience = ({
21
29
  name,
@@ -144,14 +144,14 @@ const getFieldUpdateActionByAri = (state, {
144
144
  fieldKey,
145
145
  integrationKey
146
146
  }) => {
147
- var _state$permissions$ar, _state$permissions$ar2, _state$actionsByInteg, _state$actionsByInteg2;
147
+ var _state$permissions$ar, _state$permissions$ar2, _state$actionsByInteg, _state$actionsByInteg2, _state$actionsByInteg3;
148
148
  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;
149
149
  if (!isEditable) {
150
150
  return {};
151
151
  }
152
152
  return {
153
153
  schema: (_state$actionsByInteg = state.actionsByIntegration[integrationKey]) === null || _state$actionsByInteg === void 0 ? void 0 : _state$actionsByInteg[fieldKey],
154
- fetchSchema: (_state$actionsByInteg2 = state.actionsByIntegration[integrationKey]) === null || _state$actionsByInteg2 === void 0 ? void 0 : _state$actionsByInteg2[fieldKey].fetchAction
154
+ 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
155
155
  };
156
156
  };
157
157
 
@@ -3,6 +3,9 @@ import React, { useEffect, useState } from 'react';
3
3
  import { ActionOperationStatus } from '@atlaskit/linking-types';
4
4
  import Lozenge from '@atlaskit/lozenge';
5
5
  import Select from '@atlaskit/select';
6
+ import { failUfoExperience, succeedUfoExperience } from "../../../../analytics/ufoExperiences";
7
+ import { useDatasourceExperienceId } from "../../../../contexts/datasource-experience-id";
8
+ import { InlineEditUFOExperience } from "../../table-cell-content/inline-edit";
6
9
  const StatusEditType = props => {
7
10
  var _currentValue$values;
8
11
  const {
@@ -11,11 +14,25 @@ const StatusEditType = props => {
11
14
  } = props;
12
15
  const {
13
16
  options,
14
- isLoading
17
+ isLoading,
18
+ hasFailed
15
19
  } = useStatusOptions(currentValue, executeFetch);
16
- return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Select, _extends({}, props, {
17
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop, @atlaskit/design-system/no-unsafe-style-overrides -- Ignored via go/DSP-18766
18
- className: "single-select",
20
+ const experienceId = useDatasourceExperienceId();
21
+ useEffect(() => {
22
+ if (!experienceId) {
23
+ return;
24
+ }
25
+ if (hasFailed) {
26
+ failUfoExperience({
27
+ name: InlineEditUFOExperience
28
+ }, experienceId);
29
+ } else if (!isLoading) {
30
+ succeedUfoExperience({
31
+ name: InlineEditUFOExperience
32
+ }, experienceId);
33
+ }
34
+ }, [experienceId, isLoading, hasFailed]);
35
+ return /*#__PURE__*/React.createElement(Select, _extends({}, props, {
19
36
  testId: "inline-edit-status",
20
37
  autoFocus: true,
21
38
  defaultMenuIsOpen: true,
@@ -32,16 +49,18 @@ const StatusEditType = props => {
32
49
  type: 'status',
33
50
  values: e ? [e] : []
34
51
  })
35
- })));
52
+ }));
36
53
  };
37
54
  const filterOption = (option, inputValue) => option.data.text.toLowerCase().includes(inputValue.toLowerCase());
38
55
  const useStatusOptions = (currentValue, executeFetch) => {
39
56
  const [{
40
57
  options,
41
- isLoading
58
+ isLoading,
59
+ hasFailed
42
60
  }, setOptions] = useState({
43
61
  isLoading: true,
44
- options: []
62
+ options: [],
63
+ hasFailed: false
45
64
  });
46
65
  useEffect(() => {
47
66
  let isMounted = true;
@@ -49,9 +68,16 @@ const useStatusOptions = (currentValue, executeFetch) => {
49
68
  if (isMounted) {
50
69
  setOptions({
51
70
  isLoading: false,
52
- options
71
+ options,
72
+ hasFailed: false
53
73
  });
54
74
  }
75
+ }).catch(err => {
76
+ setOptions({
77
+ isLoading: false,
78
+ options: [],
79
+ hasFailed: true
80
+ });
55
81
  });
56
82
  return () => {
57
83
  isMounted = false;
@@ -59,7 +85,8 @@ const useStatusOptions = (currentValue, executeFetch) => {
59
85
  }, [currentValue, executeFetch]);
60
86
  return {
61
87
  options,
62
- isLoading
88
+ isLoading,
89
+ hasFailed
63
90
  };
64
91
  };
65
92
  const loadOptions = async (currentValue, executeFetch) => {
@@ -69,7 +96,10 @@ const loadOptions = async (currentValue, executeFetch) => {
69
96
  operationStatus,
70
97
  entities
71
98
  } = result;
72
- if (operationStatus === ActionOperationStatus.SUCCESS && entities) {
99
+ if (operationStatus === ActionOperationStatus.FAILURE) {
100
+ throw new Error('Failed to fetch status options');
101
+ }
102
+ if (entities) {
73
103
  return entities.map(entity => ({
74
104
  id: entity.id,
75
105
  text: entity.text,
@@ -1,12 +1,22 @@
1
1
  import _extends from "@babel/runtime/helpers/extends";
2
- import React from 'react';
2
+ import React, { useEffect } from 'react';
3
3
  import { Layering } from '@atlaskit/layering';
4
4
  import Textfield from '@atlaskit/textfield';
5
+ import { succeedUfoExperience } from "../../../../analytics/ufoExperiences";
6
+ import { useDatasourceExperienceId } from "../../../../contexts/datasource-experience-id";
5
7
  export const toTextValue = typeWithValues => {
6
8
  var _ref, _typeWithValues$value;
7
9
  return (_ref = (_typeWithValues$value = typeWithValues.values) === null || _typeWithValues$value === void 0 ? void 0 : _typeWithValues$value[0]) !== null && _ref !== void 0 ? _ref : '';
8
10
  };
9
11
  const TextEditType = props => {
12
+ const experienceId = useDatasourceExperienceId();
13
+ useEffect(() => {
14
+ if (experienceId) {
15
+ succeedUfoExperience({
16
+ name: 'inline-edit-rendered'
17
+ }, experienceId);
18
+ }
19
+ }, [experienceId]);
10
20
  return /*#__PURE__*/React.createElement(Layering, {
11
21
  isDisabled: false
12
22
  }, /*#__PURE__*/React.createElement(Textfield, _extends({}, props, {
@@ -4,9 +4,12 @@ import AKInlineEdit from '@atlaskit/inline-edit';
4
4
  import { Box, xcss } from '@atlaskit/primitives';
5
5
  import { useSmartLinkReload } from '@atlaskit/smart-card/hooks';
6
6
  import { useDatasourceAnalyticsEvents } from '../../../analytics';
7
+ import { startUfoExperience } from "../../../analytics/ufoExperiences";
8
+ import { useDatasourceExperienceId } from "../../../contexts/datasource-experience-id";
7
9
  import { useDatasourceTableFlag } from '../../../hooks/useDatasourceTableFlag';
8
10
  import { useDatasourceActions, useDatasourceItem } from '../../../state';
9
11
  import { editType } from '../edit-type';
12
+ export const InlineEditUFOExperience = 'inline-edit-rendered';
10
13
  const editContainerStyles = xcss({
11
14
  marginBlockStart: 'space.negative.100'
12
15
  });
@@ -84,6 +87,7 @@ export const InlineEdit = ({
84
87
  fireEvent
85
88
  } = useDatasourceAnalyticsEvents();
86
89
  const refreshDatasourceItem = useRefreshDatasourceItem(item);
90
+ const experienceId = useDatasourceExperienceId();
87
91
  const onCommitUpdate = useCallback(newValue => {
88
92
  if (!item) {
89
93
  setIsEditing(false);
@@ -108,6 +112,11 @@ export const InlineEdit = ({
108
112
  }, [item, columnKey, onUpdateItem, ari, refreshDatasourceItem, fireEvent, execute, showErrorFlag]);
109
113
  const onEdit = useCallback(() => {
110
114
  setIsEditing(true);
115
+ if (experienceId) {
116
+ startUfoExperience({
117
+ name: InlineEditUFOExperience
118
+ }, experienceId);
119
+ }
111
120
  if (integrationKey && entityType) {
112
121
  fireEvent('ui.inlineEdit.clicked.datasource', {
113
122
  integrationKey,
@@ -115,7 +124,7 @@ export const InlineEdit = ({
115
124
  fieldKey: columnKey
116
125
  });
117
126
  }
118
- }, [columnKey, entityType, fireEvent, integrationKey]);
127
+ }, [columnKey, entityType, experienceId, fireEvent, integrationKey]);
119
128
  const onCancelEdit = useCallback(() => {
120
129
  setIsEditing(false);
121
130
  if (integrationKey && entityType) {
@@ -13,9 +13,17 @@ var columnPickerCustomExperienceConfig = {
13
13
  type: ExperienceTypes.Operation,
14
14
  performanceType: ExperiencePerformanceTypes.Custom
15
15
  };
16
+ var inlineEditCustomExperienceConfig = {
17
+ platform: {
18
+ component: 'datasource'
19
+ },
20
+ type: ExperienceTypes.Load,
21
+ performanceType: ExperiencePerformanceTypes.InlineResult
22
+ };
16
23
  var ufoExperiences = {
17
24
  'datasource-rendered': new ConcurrentExperience('datasource-rendered', datasourcePageSegmentLoadExperienceConfig),
18
- 'column-picker-rendered': new ConcurrentExperience('column-picker-rendered', columnPickerCustomExperienceConfig)
25
+ 'column-picker-rendered': new ConcurrentExperience('column-picker-rendered', columnPickerCustomExperienceConfig),
26
+ 'inline-edit-rendered': new ConcurrentExperience('inline-edit-rendered', inlineEditCustomExperienceConfig)
19
27
  };
20
28
  export var startUfoExperience = function startUfoExperience(_ref, id) {
21
29
  var name = _ref.name,
@@ -163,7 +163,7 @@ var getFieldUpdateActionByAri = function getFieldUpdateActionByAri(state, _ref4)
163
163
  }
164
164
  return {
165
165
  schema: (_state$actionsByInteg = state.actionsByIntegration[integrationKey]) === null || _state$actionsByInteg === void 0 ? void 0 : _state$actionsByInteg[fieldKey],
166
- fetchSchema: (_state$actionsByInteg2 = state.actionsByIntegration[integrationKey]) === null || _state$actionsByInteg2 === void 0 ? void 0 : _state$actionsByInteg2[fieldKey].fetchAction
166
+ 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
167
167
  };
168
168
  };
169
169
 
@@ -6,16 +6,33 @@ import React, { useEffect, useState } from 'react';
6
6
  import { ActionOperationStatus } from '@atlaskit/linking-types';
7
7
  import Lozenge from '@atlaskit/lozenge';
8
8
  import Select from '@atlaskit/select';
9
+ import { failUfoExperience, succeedUfoExperience } from "../../../../analytics/ufoExperiences";
10
+ import { useDatasourceExperienceId } from "../../../../contexts/datasource-experience-id";
11
+ import { InlineEditUFOExperience } from "../../table-cell-content/inline-edit";
9
12
  var StatusEditType = function StatusEditType(props) {
10
13
  var _currentValue$values;
11
14
  var currentValue = props.currentValue,
12
15
  executeFetch = props.executeFetch;
13
16
  var _useStatusOptions = useStatusOptions(currentValue, executeFetch),
14
17
  options = _useStatusOptions.options,
15
- isLoading = _useStatusOptions.isLoading;
16
- return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Select, _extends({}, props, {
17
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop, @atlaskit/design-system/no-unsafe-style-overrides -- Ignored via go/DSP-18766
18
- className: "single-select",
18
+ isLoading = _useStatusOptions.isLoading,
19
+ hasFailed = _useStatusOptions.hasFailed;
20
+ var experienceId = useDatasourceExperienceId();
21
+ useEffect(function () {
22
+ if (!experienceId) {
23
+ return;
24
+ }
25
+ if (hasFailed) {
26
+ failUfoExperience({
27
+ name: InlineEditUFOExperience
28
+ }, experienceId);
29
+ } else if (!isLoading) {
30
+ succeedUfoExperience({
31
+ name: InlineEditUFOExperience
32
+ }, experienceId);
33
+ }
34
+ }, [experienceId, isLoading, hasFailed]);
35
+ return /*#__PURE__*/React.createElement(Select, _extends({}, props, {
19
36
  testId: "inline-edit-status",
20
37
  autoFocus: true,
21
38
  defaultMenuIsOpen: true,
@@ -38,7 +55,7 @@ var StatusEditType = function StatusEditType(props) {
38
55
  values: e ? [e] : []
39
56
  });
40
57
  }
41
- })));
58
+ }));
42
59
  };
43
60
  var filterOption = function filterOption(option, inputValue) {
44
61
  return option.data.text.toLowerCase().includes(inputValue.toLowerCase());
@@ -46,12 +63,14 @@ var filterOption = function filterOption(option, inputValue) {
46
63
  var useStatusOptions = function useStatusOptions(currentValue, executeFetch) {
47
64
  var _useState = useState({
48
65
  isLoading: true,
49
- options: []
66
+ options: [],
67
+ hasFailed: false
50
68
  }),
51
69
  _useState2 = _slicedToArray(_useState, 2),
52
70
  _useState2$ = _useState2[0],
53
71
  options = _useState2$.options,
54
72
  isLoading = _useState2$.isLoading,
73
+ hasFailed = _useState2$.hasFailed,
55
74
  setOptions = _useState2[1];
56
75
  useEffect(function () {
57
76
  var isMounted = true;
@@ -59,9 +78,16 @@ var useStatusOptions = function useStatusOptions(currentValue, executeFetch) {
59
78
  if (isMounted) {
60
79
  setOptions({
61
80
  isLoading: false,
62
- options: options
81
+ options: options,
82
+ hasFailed: false
63
83
  });
64
84
  }
85
+ }).catch(function (err) {
86
+ setOptions({
87
+ isLoading: false,
88
+ options: [],
89
+ hasFailed: true
90
+ });
65
91
  });
66
92
  return function () {
67
93
  isMounted = false;
@@ -69,7 +95,8 @@ var useStatusOptions = function useStatusOptions(currentValue, executeFetch) {
69
95
  }, [currentValue, executeFetch]);
70
96
  return {
71
97
  options: options,
72
- isLoading: isLoading
98
+ isLoading: isLoading,
99
+ hasFailed: hasFailed
73
100
  };
74
101
  };
75
102
  var loadOptions = /*#__PURE__*/function () {
@@ -79,7 +106,7 @@ var loadOptions = /*#__PURE__*/function () {
79
106
  while (1) switch (_context.prev = _context.next) {
80
107
  case 0:
81
108
  if (!executeFetch) {
82
- _context.next = 7;
109
+ _context.next = 9;
83
110
  break;
84
111
  }
85
112
  _context.next = 3;
@@ -87,10 +114,16 @@ var loadOptions = /*#__PURE__*/function () {
87
114
  case 3:
88
115
  result = _context.sent;
89
116
  operationStatus = result.operationStatus, entities = result.entities;
90
- if (!(operationStatus === ActionOperationStatus.SUCCESS && entities)) {
117
+ if (!(operationStatus === ActionOperationStatus.FAILURE)) {
91
118
  _context.next = 7;
92
119
  break;
93
120
  }
121
+ throw new Error('Failed to fetch status options');
122
+ case 7:
123
+ if (!entities) {
124
+ _context.next = 9;
125
+ break;
126
+ }
94
127
  return _context.abrupt("return", entities.map(function (entity) {
95
128
  return {
96
129
  id: entity.id,
@@ -99,9 +132,9 @@ var loadOptions = /*#__PURE__*/function () {
99
132
  transitionId: entity.transitionId
100
133
  };
101
134
  }));
102
- case 7:
135
+ case 9:
103
136
  return _context.abrupt("return", []);
104
- case 8:
137
+ case 10:
105
138
  case "end":
106
139
  return _context.stop();
107
140
  }
@@ -1,12 +1,22 @@
1
1
  import _extends from "@babel/runtime/helpers/extends";
2
- import React from 'react';
2
+ import React, { useEffect } from 'react';
3
3
  import { Layering } from '@atlaskit/layering';
4
4
  import Textfield from '@atlaskit/textfield';
5
+ import { succeedUfoExperience } from "../../../../analytics/ufoExperiences";
6
+ import { useDatasourceExperienceId } from "../../../../contexts/datasource-experience-id";
5
7
  export var toTextValue = function toTextValue(typeWithValues) {
6
8
  var _ref, _typeWithValues$value;
7
9
  return (_ref = (_typeWithValues$value = typeWithValues.values) === null || _typeWithValues$value === void 0 ? void 0 : _typeWithValues$value[0]) !== null && _ref !== void 0 ? _ref : '';
8
10
  };
9
11
  var TextEditType = function TextEditType(props) {
12
+ var experienceId = useDatasourceExperienceId();
13
+ useEffect(function () {
14
+ if (experienceId) {
15
+ succeedUfoExperience({
16
+ name: 'inline-edit-rendered'
17
+ }, experienceId);
18
+ }
19
+ }, [experienceId]);
10
20
  return /*#__PURE__*/React.createElement(Layering, {
11
21
  isDisabled: false
12
22
  }, /*#__PURE__*/React.createElement(Textfield, _extends({}, props, {
@@ -9,9 +9,12 @@ import AKInlineEdit from '@atlaskit/inline-edit';
9
9
  import { Box, xcss } from '@atlaskit/primitives';
10
10
  import { useSmartLinkReload } from '@atlaskit/smart-card/hooks';
11
11
  import { useDatasourceAnalyticsEvents } from '../../../analytics';
12
+ import { startUfoExperience } from "../../../analytics/ufoExperiences";
13
+ import { useDatasourceExperienceId } from "../../../contexts/datasource-experience-id";
12
14
  import { useDatasourceTableFlag } from '../../../hooks/useDatasourceTableFlag';
13
15
  import { useDatasourceActions, useDatasourceItem } from '../../../state';
14
16
  import { editType } from '../edit-type';
17
+ export var InlineEditUFOExperience = 'inline-edit-rendered';
15
18
  var editContainerStyles = xcss({
16
19
  marginBlockStart: 'space.negative.100'
17
20
  });
@@ -84,6 +87,7 @@ export var InlineEdit = function InlineEdit(_ref) {
84
87
  var _useDatasourceAnalyti = useDatasourceAnalyticsEvents(),
85
88
  fireEvent = _useDatasourceAnalyti.fireEvent;
86
89
  var refreshDatasourceItem = useRefreshDatasourceItem(item);
90
+ var experienceId = useDatasourceExperienceId();
87
91
  var onCommitUpdate = useCallback(function (newValue) {
88
92
  if (!item) {
89
93
  setIsEditing(false);
@@ -108,6 +112,11 @@ export var InlineEdit = function InlineEdit(_ref) {
108
112
  }, [item, columnKey, onUpdateItem, ari, refreshDatasourceItem, fireEvent, execute, showErrorFlag]);
109
113
  var onEdit = useCallback(function () {
110
114
  setIsEditing(true);
115
+ if (experienceId) {
116
+ startUfoExperience({
117
+ name: InlineEditUFOExperience
118
+ }, experienceId);
119
+ }
111
120
  if (integrationKey && entityType) {
112
121
  fireEvent('ui.inlineEdit.clicked.datasource', {
113
122
  integrationKey: integrationKey,
@@ -115,7 +124,7 @@ export var InlineEdit = function InlineEdit(_ref) {
115
124
  fieldKey: columnKey
116
125
  });
117
126
  }
118
- }, [columnKey, entityType, fireEvent, integrationKey]);
127
+ }, [columnKey, entityType, experienceId, fireEvent, integrationKey]);
119
128
  var onCancelEdit = useCallback(function () {
120
129
  setIsEditing(false);
121
130
  if (integrationKey && entityType) {
@@ -10,5 +10,11 @@ interface ColumnPickerRendered {
10
10
  extensionKey?: string;
11
11
  };
12
12
  }
13
- export type UfoExperience = DatasourceRendered | ColumnPickerRendered;
13
+ interface InlineEditRendered {
14
+ name: 'inline-edit-rendered';
15
+ metadata?: {
16
+ extensionKey?: string;
17
+ };
18
+ }
19
+ export type UfoExperience = DatasourceRendered | ColumnPickerRendered | InlineEditRendered;
14
20
  export {};
@@ -1,6 +1,7 @@
1
1
  import React from 'react';
2
2
  import { type AtomicActionExecuteResponse } from '@atlaskit/linking-types';
3
3
  import type { DatasourceTypeWithOnlyValues } from '../types';
4
+ export declare const InlineEditUFOExperience = "inline-edit-rendered";
4
5
  interface InlineEditProps {
5
6
  ari: string;
6
7
  columnKey: string;
@@ -10,5 +10,11 @@ interface ColumnPickerRendered {
10
10
  extensionKey?: string;
11
11
  };
12
12
  }
13
- export type UfoExperience = DatasourceRendered | ColumnPickerRendered;
13
+ interface InlineEditRendered {
14
+ name: 'inline-edit-rendered';
15
+ metadata?: {
16
+ extensionKey?: string;
17
+ };
18
+ }
19
+ export type UfoExperience = DatasourceRendered | ColumnPickerRendered | InlineEditRendered;
14
20
  export {};
@@ -1,6 +1,7 @@
1
1
  import React from 'react';
2
2
  import { type AtomicActionExecuteResponse } from '@atlaskit/linking-types';
3
3
  import type { DatasourceTypeWithOnlyValues } from '../types';
4
+ export declare const InlineEditUFOExperience = "inline-edit-rendered";
4
5
  interface InlineEditProps {
5
6
  ari: string;
6
7
  columnKey: string;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/link-datasource",
3
- "version": "3.8.8",
3
+ "version": "3.8.9",
4
4
  "description": "UI Components to support linking platform dataset feature",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -56,7 +56,7 @@
56
56
  "@atlaskit/jql-ast": "^3.3.0",
57
57
  "@atlaskit/jql-editor": "^4.10.0",
58
58
  "@atlaskit/jql-editor-autocomplete-rest": "^2.1.0",
59
- "@atlaskit/layering": "^0.7.0",
59
+ "@atlaskit/layering": "^0.7.3",
60
60
  "@atlaskit/link-client-extension": "^2.4.0",
61
61
  "@atlaskit/linking-common": "^6.0.0",
62
62
  "@atlaskit/linking-types": "^9.5.0",