@atlaskit/link-datasource 7.8.0 → 7.8.2
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 +14 -0
- package/compass.yml +3 -0
- package/dist/cjs/ui/assets-modal/modal/index.js +9 -7
- package/dist/cjs/ui/assets-modal/modal/messages.js +15 -0
- package/dist/cjs/ui/assets-modal/modal/render-assets-content/index.js +12 -0
- package/dist/cjs/ui/assets-modal/modal-config-popup/index.compiled.css +6 -0
- package/dist/cjs/ui/assets-modal/modal-config-popup/index.js +155 -0
- package/dist/cjs/ui/assets-modal/modal-config-popup/messages.js +29 -0
- package/dist/cjs/ui/assets-modal/search-container/index.compiled.css +0 -1
- package/dist/cjs/ui/assets-modal/search-container/index.js +37 -8
- package/dist/es2019/ui/assets-modal/modal/index.js +7 -7
- package/dist/es2019/ui/assets-modal/modal/messages.js +15 -0
- package/dist/es2019/ui/assets-modal/modal/render-assets-content/index.js +12 -0
- package/dist/es2019/ui/assets-modal/modal-config-popup/index.compiled.css +6 -0
- package/dist/es2019/ui/assets-modal/modal-config-popup/index.js +126 -0
- package/dist/es2019/ui/assets-modal/modal-config-popup/messages.js +23 -0
- package/dist/es2019/ui/assets-modal/search-container/index.compiled.css +0 -1
- package/dist/es2019/ui/assets-modal/search-container/index.js +37 -8
- package/dist/esm/ui/assets-modal/modal/index.js +9 -7
- package/dist/esm/ui/assets-modal/modal/messages.js +15 -0
- package/dist/esm/ui/assets-modal/modal/render-assets-content/index.js +12 -0
- package/dist/esm/ui/assets-modal/modal-config-popup/index.compiled.css +6 -0
- package/dist/esm/ui/assets-modal/modal-config-popup/index.js +147 -0
- package/dist/esm/ui/assets-modal/modal-config-popup/messages.js +23 -0
- package/dist/esm/ui/assets-modal/search-container/index.compiled.css +0 -1
- package/dist/esm/ui/assets-modal/search-container/index.js +37 -8
- package/dist/types/ui/assets-modal/modal/messages.d.ts +19 -4
- package/dist/types/ui/assets-modal/modal-config-popup/index.d.ts +30 -0
- package/dist/types/ui/assets-modal/modal-config-popup/messages.d.ts +22 -0
- package/package.json +12 -12
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,19 @@
|
|
|
1
1
|
# @atlaskit/link-datasource
|
|
2
2
|
|
|
3
|
+
## 7.8.2
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [`1a4bf8ba80113`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/1a4bf8ba80113) -
|
|
8
|
+
Remove the `platform_lp_sllv_preserve_assets_columns` feature gate and permanently preserve
|
|
9
|
+
selected Assets columns when editing AQL within the same object schema.
|
|
10
|
+
|
|
11
|
+
## 7.8.1
|
|
12
|
+
|
|
13
|
+
### Patch Changes
|
|
14
|
+
|
|
15
|
+
- Updated dependencies
|
|
16
|
+
|
|
3
17
|
## 7.8.0
|
|
4
18
|
|
|
5
19
|
### Minor Changes
|
package/compass.yml
CHANGED
|
@@ -54,7 +54,9 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
|
|
|
54
54
|
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; }
|
|
55
55
|
var VERSION_TWO = '2';
|
|
56
56
|
var modalBodyErrorWrapperStyles = null;
|
|
57
|
-
var AssetsModalTitle =
|
|
57
|
+
var AssetsModalTitle = function AssetsModalTitle() {
|
|
58
|
+
return /*#__PURE__*/React.createElement(_modalTitle.default, null, /*#__PURE__*/React.createElement(_reactIntl.FormattedMessage, (0, _fg.fg)('astral_assets_macro_table_ui_uplift') ? _messages.modalMessages.assetsConfigModalTitle : _messages.modalMessages.insertObjectsTitle));
|
|
59
|
+
};
|
|
58
60
|
var PlainAssetsConfigModal = function PlainAssetsConfigModal(props) {
|
|
59
61
|
var datasourceId = props.datasourceId,
|
|
60
62
|
initialParameters = props.parameters,
|
|
@@ -163,7 +165,7 @@ var PlainAssetsConfigModal = function PlainAssetsConfigModal(props) {
|
|
|
163
165
|
// newly selected ones - refetching for them, and throwing away the results just received. The
|
|
164
166
|
// re-render this schedules is discarded before commit, so the hook only ever sees the reconciled
|
|
165
167
|
// selection.
|
|
166
|
-
if (
|
|
168
|
+
if (hasPreservedColumns && status === 'resolved' && columns.length > 0) {
|
|
167
169
|
var availableKeys = new Set(columns.map(function (_ref) {
|
|
168
170
|
var key = _ref.key;
|
|
169
171
|
return key;
|
|
@@ -239,7 +241,7 @@ var PlainAssetsConfigModal = function PlainAssetsConfigModal(props) {
|
|
|
239
241
|
}, []);
|
|
240
242
|
(0, _react.useEffect)(function () {
|
|
241
243
|
// A preserved selection owns the columns, so restoring the saved or default ones would undo it
|
|
242
|
-
if (
|
|
244
|
+
if (hasPreservedColumns) {
|
|
243
245
|
return;
|
|
244
246
|
}
|
|
245
247
|
var newVisibleColumnKeys = initialVisibleColumnKeys && initialVisibleColumnKeys.length > 0 && apiVersion === VERSION_TWO ? initialVisibleColumnKeys : defaultVisibleColumnKeys;
|
|
@@ -249,7 +251,7 @@ var PlainAssetsConfigModal = function PlainAssetsConfigModal(props) {
|
|
|
249
251
|
// The response described none of the requested fields, so there is nothing valid to keep and
|
|
250
252
|
// no reported defaults to fall back to. Give up preserving and re-request the schema's own
|
|
251
253
|
// defaults. This one has to stay an effect because it issues a request.
|
|
252
|
-
if (!
|
|
254
|
+
if (!hasPreservedColumns || status !== 'resolved' || columns.length > 0) {
|
|
253
255
|
return;
|
|
254
256
|
}
|
|
255
257
|
setHasPreservedColumns(false);
|
|
@@ -337,7 +339,7 @@ var PlainAssetsConfigModal = function PlainAssetsConfigModal(props) {
|
|
|
337
339
|
}
|
|
338
340
|
// An empty selection has nothing worth preserving, and keeping it would stop the
|
|
339
341
|
// response's defaults from being adopted
|
|
340
|
-
var shouldPreserveColumns =
|
|
342
|
+
var shouldPreserveColumns = schemaId === searchSchemaId && (visibleColumnKeys !== null && visibleColumnKeys !== void 0 ? visibleColumnKeys : []).length > 0;
|
|
341
343
|
setHasPreservedColumns(shouldPreserveColumns);
|
|
342
344
|
setAql(searchAql);
|
|
343
345
|
setSchemaId(searchSchemaId);
|
|
@@ -369,7 +371,7 @@ var PlainAssetsConfigModal = function PlainAssetsConfigModal(props) {
|
|
|
369
371
|
} else {
|
|
370
372
|
if (!workspaceId || assetsClientLoading) {
|
|
371
373
|
return /*#__PURE__*/React.createElement(_loadingState.AssetsSearchContainerLoading, {
|
|
372
|
-
modalTitle: AssetsModalTitle
|
|
374
|
+
modalTitle: /*#__PURE__*/React.createElement(AssetsModalTitle, null)
|
|
373
375
|
});
|
|
374
376
|
}
|
|
375
377
|
return /*#__PURE__*/React.createElement(_searchContainer.AssetsSearchContainer, {
|
|
@@ -380,7 +382,7 @@ var PlainAssetsConfigModal = function PlainAssetsConfigModal(props) {
|
|
|
380
382
|
objectSchemas: objectSchemas
|
|
381
383
|
},
|
|
382
384
|
onSearch: handleOnSearch,
|
|
383
|
-
modalTitle: AssetsModalTitle,
|
|
385
|
+
modalTitle: /*#__PURE__*/React.createElement(AssetsModalTitle, null),
|
|
384
386
|
isSearching: status === 'loading',
|
|
385
387
|
onCancel: onCancel
|
|
386
388
|
});
|
|
@@ -20,5 +20,20 @@ var modalMessages = exports.modalMessages = (0, _reactIntl.defineMessages)({
|
|
|
20
20
|
id: 'linkDataSource.assets.configmodal.insertObjectsTitle',
|
|
21
21
|
description: 'Title for the Assets Objects Datasource config modal which prefixes a select picker',
|
|
22
22
|
defaultMessage: 'Insert objects from'
|
|
23
|
+
},
|
|
24
|
+
assetsConfigModalTitle: {
|
|
25
|
+
id: 'linkDataSource.assets.configmodal.title',
|
|
26
|
+
description: 'Title for the Assets Objects Datasource config modal',
|
|
27
|
+
defaultMessage: 'Assets table macro configuration'
|
|
28
|
+
},
|
|
29
|
+
filterObjectsText: {
|
|
30
|
+
id: 'linkDataSource.assets.configmodal.filterObjectsText',
|
|
31
|
+
description: 'Text for the filter option using aql search',
|
|
32
|
+
defaultMessage: 'Filter'
|
|
33
|
+
},
|
|
34
|
+
tablePreviewText: {
|
|
35
|
+
id: 'linkDataSource.assets.configmodal.tablePreviewText',
|
|
36
|
+
description: 'Heading above the table preview in the Assets configuration modal',
|
|
37
|
+
defaultMessage: 'Table preview'
|
|
23
38
|
}
|
|
24
39
|
});
|
|
@@ -11,11 +11,16 @@ require("./index.compiled.css");
|
|
|
11
11
|
var _react = _interopRequireWildcard(require("react"));
|
|
12
12
|
var React = _react;
|
|
13
13
|
var _runtime = require("@compiled/react/runtime");
|
|
14
|
+
var _reactIntl = require("react-intl");
|
|
15
|
+
var _heading = _interopRequireDefault(require("@atlaskit/heading/heading"));
|
|
16
|
+
var _fg = require("@atlaskit/platform-feature-flags/fg");
|
|
17
|
+
var _stack = require("@atlaskit/primitives/compiled/stack");
|
|
14
18
|
var _accessRequired = require("../../../common/error-state/access-required");
|
|
15
19
|
var _modalLoadingError = require("../../../common/error-state/modal-loading-error");
|
|
16
20
|
var _noResults = require("../../../common/error-state/no-results");
|
|
17
21
|
var _emptyState = _interopRequireDefault(require("../../../issue-like-table/empty-state"));
|
|
18
22
|
var _issueLikeDataTableView = require("../../../issue-like-table/issue-like-data-table-view");
|
|
23
|
+
var _messages = require("../messages");
|
|
19
24
|
var _initialStateView = require("./initial-state-view");
|
|
20
25
|
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
|
|
21
26
|
var MODAL_HEIGHT = exports.MODAL_HEIGHT = 420;
|
|
@@ -100,5 +105,12 @@ var RenderAssetsContent = exports.RenderAssetsContent = function RenderAssetsCon
|
|
|
100
105
|
}
|
|
101
106
|
return issueLikeDataTableView;
|
|
102
107
|
}, [columns.length, isFetchingInitialData, issueLikeDataTableView, resolvedWithNoResults, shouldRenderTableWithNoResults, status]);
|
|
108
|
+
if ((0, _fg.fg)('astral_assets_macro_table_ui_uplift')) {
|
|
109
|
+
return /*#__PURE__*/React.createElement(_stack.Stack, {
|
|
110
|
+
space: "space.200"
|
|
111
|
+
}, status !== 'empty' && /*#__PURE__*/React.createElement(_heading.default, {
|
|
112
|
+
size: "xsmall"
|
|
113
|
+
}, /*#__PURE__*/React.createElement(_reactIntl.FormattedMessage, _messages.modalMessages.tablePreviewText)), renderAssetsContentView());
|
|
114
|
+
}
|
|
103
115
|
return renderAssetsContentView();
|
|
104
116
|
};
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
._19bvpxbi{padding-left:var(--ds-space-200,1pc)}
|
|
2
|
+
._19bvxy5q{padding-left:var(--ds-space-400,2pc)}
|
|
3
|
+
._1bsb1kdj{width:25pc}
|
|
4
|
+
._ca0qpxbi{padding-top:var(--ds-space-200,1pc)}
|
|
5
|
+
._n3tdpxbi{padding-bottom:var(--ds-space-200,1pc)}
|
|
6
|
+
._u5f3pxbi{padding-right:var(--ds-space-200,1pc)}
|
|
@@ -0,0 +1,155 @@
|
|
|
1
|
+
/* index.tsx generated by @compiled/babel-plugin v3.0.2 */
|
|
2
|
+
"use strict";
|
|
3
|
+
|
|
4
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
5
|
+
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
6
|
+
Object.defineProperty(exports, "__esModule", {
|
|
7
|
+
value: true
|
|
8
|
+
});
|
|
9
|
+
exports.selectInAModalStyleFixProps = exports.PAGE_SIZE_OPTIONS = exports.DEFAULT_PAGE_SIZE = exports.AssetsModalConfigPopup = void 0;
|
|
10
|
+
require("./index.compiled.css");
|
|
11
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
12
|
+
var React = _react;
|
|
13
|
+
var _runtime = require("@compiled/react/runtime");
|
|
14
|
+
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
15
|
+
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
16
|
+
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
17
|
+
var _reactIntl = require("react-intl");
|
|
18
|
+
var _button = _interopRequireDefault(require("@atlaskit/button/icon/button"));
|
|
19
|
+
var _checkbox = _interopRequireDefault(require("@atlaskit/checkbox/checkbox"));
|
|
20
|
+
var _default = require("@atlaskit/form/label/default");
|
|
21
|
+
var _customize = _interopRequireDefault(require("@atlaskit/icon/core/customize"));
|
|
22
|
+
var _popup = require("@atlaskit/popup/popup");
|
|
23
|
+
var _box = require("@atlaskit/primitives/compiled/box");
|
|
24
|
+
var _stack = require("@atlaskit/primitives/compiled/stack");
|
|
25
|
+
var _default2 = _interopRequireDefault(require("@atlaskit/select/default"));
|
|
26
|
+
var _zindex = require("../../../common/zindex");
|
|
27
|
+
var _messages = require("./messages");
|
|
28
|
+
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
|
|
29
|
+
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; }
|
|
30
|
+
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; }
|
|
31
|
+
/**
|
|
32
|
+
* Rendering a `<Select>` in a `<Modal>` results in the select options getting cut off by the bottom of the modal and
|
|
33
|
+
* scrolling. This is a work-around for that, see https://atlassian.slack.com/archives/CFJ9DU39U/p1623179496484100
|
|
34
|
+
*/
|
|
35
|
+
var selectInAModalStyleFixProps = exports.selectInAModalStyleFixProps = {
|
|
36
|
+
styles: {
|
|
37
|
+
menuPortal: function menuPortal(base) {
|
|
38
|
+
return _objectSpread(_objectSpread({}, base), {}, {
|
|
39
|
+
zIndex: _zindex.aboveModal
|
|
40
|
+
});
|
|
41
|
+
}
|
|
42
|
+
},
|
|
43
|
+
menuPortalTarget: document.body
|
|
44
|
+
};
|
|
45
|
+
var PAGE_SIZE_OPTIONS = exports.PAGE_SIZE_OPTIONS = [10, 20, 50, 100];
|
|
46
|
+
var DEFAULT_PAGE_SIZE = exports.DEFAULT_PAGE_SIZE = 20;
|
|
47
|
+
var styles = {
|
|
48
|
+
trigger: "_19bvxy5q _u5f3pxbi",
|
|
49
|
+
content: "_1bsb1kdj _ca0qpxbi _u5f3pxbi _n3tdpxbi _19bvpxbi"
|
|
50
|
+
};
|
|
51
|
+
var AssetsModalConfigPopup = exports.AssetsModalConfigPopup = function AssetsModalConfigPopup(_ref) {
|
|
52
|
+
var _initialConfig$pageSi, _initialConfig$isNest;
|
|
53
|
+
var initialConfig = _ref.initialConfig,
|
|
54
|
+
onChange = _ref.onChange,
|
|
55
|
+
_ref$testId = _ref.testId,
|
|
56
|
+
testId = _ref$testId === void 0 ? 'assets-datasource-modal--config-popup' : _ref$testId;
|
|
57
|
+
var _useIntl = (0, _reactIntl.useIntl)(),
|
|
58
|
+
formatMessage = _useIntl.formatMessage;
|
|
59
|
+
var _useState = (0, _react.useState)(false),
|
|
60
|
+
_useState2 = (0, _slicedToArray2.default)(_useState, 2),
|
|
61
|
+
isOpen = _useState2[0],
|
|
62
|
+
setIsOpen = _useState2[1];
|
|
63
|
+
var _useState3 = (0, _react.useState)({
|
|
64
|
+
pageSize: (_initialConfig$pageSi = initialConfig === null || initialConfig === void 0 ? void 0 : initialConfig.pageSize) !== null && _initialConfig$pageSi !== void 0 ? _initialConfig$pageSi : DEFAULT_PAGE_SIZE,
|
|
65
|
+
isNestedReferenceAttributeSelectionEnabled: (_initialConfig$isNest = initialConfig === null || initialConfig === void 0 ? void 0 : initialConfig.isNestedReferenceAttributeSelectionEnabled) !== null && _initialConfig$isNest !== void 0 ? _initialConfig$isNest : false
|
|
66
|
+
}),
|
|
67
|
+
_useState4 = (0, _slicedToArray2.default)(_useState3, 2),
|
|
68
|
+
config = _useState4[0],
|
|
69
|
+
setConfig = _useState4[1];
|
|
70
|
+
var pageSizeSelectId = (0, _react.useId)();
|
|
71
|
+
var pageSizeOptions = PAGE_SIZE_OPTIONS.map(function (count) {
|
|
72
|
+
return {
|
|
73
|
+
label: formatMessage(_messages.modalConfigPopupMessages.objectsPerPage, {
|
|
74
|
+
count: count
|
|
75
|
+
}),
|
|
76
|
+
value: count
|
|
77
|
+
};
|
|
78
|
+
});
|
|
79
|
+
var updateConfig = function updateConfig(partialConfig) {
|
|
80
|
+
var nextConfig = _objectSpread(_objectSpread({}, config), partialConfig);
|
|
81
|
+
setConfig(nextConfig);
|
|
82
|
+
onChange(nextConfig);
|
|
83
|
+
};
|
|
84
|
+
var handlePageSizeChange = function handlePageSizeChange(option) {
|
|
85
|
+
if (option) {
|
|
86
|
+
updateConfig({
|
|
87
|
+
pageSize: option.value
|
|
88
|
+
});
|
|
89
|
+
}
|
|
90
|
+
};
|
|
91
|
+
var handleNestedReferenceAttributeSelectionChange = function handleNestedReferenceAttributeSelectionChange(event) {
|
|
92
|
+
updateConfig({
|
|
93
|
+
isNestedReferenceAttributeSelectionEnabled: event.target.checked
|
|
94
|
+
});
|
|
95
|
+
};
|
|
96
|
+
var selectedPageSizeOption = pageSizeOptions.find(function (option) {
|
|
97
|
+
return option.value === config.pageSize;
|
|
98
|
+
});
|
|
99
|
+
return /*#__PURE__*/React.createElement(_popup.Popup, {
|
|
100
|
+
isOpen: isOpen,
|
|
101
|
+
onClose: function onClose() {
|
|
102
|
+
return setIsOpen(false);
|
|
103
|
+
},
|
|
104
|
+
placement: "bottom-end",
|
|
105
|
+
testId: testId,
|
|
106
|
+
role: "dialog",
|
|
107
|
+
label: formatMessage(_messages.modalConfigPopupMessages.configureTable),
|
|
108
|
+
zIndex: _zindex.aboveModal,
|
|
109
|
+
trigger: function trigger(triggerProps) {
|
|
110
|
+
return /*#__PURE__*/React.createElement(_box.Box, {
|
|
111
|
+
xcss: styles.trigger
|
|
112
|
+
}, /*#__PURE__*/React.createElement(_button.default, {
|
|
113
|
+
ref: triggerProps.ref,
|
|
114
|
+
"aria-controls": triggerProps['aria-controls'],
|
|
115
|
+
"aria-expanded": triggerProps['aria-expanded'],
|
|
116
|
+
"aria-haspopup": triggerProps['aria-haspopup'],
|
|
117
|
+
icon: _customize.default,
|
|
118
|
+
isSelected: isOpen,
|
|
119
|
+
isTooltipDisabled: false,
|
|
120
|
+
label: formatMessage(_messages.modalConfigPopupMessages.configureTable),
|
|
121
|
+
onClick: function onClick() {
|
|
122
|
+
return setIsOpen(function (currentIsOpen) {
|
|
123
|
+
return !currentIsOpen;
|
|
124
|
+
});
|
|
125
|
+
},
|
|
126
|
+
testId: "".concat(testId, "--trigger")
|
|
127
|
+
}));
|
|
128
|
+
},
|
|
129
|
+
content: function content() {
|
|
130
|
+
return /*#__PURE__*/React.createElement(_box.Box, {
|
|
131
|
+
xcss: styles.content
|
|
132
|
+
}, /*#__PURE__*/React.createElement(_stack.Stack, {
|
|
133
|
+
space: "space.200"
|
|
134
|
+
}, /*#__PURE__*/React.createElement(_stack.Stack, {
|
|
135
|
+
space: "space.050",
|
|
136
|
+
alignInline: "start"
|
|
137
|
+
}, /*#__PURE__*/React.createElement(_default.Label, {
|
|
138
|
+
htmlFor: pageSizeSelectId
|
|
139
|
+
}, /*#__PURE__*/React.createElement(_reactIntl.FormattedMessage, _messages.modalConfigPopupMessages.tablePagination)), /*#__PURE__*/React.createElement(_default2.default, (0, _extends2.default)({}, selectInAModalStyleFixProps, {
|
|
140
|
+
inputId: pageSizeSelectId,
|
|
141
|
+
options: pageSizeOptions,
|
|
142
|
+
value: selectedPageSizeOption,
|
|
143
|
+
onChange: handlePageSizeChange,
|
|
144
|
+
isSearchable: false,
|
|
145
|
+
menuPlacement: "bottom",
|
|
146
|
+
testId: "".concat(testId, "--page-size-select")
|
|
147
|
+
}))), /*#__PURE__*/React.createElement(_checkbox.default, {
|
|
148
|
+
isChecked: config.isNestedReferenceAttributeSelectionEnabled,
|
|
149
|
+
onChange: handleNestedReferenceAttributeSelectionChange,
|
|
150
|
+
label: formatMessage(_messages.modalConfigPopupMessages.nestedReferenceAttributeSelection),
|
|
151
|
+
testId: "".concat(testId, "--nested-reference-attribute-selection")
|
|
152
|
+
})));
|
|
153
|
+
}
|
|
154
|
+
});
|
|
155
|
+
};
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.modalConfigPopupMessages = void 0;
|
|
7
|
+
var _reactIntl = require("react-intl");
|
|
8
|
+
var modalConfigPopupMessages = exports.modalConfigPopupMessages = (0, _reactIntl.defineMessages)({
|
|
9
|
+
configureTable: {
|
|
10
|
+
id: 'linkDataSource.assets.configModal.configPopup.configureTable',
|
|
11
|
+
description: 'Tooltip and accessibility label for the icon button that opens the Assets table configuration popup',
|
|
12
|
+
defaultMessage: 'Configure table'
|
|
13
|
+
},
|
|
14
|
+
nestedReferenceAttributeSelection: {
|
|
15
|
+
id: 'linkDataSource.assets.configModal.configPopup.nestedReferenceAttributeSelection',
|
|
16
|
+
description: 'Label for the checkbox that allows users to select attributes of referenced objects (nested attributes) as table columns',
|
|
17
|
+
defaultMessage: 'Enable nested reference attribute selection'
|
|
18
|
+
},
|
|
19
|
+
objectsPerPage: {
|
|
20
|
+
id: 'linkDataSource.assets.configModal.configPopup.objectsPerPage',
|
|
21
|
+
description: 'Option label in the pagination select showing how many Assets objects are displayed per table page. {count} is the number of objects.',
|
|
22
|
+
defaultMessage: '{count, plural, one {# object per page} other {# objects per page}}'
|
|
23
|
+
},
|
|
24
|
+
tablePagination: {
|
|
25
|
+
id: 'linkDataSource.assets.configModal.configPopup.tablePagination',
|
|
26
|
+
description: 'Label for the select input where users choose how many Assets objects are displayed per table page',
|
|
27
|
+
defaultMessage: 'Table pagination:'
|
|
28
|
+
}
|
|
29
|
+
});
|
|
@@ -13,12 +13,17 @@ var React = _react;
|
|
|
13
13
|
var _runtime = require("@compiled/react/runtime");
|
|
14
14
|
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
15
15
|
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
16
|
+
var _reactIntl = require("react-intl");
|
|
16
17
|
var _form = _interopRequireDefault(require("@atlaskit/form/form"));
|
|
18
|
+
var _heading = _interopRequireDefault(require("@atlaskit/heading/heading"));
|
|
17
19
|
var _closeButton = require("@atlaskit/modal-dialog/close-button");
|
|
18
20
|
var _fg = require("@atlaskit/platform-feature-flags/fg");
|
|
19
21
|
var _flex = require("@atlaskit/primitives/compiled/flex");
|
|
22
|
+
var _text = require("@atlaskit/primitives/compiled/text");
|
|
20
23
|
var _analytics = require("../../../analytics");
|
|
21
24
|
var _types = require("../../../types/assets/types");
|
|
25
|
+
var _modalConfigPopup = require("../modal-config-popup");
|
|
26
|
+
var _messages = require("../modal/messages");
|
|
22
27
|
var _aqlSearchInput = require("./aql-search-input");
|
|
23
28
|
var _objectSchemaSelect = require("./object-schema-select");
|
|
24
29
|
var _styled = require("./styled");
|
|
@@ -26,7 +31,7 @@ var _excluded = ["as", "style"];
|
|
|
26
31
|
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
|
|
27
32
|
var styles = {
|
|
28
33
|
modalTitleContainer: "_zulppxbi _4cvr1h6o",
|
|
29
|
-
flexStyles: "
|
|
34
|
+
flexStyles: "_1bsb1osq"
|
|
30
35
|
};
|
|
31
36
|
var DEFAULT_AQL_QUERY = '';
|
|
32
37
|
var SEARCH_FORM_ID = 'linkDataSource.assets.configModal.searchContainer-form';
|
|
@@ -67,7 +72,7 @@ var AssetsSearchContainer = exports.AssetsSearchContainer = function AssetsSearc
|
|
|
67
72
|
return /*#__PURE__*/React.createElement(_form.default, {
|
|
68
73
|
onSubmit: onFormSubmit
|
|
69
74
|
}, function (_ref2) {
|
|
70
|
-
var _initialSearchData$ob, _initialSearchData$ob2, _initialSearchData$aq;
|
|
75
|
+
var _initialSearchData$ob, _initialSearchData$ob2, _initialSearchData$ob3, _initialSearchData$ob4, _initialSearchData$aq;
|
|
71
76
|
var formProps = _ref2.formProps,
|
|
72
77
|
setFieldValue = _ref2.setFieldValue;
|
|
73
78
|
var onSchemaChange = function onSchemaChange(schema) {
|
|
@@ -81,24 +86,48 @@ var AssetsSearchContainer = exports.AssetsSearchContainer = function AssetsSearc
|
|
|
81
86
|
id: SEARCH_FORM_ID
|
|
82
87
|
}), /*#__PURE__*/React.createElement(_styled.FormRowContainer, {
|
|
83
88
|
isNarrowGap: true
|
|
84
|
-
}, /*#__PURE__*/React.createElement(_flex.Flex, {
|
|
89
|
+
}, (0, _fg.fg)('astral_assets_macro_table_ui_uplift') ? /*#__PURE__*/React.createElement(_flex.Flex, {
|
|
85
90
|
gap: "space.200",
|
|
86
91
|
justifyContent: "space-between",
|
|
87
92
|
xcss: styles.flexStyles
|
|
88
93
|
}, /*#__PURE__*/React.createElement(_flex.Flex, {
|
|
94
|
+
justifyContent: "start",
|
|
95
|
+
xcss: styles.modalTitleContainer
|
|
96
|
+
}, modalTitle), /*#__PURE__*/React.createElement(_flex.Flex, {
|
|
89
97
|
justifyContent: "end"
|
|
90
|
-
}, /*#__PURE__*/React.createElement(
|
|
98
|
+
}, /*#__PURE__*/React.createElement(_flex.Flex, {
|
|
99
|
+
alignItems: "center",
|
|
100
|
+
gap: "space.100"
|
|
101
|
+
}, /*#__PURE__*/React.createElement(_text.Text, null, /*#__PURE__*/React.createElement(_reactIntl.FormattedMessage, _messages.modalMessages.insertObjectsTitle), ":"), /*#__PURE__*/React.createElement(_objectSchemaSelect.AssetsObjectSchemaSelect, {
|
|
102
|
+
value: (_initialSearchData$ob = initialSearchData.objectSchema) !== null && _initialSearchData$ob !== void 0 ? _initialSearchData$ob : undefined,
|
|
103
|
+
workspaceId: workspaceId,
|
|
104
|
+
initialObjectSchemas: (_initialSearchData$ob2 = initialSearchData.objectSchemas) !== null && _initialSearchData$ob2 !== void 0 ? _initialSearchData$ob2 : undefined,
|
|
105
|
+
classNamePrefix: "assets-datasource-modal--object-schema-select",
|
|
106
|
+
onSchemaChange: onSchemaChange
|
|
107
|
+
})), /*#__PURE__*/React.createElement(_modalConfigPopup.AssetsModalConfigPopup, {
|
|
108
|
+
onChange: function onChange() {}
|
|
109
|
+
}), /*#__PURE__*/React.createElement(_closeButton.CloseButton, {
|
|
91
110
|
onClick: onCancel
|
|
92
|
-
}))
|
|
111
|
+
}))) : /*#__PURE__*/React.createElement(_flex.Flex, {
|
|
112
|
+
gap: "space.200",
|
|
113
|
+
justifyContent: "space-between",
|
|
114
|
+
xcss: styles.flexStyles
|
|
115
|
+
}, /*#__PURE__*/React.createElement(_flex.Flex, {
|
|
93
116
|
justifyContent: "start",
|
|
94
117
|
xcss: styles.modalTitleContainer
|
|
95
118
|
}, modalTitle, /*#__PURE__*/React.createElement(_objectSchemaSelect.AssetsObjectSchemaSelect, {
|
|
96
|
-
value: (_initialSearchData$
|
|
119
|
+
value: (_initialSearchData$ob3 = initialSearchData.objectSchema) !== null && _initialSearchData$ob3 !== void 0 ? _initialSearchData$ob3 : undefined,
|
|
97
120
|
workspaceId: workspaceId,
|
|
98
|
-
initialObjectSchemas: (_initialSearchData$
|
|
121
|
+
initialObjectSchemas: (_initialSearchData$ob4 = initialSearchData.objectSchemas) !== null && _initialSearchData$ob4 !== void 0 ? _initialSearchData$ob4 : undefined,
|
|
99
122
|
classNamePrefix: "assets-datasource-modal--object-schema-select",
|
|
100
123
|
onSchemaChange: onSchemaChange
|
|
101
|
-
}))
|
|
124
|
+
})), /*#__PURE__*/React.createElement(_flex.Flex, {
|
|
125
|
+
justifyContent: "end"
|
|
126
|
+
}, /*#__PURE__*/React.createElement(_closeButton.CloseButton, {
|
|
127
|
+
onClick: onCancel
|
|
128
|
+
})))), (0, _fg.fg)('astral_assets_macro_table_ui_uplift') ? /*#__PURE__*/React.createElement(_heading.default, {
|
|
129
|
+
size: "xsmall"
|
|
130
|
+
}, /*#__PURE__*/React.createElement(_reactIntl.FormattedMessage, _messages.modalMessages.filterObjectsText)) : null, /*#__PURE__*/React.createElement(_styled.FormRowContainer, null, /*#__PURE__*/React.createElement(_aqlSearchInput.AqlSearchInput, {
|
|
102
131
|
value: (_initialSearchData$aq = initialSearchData.aql) !== null && _initialSearchData$aq !== void 0 ? _initialSearchData$aq : DEFAULT_AQL_QUERY,
|
|
103
132
|
workspaceId: workspaceId,
|
|
104
133
|
isSearching: isSearching
|
|
@@ -42,7 +42,7 @@ import { modalMessages } from './messages';
|
|
|
42
42
|
import { RenderAssetsContent } from './render-assets-content';
|
|
43
43
|
const VERSION_TWO = '2';
|
|
44
44
|
const modalBodyErrorWrapperStyles = null;
|
|
45
|
-
const AssetsModalTitle = /*#__PURE__*/React.createElement(ModalTitle, null, /*#__PURE__*/React.createElement(FormattedMessage, modalMessages.insertObjectsTitle));
|
|
45
|
+
const AssetsModalTitle = () => /*#__PURE__*/React.createElement(ModalTitle, null, /*#__PURE__*/React.createElement(FormattedMessage, fg('astral_assets_macro_table_ui_uplift') ? modalMessages.assetsConfigModalTitle : modalMessages.insertObjectsTitle));
|
|
46
46
|
const PlainAssetsConfigModal = props => {
|
|
47
47
|
const {
|
|
48
48
|
datasourceId,
|
|
@@ -135,7 +135,7 @@ const PlainAssetsConfigModal = props => {
|
|
|
135
135
|
// newly selected ones - refetching for them, and throwing away the results just received. The
|
|
136
136
|
// re-render this schedules is discarded before commit, so the hook only ever sees the reconciled
|
|
137
137
|
// selection.
|
|
138
|
-
if (
|
|
138
|
+
if (hasPreservedColumns && status === 'resolved' && columns.length > 0) {
|
|
139
139
|
const availableKeys = new Set(columns.map(({
|
|
140
140
|
key
|
|
141
141
|
}) => key));
|
|
@@ -209,7 +209,7 @@ const PlainAssetsConfigModal = props => {
|
|
|
209
209
|
}, []);
|
|
210
210
|
useEffect(() => {
|
|
211
211
|
// A preserved selection owns the columns, so restoring the saved or default ones would undo it
|
|
212
|
-
if (
|
|
212
|
+
if (hasPreservedColumns) {
|
|
213
213
|
return;
|
|
214
214
|
}
|
|
215
215
|
const newVisibleColumnKeys = initialVisibleColumnKeys && initialVisibleColumnKeys.length > 0 && apiVersion === VERSION_TWO ? initialVisibleColumnKeys : defaultVisibleColumnKeys;
|
|
@@ -219,7 +219,7 @@ const PlainAssetsConfigModal = props => {
|
|
|
219
219
|
// The response described none of the requested fields, so there is nothing valid to keep and
|
|
220
220
|
// no reported defaults to fall back to. Give up preserving and re-request the schema's own
|
|
221
221
|
// defaults. This one has to stay an effect because it issues a request.
|
|
222
|
-
if (!
|
|
222
|
+
if (!hasPreservedColumns || status !== 'resolved' || columns.length > 0) {
|
|
223
223
|
return;
|
|
224
224
|
}
|
|
225
225
|
setHasPreservedColumns(false);
|
|
@@ -305,7 +305,7 @@ const PlainAssetsConfigModal = props => {
|
|
|
305
305
|
}
|
|
306
306
|
// An empty selection has nothing worth preserving, and keeping it would stop the
|
|
307
307
|
// response's defaults from being adopted
|
|
308
|
-
const shouldPreserveColumns =
|
|
308
|
+
const shouldPreserveColumns = schemaId === searchSchemaId && (visibleColumnKeys !== null && visibleColumnKeys !== void 0 ? visibleColumnKeys : []).length > 0;
|
|
309
309
|
setHasPreservedColumns(shouldPreserveColumns);
|
|
310
310
|
setAql(searchAql);
|
|
311
311
|
setSchemaId(searchSchemaId);
|
|
@@ -337,7 +337,7 @@ const PlainAssetsConfigModal = props => {
|
|
|
337
337
|
} else {
|
|
338
338
|
if (!workspaceId || assetsClientLoading) {
|
|
339
339
|
return /*#__PURE__*/React.createElement(AssetsSearchContainerLoading, {
|
|
340
|
-
modalTitle: AssetsModalTitle
|
|
340
|
+
modalTitle: /*#__PURE__*/React.createElement(AssetsModalTitle, null)
|
|
341
341
|
});
|
|
342
342
|
}
|
|
343
343
|
return /*#__PURE__*/React.createElement(AssetsSearchContainer, {
|
|
@@ -348,7 +348,7 @@ const PlainAssetsConfigModal = props => {
|
|
|
348
348
|
objectSchemas
|
|
349
349
|
},
|
|
350
350
|
onSearch: handleOnSearch,
|
|
351
|
-
modalTitle: AssetsModalTitle,
|
|
351
|
+
modalTitle: /*#__PURE__*/React.createElement(AssetsModalTitle, null),
|
|
352
352
|
isSearching: status === 'loading',
|
|
353
353
|
onCancel: onCancel
|
|
354
354
|
});
|
|
@@ -14,5 +14,20 @@ export const modalMessages = defineMessages({
|
|
|
14
14
|
id: 'linkDataSource.assets.configmodal.insertObjectsTitle',
|
|
15
15
|
description: 'Title for the Assets Objects Datasource config modal which prefixes a select picker',
|
|
16
16
|
defaultMessage: 'Insert objects from'
|
|
17
|
+
},
|
|
18
|
+
assetsConfigModalTitle: {
|
|
19
|
+
id: 'linkDataSource.assets.configmodal.title',
|
|
20
|
+
description: 'Title for the Assets Objects Datasource config modal',
|
|
21
|
+
defaultMessage: 'Assets table macro configuration'
|
|
22
|
+
},
|
|
23
|
+
filterObjectsText: {
|
|
24
|
+
id: 'linkDataSource.assets.configmodal.filterObjectsText',
|
|
25
|
+
description: 'Text for the filter option using aql search',
|
|
26
|
+
defaultMessage: 'Filter'
|
|
27
|
+
},
|
|
28
|
+
tablePreviewText: {
|
|
29
|
+
id: 'linkDataSource.assets.configmodal.tablePreviewText',
|
|
30
|
+
description: 'Heading above the table preview in the Assets configuration modal',
|
|
31
|
+
defaultMessage: 'Table preview'
|
|
17
32
|
}
|
|
18
33
|
});
|
|
@@ -3,11 +3,16 @@ import "./index.compiled.css";
|
|
|
3
3
|
import * as React from 'react';
|
|
4
4
|
import { ax, ix } from "@compiled/react/runtime";
|
|
5
5
|
import { useCallback, useMemo } from 'react';
|
|
6
|
+
import { FormattedMessage } from 'react-intl';
|
|
7
|
+
import Heading from '@atlaskit/heading/heading';
|
|
8
|
+
import { fg } from '@atlaskit/platform-feature-flags/fg';
|
|
9
|
+
import { Stack } from '@atlaskit/primitives/compiled/stack';
|
|
6
10
|
import { AccessRequired } from '../../../common/error-state/access-required';
|
|
7
11
|
import { ModalLoadingError } from '../../../common/error-state/modal-loading-error';
|
|
8
12
|
import { NoResults } from '../../../common/error-state/no-results';
|
|
9
13
|
import EmptyState from '../../../issue-like-table/empty-state';
|
|
10
14
|
import { IssueLikeDataTableView } from '../../../issue-like-table/issue-like-data-table-view';
|
|
15
|
+
import { modalMessages } from '../messages';
|
|
11
16
|
import { InitialStateView } from './initial-state-view';
|
|
12
17
|
export const MODAL_HEIGHT = 420;
|
|
13
18
|
|
|
@@ -81,5 +86,12 @@ export const RenderAssetsContent = props => {
|
|
|
81
86
|
}
|
|
82
87
|
return issueLikeDataTableView;
|
|
83
88
|
}, [columns.length, isFetchingInitialData, issueLikeDataTableView, resolvedWithNoResults, shouldRenderTableWithNoResults, status]);
|
|
89
|
+
if (fg('astral_assets_macro_table_ui_uplift')) {
|
|
90
|
+
return /*#__PURE__*/React.createElement(Stack, {
|
|
91
|
+
space: "space.200"
|
|
92
|
+
}, status !== 'empty' && /*#__PURE__*/React.createElement(Heading, {
|
|
93
|
+
size: "xsmall"
|
|
94
|
+
}, /*#__PURE__*/React.createElement(FormattedMessage, modalMessages.tablePreviewText)), renderAssetsContentView());
|
|
95
|
+
}
|
|
84
96
|
return renderAssetsContentView();
|
|
85
97
|
};
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
._19bvpxbi{padding-left:var(--ds-space-200,1pc)}
|
|
2
|
+
._19bvxy5q{padding-left:var(--ds-space-400,2pc)}
|
|
3
|
+
._1bsb1kdj{width:25pc}
|
|
4
|
+
._ca0qpxbi{padding-top:var(--ds-space-200,1pc)}
|
|
5
|
+
._n3tdpxbi{padding-bottom:var(--ds-space-200,1pc)}
|
|
6
|
+
._u5f3pxbi{padding-right:var(--ds-space-200,1pc)}
|