@commercetools-frontend-extensions/import-resources-modal 0.0.1 → 1.0.0

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.
Files changed (29) hide show
  1. package/README.md +56 -0
  2. package/dist/active-drag-drop-area-06cef014.esm.js +60 -0
  3. package/dist/active-drag-drop-area-be3680ab.cjs.prod.js +62 -0
  4. package/dist/active-drag-drop-area-fae899bd.cjs.dev.js +62 -0
  5. package/dist/commercetools-frontend-extensions-import-resources-modal.cjs.dev.js +49 -146
  6. package/dist/commercetools-frontend-extensions-import-resources-modal.cjs.prod.js +49 -146
  7. package/dist/commercetools-frontend-extensions-import-resources-modal.esm.js +45 -133
  8. package/dist/declarations/src/@types/api.d.ts +13 -0
  9. package/dist/declarations/src/@types/basic-error-data-type.d.ts +5 -0
  10. package/dist/declarations/src/@types/file-upload.d.ts +52 -0
  11. package/dist/declarations/src/@types/import-container.d.ts +20 -0
  12. package/dist/declarations/src/@types/import-resources-modal-props.d.ts +2 -2
  13. package/dist/declarations/src/@types/import-states.d.ts +9 -0
  14. package/dist/declarations/src/@types/import-summary.d.ts +8 -0
  15. package/dist/declarations/src/@types/index.d.ts +7 -0
  16. package/dist/declarations/src/@types/shared.d.ts +7 -0
  17. package/dist/disabled-drop-area-2c088477.esm.js +37 -0
  18. package/dist/disabled-drop-area-99c1fa0b.cjs.prod.js +50 -0
  19. package/dist/disabled-drop-area-aa78075b.cjs.dev.js +50 -0
  20. package/dist/enabled-drop-area-32e0dc61.cjs.prod.js +123 -0
  21. package/dist/enabled-drop-area-56d860b6.cjs.dev.js +123 -0
  22. package/dist/enabled-drop-area-69507fae.esm.js +110 -0
  23. package/dist/file-dropped-area-6acf82c0.cjs.dev.js +83 -0
  24. package/dist/file-dropped-area-6f365e02.esm.js +81 -0
  25. package/dist/file-dropped-area-e856a71f.cjs.prod.js +83 -0
  26. package/dist/index-a4665b30.esm.js +1854 -0
  27. package/dist/index-bb7f975c.cjs.dev.js +1889 -0
  28. package/dist/index-d79bbd8e.cjs.prod.js +1883 -0
  29. package/package.json +39 -29
@@ -0,0 +1,1883 @@
1
+ 'use strict';
2
+
3
+ var _Object$keys = require('@babel/runtime-corejs3/core-js-stable/object/keys');
4
+ var _Object$getOwnPropertySymbols = require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols');
5
+ var _filterInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/filter');
6
+ var _Object$getOwnPropertyDescriptor = require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor');
7
+ var _forEachInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/for-each');
8
+ var _Object$getOwnPropertyDescriptors = require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors');
9
+ var _Object$defineProperties = require('@babel/runtime-corejs3/core-js-stable/object/define-properties');
10
+ var _Object$defineProperty = require('@babel/runtime-corejs3/core-js-stable/object/define-property');
11
+ var _defineProperty = require('@babel/runtime-corejs3/helpers/defineProperty');
12
+ var reactIntl = require('react-intl');
13
+ var applicationShellConnectors = require('@commercetools-frontend/application-shell-connectors');
14
+ var _slicedToArray = require('@babel/runtime-corejs3/helpers/slicedToArray');
15
+ var React = require('react');
16
+ var sdk = require('@commercetools-frontend/sdk');
17
+ var constants = require('@commercetools-frontend/constants');
18
+ var _everyInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/every');
19
+ var _concatInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/concat');
20
+ var pluralize = require('pluralize');
21
+ var _Promise = require('@babel/runtime-corejs3/core-js-stable/promise');
22
+ var _Array$isArray = require('@babel/runtime-corejs3/core-js-stable/array/is-array');
23
+ var _flatMapInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/flat-map');
24
+ var _mapInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/map');
25
+ var _findInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/find');
26
+ var _includesInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/includes');
27
+ var Papa = require('papaparse');
28
+ var _reduceInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/reduce');
29
+ var _JSON$stringify = require('@babel/runtime-corejs3/core-js-stable/json/stringify');
30
+ var _someInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/some');
31
+ require('@babel/runtime-corejs3/core-js-stable/instance/starts-with');
32
+ require('querystring');
33
+ require('ramda');
34
+ var applicationShell = require('@commercetools-frontend/application-shell');
35
+ var _Reflect$construct = require('@babel/runtime-corejs3/core-js-stable/reflect/construct');
36
+ var _createClass = require('@babel/runtime-corejs3/helpers/createClass');
37
+ var _classCallCheck = require('@babel/runtime-corejs3/helpers/classCallCheck');
38
+ var _inherits = require('@babel/runtime-corejs3/helpers/inherits');
39
+ var _possibleConstructorReturn = require('@babel/runtime-corejs3/helpers/possibleConstructorReturn');
40
+ var _getPrototypeOf = require('@babel/runtime-corejs3/helpers/getPrototypeOf');
41
+ var _wrapNativeSuper = require('@babel/runtime-corejs3/helpers/wrapNativeSuper');
42
+ var jsxRuntime = require('@emotion/react/jsx-runtime');
43
+ var applicationComponents = require('@commercetools-frontend/application-components');
44
+ var uiKit = require('@commercetools-frontend/ui-kit');
45
+ var actionsGlobal = require('@commercetools-frontend/actions-global');
46
+ var sentry = require('@commercetools-frontend/sentry');
47
+ var reactDropzone = require('react-dropzone');
48
+ var _styled = require('@emotion/styled/base');
49
+ var react = require('@emotion/react');
50
+ var _sliceInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/slice');
51
+ var DataTable = require('@commercetools-uikit/data-table');
52
+ var truncate$1 = require('lodash.truncate');
53
+ var i18n = require('@commercetools-frontend/i18n');
54
+
55
+ function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
56
+
57
+ var _Object$keys__default = /*#__PURE__*/_interopDefault(_Object$keys);
58
+ var _Object$getOwnPropertySymbols__default = /*#__PURE__*/_interopDefault(_Object$getOwnPropertySymbols);
59
+ var _filterInstanceProperty__default = /*#__PURE__*/_interopDefault(_filterInstanceProperty);
60
+ var _Object$getOwnPropertyDescriptor__default = /*#__PURE__*/_interopDefault(_Object$getOwnPropertyDescriptor);
61
+ var _forEachInstanceProperty__default = /*#__PURE__*/_interopDefault(_forEachInstanceProperty);
62
+ var _Object$getOwnPropertyDescriptors__default = /*#__PURE__*/_interopDefault(_Object$getOwnPropertyDescriptors);
63
+ var _Object$defineProperties__default = /*#__PURE__*/_interopDefault(_Object$defineProperties);
64
+ var _Object$defineProperty__default = /*#__PURE__*/_interopDefault(_Object$defineProperty);
65
+ var React__default = /*#__PURE__*/_interopDefault(React);
66
+ var _everyInstanceProperty__default = /*#__PURE__*/_interopDefault(_everyInstanceProperty);
67
+ var _concatInstanceProperty__default = /*#__PURE__*/_interopDefault(_concatInstanceProperty);
68
+ var _Promise__default = /*#__PURE__*/_interopDefault(_Promise);
69
+ var _Array$isArray__default = /*#__PURE__*/_interopDefault(_Array$isArray);
70
+ var _flatMapInstanceProperty__default = /*#__PURE__*/_interopDefault(_flatMapInstanceProperty);
71
+ var _mapInstanceProperty__default = /*#__PURE__*/_interopDefault(_mapInstanceProperty);
72
+ var _findInstanceProperty__default = /*#__PURE__*/_interopDefault(_findInstanceProperty);
73
+ var _includesInstanceProperty__default = /*#__PURE__*/_interopDefault(_includesInstanceProperty);
74
+ var Papa__default = /*#__PURE__*/_interopDefault(Papa);
75
+ var _reduceInstanceProperty__default = /*#__PURE__*/_interopDefault(_reduceInstanceProperty);
76
+ var _JSON$stringify__default = /*#__PURE__*/_interopDefault(_JSON$stringify);
77
+ var _someInstanceProperty__default = /*#__PURE__*/_interopDefault(_someInstanceProperty);
78
+ var _Reflect$construct__default = /*#__PURE__*/_interopDefault(_Reflect$construct);
79
+ var _styled__default = /*#__PURE__*/_interopDefault(_styled);
80
+ var _sliceInstanceProperty__default = /*#__PURE__*/_interopDefault(_sliceInstanceProperty);
81
+ var DataTable__default = /*#__PURE__*/_interopDefault(DataTable);
82
+ var truncate__default = /*#__PURE__*/_interopDefault(truncate$1);
83
+
84
+ const EnabledResourceType = {
85
+ category: true,
86
+ product: true
87
+ };
88
+ function isResourceType(maybeResourceType) {
89
+ return typeof maybeResourceType === 'string' && maybeResourceType in EnabledResourceType;
90
+ }
91
+ function assertResourceType(maybeResourceType) {
92
+ if (isResourceType(maybeResourceType)) return;
93
+ throw new Error("Invalid value: ".concat(maybeResourceType));
94
+ }
95
+ function isError(maybeError) {
96
+ if (maybeError instanceof Error) return true;
97
+ return false;
98
+ }
99
+
100
+ // eslint-disable-next-line @typescript-eslint/ban-types
101
+ function hasOwnProperty(obj, prop) {
102
+ return typeof obj === 'object' && obj !== null && obj.hasOwnProperty(prop);
103
+ }
104
+ function hasRequiredFields(maybeValidObject, requiredFields) {
105
+ return typeof maybeValidObject === 'object' && maybeValidObject !== null && _everyInstanceProperty__default["default"](requiredFields).call(requiredFields, property => hasOwnProperty(maybeValidObject, property));
106
+ }
107
+
108
+ var _context;
109
+ const DEFAULT_DELIMITER = ',';
110
+ const INITIAL_COLUMN_DISPLAY_COUNT = 8;
111
+ const IMPORT_TAG_KEYS = {
112
+ source: 'source'
113
+ };
114
+ const IMPORT_TAG_VALUES = {
115
+ fileUpload: 'file-upload'
116
+ };
117
+ const TAG_KEY_SOURCE_FILE_UPLOAD = _concatInstanceProperty__default["default"](_context = "".concat(IMPORT_TAG_KEYS.source, ":")).call(_context, IMPORT_TAG_VALUES.fileUpload);
118
+
119
+ const FILE_SIZE_LIMITS_MB = {
120
+ category: 10,
121
+ product: 35
122
+ };
123
+ const ROW_LIMITS = {
124
+ category: 5000,
125
+ product: 70000
126
+ };
127
+ const RESOURCE_TYPE_TEMPLATE_DOWNLOAD_LINKS = {
128
+ category: 'https://docs.commercetools.com/merchant-center/downloads/category_import_template.csv',
129
+ product: 'https://docs.commercetools.com/merchant-center/import-data#create-a-csv-file'
130
+ };
131
+ const RESOURCE_TYPE_DOCUMENTATION_LINKS = {
132
+ category: 'https://docs.commercetools.com/merchant-center/import-categories#supported-headers-and-values',
133
+ product: 'https://docs.commercetools.com/merchant-center/import-products#supported-headers-and-values'
134
+ };
135
+
136
+ function ownKeys$f(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
137
+ function _objectSpread$f(e) { for (var r = 1; r < arguments.length; r++) { var _context2, _context3; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context2 = ownKeys$f(Object(t), !0)).call(_context2, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context3 = ownKeys$f(Object(t))).call(_context3, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
138
+
139
+ /**
140
+ * This function checks if the provided `expectedDelimiter` is used consistently in the first 10 lines of a CSV file.
141
+ * Returns a Promise that resolves to an object containing a boolean `isValid` property and the detected delimiter `delimiter`.
142
+ *
143
+ * @param {File} file - The CSV file to check.
144
+ * @param {string} [expectedDelimiter=DEFAULT_DELIMITER] - The expected delimiter to check for in the file.
145
+ * @returns {Promise<DelimiterCheck>} A Promise that resolves to a DelimiterCheck object.
146
+ */
147
+ const checkDelimiter = function (file) {
148
+ let expectedDelimiter = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : DEFAULT_DELIMITER;
149
+ return new _Promise__default["default"](resolve => {
150
+ let lineCount = 0;
151
+ let correctDelimiterCount = 0;
152
+ let detectedDelimiter = null;
153
+ Papa__default["default"].parse(file, {
154
+ step: (results, parser) => {
155
+ lineCount++;
156
+ if (detectedDelimiter === null) {
157
+ detectedDelimiter = results.meta.delimiter;
158
+ }
159
+ if (results.meta.delimiter === expectedDelimiter) {
160
+ correctDelimiterCount++;
161
+ }
162
+ if (lineCount >= 10) {
163
+ parser.abort();
164
+ }
165
+ },
166
+ complete: () => {
167
+ const isValid = correctDelimiterCount === lineCount;
168
+ resolve({
169
+ isValid,
170
+ delimiter: detectedDelimiter
171
+ });
172
+ }
173
+ });
174
+ });
175
+ };
176
+ const mapUploadFileErrorsResponseToUploadFileErrorRows = uploadFileErrorsResponse => {
177
+ if (!uploadFileErrorsResponse || !_Array$isArray__default["default"](uploadFileErrorsResponse)) return [];
178
+ let idCounter = 1;
179
+ return _flatMapInstanceProperty__default["default"](uploadFileErrorsResponse).call(uploadFileErrorsResponse, rowErrorsResponse => {
180
+ var _context;
181
+ return _mapInstanceProperty__default["default"](_context = rowErrorsResponse.errors).call(_context, rowError => ({
182
+ // DataTable component requires unique `id` field
183
+ id: String(idCounter++),
184
+ row: rowErrorsResponse.row,
185
+ field: rowError.field,
186
+ code: rowError.code,
187
+ validationMessage: rowError.message
188
+ }));
189
+ });
190
+ };
191
+ const mapUploadFileClientSideErrorsToUploadFileErrorRows = uploadFileClientSideErrors => {
192
+ let idCounter = 1;
193
+ return _mapInstanceProperty__default["default"](uploadFileClientSideErrors).call(uploadFileClientSideErrors, uploadFileClientSideError => _objectSpread$f(_objectSpread$f({}, uploadFileClientSideError), {}, {
194
+ id: String(idCounter++)
195
+ }));
196
+ };
197
+ const extractErrorDescriptionFromValidationMessage = message => {
198
+ return message.split('"').pop();
199
+ };
200
+
201
+ /**
202
+ * Returns the number of rows in a CSV file excluding the header
203
+ * @param file The CSV file to process.
204
+ * @returns A promise that resolves to the number of rows
205
+ */
206
+ const getRowCount = file => {
207
+ return new _Promise__default["default"](resolve => {
208
+ let lineCount = 0;
209
+ Papa__default["default"].parse(file, {
210
+ step: _ref => {
211
+ let data = _ref.data;
212
+ // empty lines at the end of the file should not be counted
213
+ if (_Array$isArray__default["default"](data) && _findInstanceProperty__default["default"](data).call(data, Boolean)) lineCount++;
214
+ },
215
+ complete: () => {
216
+ // Subtract 1 for the header row
217
+ // We use Math.max to make sure the count is not less than 0, this is needed for empty files
218
+ resolve(Math.max(0, lineCount - 1));
219
+ }
220
+ });
221
+ });
222
+ };
223
+ const toBytes = megabytes => megabytes * 1024 * 1024;
224
+
225
+ /**
226
+ * Returns columns from the provided `columns` excluding those specified in the `ignoredColumns`
227
+ */
228
+ const getValidatedColumns = (columns, ignoredColumns) => {
229
+ return _filterInstanceProperty__default["default"](columns).call(columns, column => !_includesInstanceProperty__default["default"](ignoredColumns).call(ignoredColumns, column));
230
+ };
231
+
232
+ function getFileUploadErrorsCount(errors) {
233
+ if (!errors || !_Array$isArray__default["default"](errors)) return 0;
234
+ return _reduceInstanceProperty__default["default"](errors).call(errors, (acc, curr) => acc += curr.errors.length, 0);
235
+ }
236
+ function convertFileSizeToKB(sizeInBytes) {
237
+ return sizeInBytes / 1000;
238
+ }
239
+ function isAbortError(error) {
240
+ return error instanceof DOMException && error.name === 'AbortError';
241
+ }
242
+
243
+ const encodeFileNameWithTimestampToContainerKey = fileName => {
244
+ return btoa(_JSON$stringify__default["default"]({
245
+ timestamp: new Date().getTime(),
246
+ fileName
247
+ })).replace(/=+$/g, '');
248
+ };
249
+
250
+ function getCreateImportContainerURL(projectKey) {
251
+ return "/".concat(projectKey, "/import-containers");
252
+ }
253
+ function getDeleteImportContainerURL(projectKey, containerKey) {
254
+ var _context6;
255
+ return _concatInstanceProperty__default["default"](_context6 = "/".concat(projectKey, "/import-containers/")).call(_context6, containerKey);
256
+ }
257
+ function getFileUploadURL(projectKey, resourceType, containerKey) {
258
+ var _context8, _context9;
259
+ return _concatInstanceProperty__default["default"](_context8 = _concatInstanceProperty__default["default"](_context9 = "/".concat(projectKey, "/")).call(_context9, pluralize.plural(resourceType), "/import-containers/")).call(_context8, containerKey, "/file-upload");
260
+ }
261
+ function getProccessFileURL(projectKey, resourceType, containerKey) {
262
+ var _context10, _context11;
263
+ return _concatInstanceProperty__default["default"](_context10 = _concatInstanceProperty__default["default"](_context11 = "/".concat(projectKey, "/")).call(_context11, pluralize.plural(resourceType), "/import-containers/")).call(_context10, containerKey, "/process-file");
264
+ }
265
+
266
+ function _createSuper$3(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$3(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = _Reflect$construct__default["default"](Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
267
+ function _isNativeReflectConstruct$3() { try { var t = !Boolean.prototype.valueOf.call(_Reflect$construct__default["default"](Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct$3 = function () { return !!t; })(); }
268
+ let UnexpectedResourceTypeError = /*#__PURE__*/function (_Error) {
269
+ _inherits(UnexpectedResourceTypeError, _Error);
270
+ var _super = _createSuper$3(UnexpectedResourceTypeError);
271
+ function UnexpectedResourceTypeError(resourceType) {
272
+ var _this;
273
+ _classCallCheck(this, UnexpectedResourceTypeError);
274
+ _this = _super.call(this, "Unexpected resource type \"".concat(resourceType, "\""));
275
+ _this.name = 'UnexpectedResourceTypeError';
276
+ return _this;
277
+ }
278
+ return _createClass(UnexpectedResourceTypeError);
279
+ }( /*#__PURE__*/_wrapNativeSuper(Error));
280
+
281
+ function _createSuper$2(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$2(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = _Reflect$construct__default["default"](Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
282
+ function _isNativeReflectConstruct$2() { try { var t = !Boolean.prototype.valueOf.call(_Reflect$construct__default["default"](Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct$2 = function () { return !!t; })(); }
283
+ let MissingImportResourceProviderError = /*#__PURE__*/function (_Error) {
284
+ _inherits(MissingImportResourceProviderError, _Error);
285
+ var _super = _createSuper$2(MissingImportResourceProviderError);
286
+ function MissingImportResourceProviderError() {
287
+ var _this;
288
+ _classCallCheck(this, MissingImportResourceProviderError);
289
+ _this = _super.call(this, 'useImportResourcesContext must be used within ImportResourcesProvider');
290
+ _this.name = 'MissingImportResourceProviderError';
291
+ return _this;
292
+ }
293
+ return _createClass(MissingImportResourceProviderError);
294
+ }( /*#__PURE__*/_wrapNativeSuper(Error));
295
+
296
+ function _createSuper$1(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = _Reflect$construct__default["default"](Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
297
+ function _isNativeReflectConstruct$1() { try { var t = !Boolean.prototype.valueOf.call(_Reflect$construct__default["default"](Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct$1 = function () { return !!t; })(); }
298
+ let UnexpectedColumnError = /*#__PURE__*/function (_Error) {
299
+ _inherits(UnexpectedColumnError, _Error);
300
+ var _super = _createSuper$1(UnexpectedColumnError);
301
+ function UnexpectedColumnError(columnName) {
302
+ var _this;
303
+ _classCallCheck(this, UnexpectedColumnError);
304
+ _this = _super.call(this, "Unexpected column \"".concat(columnName, "\""));
305
+ _this.name = 'UnexpectedColumnError';
306
+ return _this;
307
+ }
308
+ return _createClass(UnexpectedColumnError);
309
+ }( /*#__PURE__*/_wrapNativeSuper(Error));
310
+
311
+ function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = _Reflect$construct__default["default"](Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
312
+ function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(_Reflect$construct__default["default"](Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function () { return !!t; })(); }
313
+ let HttpError = /*#__PURE__*/function (_Error) {
314
+ _inherits(HttpError, _Error);
315
+ var _super = _createSuper(HttpError);
316
+ function HttpError(statusCode, statusText, errorData) {
317
+ var _context;
318
+ var _this;
319
+ _classCallCheck(this, HttpError);
320
+ _this = _super.call(this, _concatInstanceProperty__default["default"](_context = "HTTP Error! Status code: ".concat(statusCode, ", message: \"")).call(_context, statusText ? statusText : '', "\""));
321
+ _this.statusCode = void 0;
322
+ _this.errorData = void 0;
323
+ _this.name = 'HttpError';
324
+ _this.statusCode = statusCode;
325
+ _this.errorData = errorData;
326
+ return _this;
327
+ }
328
+ return _createClass(HttpError);
329
+ }( /*#__PURE__*/_wrapNativeSuper(Error));
330
+
331
+ function ownKeys$e(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
332
+ function _objectSpread$e(e) { for (var r = 1; r < arguments.length; r++) { var _context2, _context3; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context2 = ownKeys$e(Object(t), !0)).call(_context2, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context3 = ownKeys$e(Object(t))).call(_context3, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
333
+ const addProxyPrefixToUrl = (uri, proxy) => {
334
+ var _context;
335
+ return proxy ? _concatInstanceProperty__default["default"](_context = "/proxy/".concat(proxy)).call(_context, uri) : uri;
336
+ };
337
+ const fetcher = async _ref => {
338
+ let url = _ref.url,
339
+ payload = _ref.payload,
340
+ config = _ref.config;
341
+ const data = await applicationShell.executeHttpClientRequest(async options => {
342
+ const res = await fetch(applicationShell.buildApiUrl(addProxyPrefixToUrl(url, config === null || config === void 0 ? void 0 : config.proxy)), _objectSpread$e(_objectSpread$e({}, options), {}, {
343
+ method: config === null || config === void 0 ? void 0 : config.method,
344
+ body: payload,
345
+ signal: config === null || config === void 0 ? void 0 : config.abortSignal
346
+ }));
347
+ if (!res.ok) {
348
+ const errorData = await res.json();
349
+ throw new HttpError(res.status, res.statusText, errorData);
350
+ }
351
+ const data = res.json();
352
+ return {
353
+ data,
354
+ statusCode: res.status,
355
+ getHeader: key => res.headers.get(key)
356
+ };
357
+ }, {
358
+ headers: _objectSpread$e({
359
+ 'Content-Type': 'application/json'
360
+ }, config === null || config === void 0 ? void 0 : config.headers)
361
+ });
362
+ return data;
363
+ };
364
+
365
+ async function uploadFileForImport(_ref) {
366
+ let projectKey = _ref.projectKey,
367
+ containerKey = _ref.containerKey,
368
+ resourceType = _ref.resourceType,
369
+ file = _ref.file,
370
+ abortSignal = _ref.abortSignal;
371
+ const uri = getFileUploadURL(projectKey, resourceType, containerKey);
372
+ const formData = new FormData();
373
+ formData.append('file', file, file.name);
374
+ const response = await fetcher({
375
+ url: uri,
376
+ payload: formData,
377
+ config: {
378
+ abortSignal,
379
+ proxy: constants.MC_API_PROXY_TARGETS.IMPORT,
380
+ method: 'POST',
381
+ headers: {
382
+ 'Content-Type': null
383
+ }
384
+ }
385
+ });
386
+ return response;
387
+ }
388
+
389
+ function ownKeys$d(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
390
+ function _objectSpread$d(e) { for (var r = 1; r < arguments.length; r++) { var _context2, _context3; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context2 = ownKeys$d(Object(t), !0)).call(_context2, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context3 = ownKeys$d(Object(t))).call(_context3, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
391
+ function createImportContainerForFileUpload(importContainerDraft, projectKey, asyncDispatch) {
392
+ return asyncDispatch(sdk.actions.post({
393
+ mcApiProxyTarget: constants.MC_API_PROXY_TARGETS.IMPORT,
394
+ uri: getCreateImportContainerURL(projectKey),
395
+ headers: {
396
+ accept: 'application/json',
397
+ 'Content-Type': 'application/json'
398
+ },
399
+ payload: _JSON$stringify__default["default"](_objectSpread$d(_objectSpread$d({}, importContainerDraft), {}, {
400
+ tags: [TAG_KEY_SOURCE_FILE_UPLOAD]
401
+ }))
402
+ }));
403
+ }
404
+ function deleteImportContainer(projectKey, containerKey, asyncDispatch) {
405
+ return asyncDispatch(sdk.actions.del({
406
+ mcApiProxyTarget: constants.MC_API_PROXY_TARGETS.IMPORT,
407
+ uri: getDeleteImportContainerURL(projectKey, containerKey),
408
+ headers: {
409
+ accept: 'application/json'
410
+ }
411
+ }));
412
+ }
413
+
414
+ async function processUploadedFile(_ref) {
415
+ let projectKey = _ref.projectKey,
416
+ containerKey = _ref.containerKey,
417
+ resourceType = _ref.resourceType,
418
+ asyncDispatch = _ref.asyncDispatch;
419
+ const uri = getProccessFileURL(projectKey, resourceType, containerKey);
420
+ const response = await asyncDispatch(sdk.actions.post({
421
+ mcApiProxyTarget: constants.MC_API_PROXY_TARGETS.IMPORT,
422
+ uri: uri,
423
+ headers: {
424
+ accept: 'application/json',
425
+ 'Content-Type': 'application/json'
426
+ },
427
+ payload: {}
428
+ }));
429
+ assertProcessFileResponse(response);
430
+ return response;
431
+ }
432
+ function assertProcessFileResponse(maybeProcessFileResponse) {
433
+ const requiredFields = ['message'];
434
+ if (hasRequiredFields(maybeProcessFileResponse, requiredFields)) return;
435
+ throw new Error('Invalid response');
436
+ }
437
+
438
+ function ownKeys$c(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
439
+ function _objectSpread$c(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context = ownKeys$c(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context2 = ownKeys$c(Object(t))).call(_context2, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
440
+ function reducer(state, action) {
441
+ if (action.type === 'setCurrentStep') return _objectSpread$c(_objectSpread$c({}, state), {}, {
442
+ currentStep: action.currentStep
443
+ });
444
+ if (action.type === 'setUploadFileResponse') return _objectSpread$c(_objectSpread$c({}, state), {}, {
445
+ uploadFileResponse: action.uploadFileResponse
446
+ });
447
+ if (action.type === 'setResourceType') return _objectSpread$c(_objectSpread$c({}, state), {}, {
448
+ resourceType: action.resourceType
449
+ });
450
+ if (action.type === 'setContainerKey') return _objectSpread$c(_objectSpread$c({}, state), {}, {
451
+ containerKey: action.containerKey
452
+ });
453
+ if (action.type === 'cancelImport') return _objectSpread$c(_objectSpread$c({}, state), {}, {
454
+ currentStep: 1,
455
+ containerKey: undefined,
456
+ fileUploadClientSideErrors: [],
457
+ uploadFileResponse: undefined,
458
+ droppedFile: undefined,
459
+ dropAreaState: 'disabled'
460
+ });
461
+ if (action.type === 'uploadNewFile') return _objectSpread$c(_objectSpread$c({}, state), {}, {
462
+ currentStep: 1,
463
+ containerKey: undefined,
464
+ fileUploadClientSideErrors: [],
465
+ uploadFileResponse: undefined,
466
+ droppedFile: undefined,
467
+ dropAreaState: 'ready-for-drop'
468
+ });
469
+ if (action.type === 'setDroppedFile') {
470
+ return _objectSpread$c(_objectSpread$c({}, state), {}, {
471
+ droppedFile: action.droppedFile
472
+ });
473
+ }
474
+ if (action.type === 'setFileUploadClientSideErrors') {
475
+ return _objectSpread$c(_objectSpread$c({}, state), {}, {
476
+ fileUploadClientSideErrors: action.fileUploadClientSideErrors
477
+ });
478
+ }
479
+ if (action.type === 'setAbortController') {
480
+ return _objectSpread$c(_objectSpread$c({}, state), {}, {
481
+ abortController: action.abortController
482
+ });
483
+ }
484
+ throw new Error(getUnknownActionError(action));
485
+ }
486
+ function getUnknownActionError(actionType) {
487
+ return "Unkown type: ".concat(actionType);
488
+ }
489
+ const initialState = {
490
+ currentStep: 1,
491
+ abortController: new AbortController(),
492
+ dropAreaState: 'disabled',
493
+ uploadFileResponse: undefined,
494
+ fileUploadClientSideErrors: [],
495
+ resourceType: 'category',
496
+ containerKey: undefined
497
+ };
498
+
499
+ function ownKeys$b(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
500
+ function _objectSpread$b(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context = ownKeys$b(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context2 = ownKeys$b(Object(t))).call(_context2, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
501
+ const ImportResourcesContext = /*#__PURE__*/React__default["default"].createContext();
502
+ const ImportResourcesProvider = props => {
503
+ const _useApplicationContex = applicationShellConnectors.useApplicationContext(context => {
504
+ var _context$project;
505
+ return {
506
+ projectKey: (_context$project = context.project) === null || _context$project === void 0 ? void 0 : _context$project.key
507
+ };
508
+ }),
509
+ projectKey = _useApplicationContex.projectKey;
510
+ const asyncDispatch = sdk.useAsyncDispatch();
511
+ const _React$useReducer = React__default["default"].useReducer(reducer, _objectSpread$b(_objectSpread$b({}, initialState), {}, {
512
+ resourceType: props.resourceType
513
+ })),
514
+ _React$useReducer2 = _slicedToArray(_React$useReducer, 2),
515
+ state = _React$useReducer2[0],
516
+ dispatch = _React$useReducer2[1];
517
+ const setCurrentStep = currentStep => dispatch({
518
+ type: 'setCurrentStep',
519
+ currentStep
520
+ });
521
+ const setUploadFileResponse = _uploadFileResponse => dispatch({
522
+ type: 'setUploadFileResponse',
523
+ uploadFileResponse: _uploadFileResponse
524
+ });
525
+ const setResourceType = nextResourceType => dispatch({
526
+ type: 'setResourceType',
527
+ resourceType: nextResourceType
528
+ });
529
+ const setContainerKey = containerKey => dispatch({
530
+ type: 'setContainerKey',
531
+ containerKey
532
+ });
533
+ const cancelImport = () => dispatch({
534
+ type: 'cancelImport'
535
+ });
536
+ const uploadNewFile = () => dispatch({
537
+ type: 'uploadNewFile'
538
+ });
539
+ const setDroppedFile = nextDroppedFile => dispatch({
540
+ type: 'setDroppedFile',
541
+ droppedFile: nextDroppedFile
542
+ });
543
+ const setAbortController = nextAbortController => dispatch({
544
+ type: 'setAbortController',
545
+ abortController: nextAbortController
546
+ });
547
+ const setFileUploadClientSideErrors = nextFileUploadClientSideErrors => dispatch({
548
+ type: 'setFileUploadClientSideErrors',
549
+ fileUploadClientSideErrors: nextFileUploadClientSideErrors
550
+ });
551
+ const handleClose = function () {
552
+ let _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
553
+ shouldDeleteImportContainer = _ref.shouldDeleteImportContainer;
554
+ if (state.abortController) state.abortController.abort();
555
+ if (typeof props.onClose === 'function') props.onClose();
556
+ // Removes the associated import container when the import is closed
557
+ if (shouldDeleteImportContainer && projectKey && state.containerKey) deleteImportContainer(projectKey, state.containerKey, asyncDispatch);
558
+ };
559
+ const handleStartImportSuccess = () => {
560
+ if (typeof props.onStartImportSuccess === 'function') props.onStartImportSuccess();
561
+ };
562
+ return jsxRuntime.jsx(ImportResourcesContext.Provider, {
563
+ value: {
564
+ state,
565
+ onClose: handleClose,
566
+ onStartImportSuccess: handleStartImportSuccess,
567
+ actions: {
568
+ setCurrentStep,
569
+ cancelImport,
570
+ uploadNewFile,
571
+ setUploadFileResponse,
572
+ setResourceType,
573
+ setDroppedFile,
574
+ setContainerKey,
575
+ setAbortController,
576
+ setFileUploadClientSideErrors
577
+ }
578
+ },
579
+ children: props.children
580
+ });
581
+ };
582
+
583
+ function useImportResourcesContext() {
584
+ const context = React.useContext(ImportResourcesContext);
585
+ if (!context) {
586
+ throw new MissingImportResourceProviderError();
587
+ }
588
+ return context;
589
+ }
590
+
591
+ var messages$3 = reactIntl.defineMessages({
592
+ fileSizeExceededTitle: {
593
+ id: 'ImportResourcesModal.sizeExceededTitle',
594
+ defaultMessage: 'File size exceeded'
595
+ },
596
+ fileSizeExceededDescription: {
597
+ id: 'ImportResourcesModal.sizeExceededDescription',
598
+ description: 'Error description when the file size exceeds the allowable limit',
599
+ defaultMessage: 'The file exceeds the maximum allowed size of {fileSizeLimit} MB'
600
+ },
601
+ rowLimitExceededTitle: {
602
+ id: 'ImportResourcesModal.rowLimitExceededTitle',
603
+ defaultMessage: 'Row limit exceeded'
604
+ },
605
+ rowLimitExceededDescription: {
606
+ id: 'ImportResourcesModal.rowLimitExceededDescription',
607
+ description: 'Error description when the file contains more rows than the allowable maximum',
608
+ defaultMessage: 'The file contains more than the allowable maximum of {rowLimit} rows'
609
+ },
610
+ dropAreaWrongDelimiterTitle: {
611
+ id: 'ImportResourcesModal.wrongDelimiterTitle',
612
+ defaultMessage: 'Wrong delimiter'
613
+ },
614
+ dropAreaWrongDelimiterDescription: {
615
+ id: 'ImportResourcesModal.wrongDelimiterDescription',
616
+ description: 'Message within the drop area when a CSV file uses an unexpected delimiter',
617
+ defaultMessage: 'The file is using the wrong delimiter "{delimiter}"'
618
+ },
619
+ dropAreaNotEnoughRowsTitle: {
620
+ id: 'ImportResourcesModal.dropAreaNotEnoughRowsTitle',
621
+ description: 'Error title shown when the uploaded CSV file does not contain a header and at least one row of data',
622
+ defaultMessage: 'Invalid CSV file'
623
+ },
624
+ dropAreaNotEnoughRowsDescription: {
625
+ id: 'ImportResourcesModal.dropAreaNotEnoughRowsDescription',
626
+ description: 'Error description shown when the uploaded CSV file does not contain a header and at least one row of data',
627
+ defaultMessage: 'Make sure the file contains a header and at least one row of data'
628
+ },
629
+ unexpectedError: {
630
+ id: 'ImportResourcesModal.unexpectedError',
631
+ description: 'Generic notification message when file upload fails',
632
+ defaultMessage: 'An unexpected error occurred during the file upload. Please try again, or contact support if this error occurs again.'
633
+ }
634
+ });
635
+
636
+ const useUpload = () => {
637
+ const intl = reactIntl.useIntl();
638
+ const projectKey = applicationShellConnectors.useApplicationContext(context => {
639
+ var _context$project;
640
+ return (_context$project = context.project) === null || _context$project === void 0 ? void 0 : _context$project.key;
641
+ });
642
+ const _useImportResourcesCo = useImportResourcesContext(),
643
+ state = _useImportResourcesCo.state,
644
+ actions = _useImportResourcesCo.actions;
645
+ const asyncDispatch = sdk.useAsyncDispatch();
646
+ const showNotification = actionsGlobal.useShowNotification();
647
+ React__default["default"].useEffect(() => {
648
+ return () => {
649
+ if (state.abortController) state.abortController.abort();
650
+ };
651
+ }, [state.abortController]);
652
+ const isFileValid = async file => {
653
+ const errors = [];
654
+ const delimiterCheck = await checkDelimiter(file);
655
+ if (!delimiterCheck.isValid) errors.push({
656
+ title: intl.formatMessage(messages$3.dropAreaWrongDelimiterTitle),
657
+ description: intl.formatMessage(messages$3.dropAreaWrongDelimiterDescription, {
658
+ delimiter: delimiterCheck.delimiter
659
+ })
660
+ });
661
+ const rowCount = await getRowCount(file);
662
+ if (rowCount < 1) errors.push({
663
+ title: intl.formatMessage(messages$3.dropAreaNotEnoughRowsTitle),
664
+ description: intl.formatMessage(messages$3.dropAreaNotEnoughRowsDescription)
665
+ });
666
+ if (state.resourceType && file.size > toBytes(FILE_SIZE_LIMITS_MB[state.resourceType])) errors.push({
667
+ title: intl.formatMessage(messages$3.fileSizeExceededTitle),
668
+ description: intl.formatMessage(messages$3.fileSizeExceededDescription, {
669
+ fileSizeLimit: intl.formatNumber(FILE_SIZE_LIMITS_MB[state.resourceType])
670
+ })
671
+ });
672
+ if (state.resourceType && rowCount > ROW_LIMITS[state.resourceType]) errors.push({
673
+ title: intl.formatMessage(messages$3.rowLimitExceededTitle),
674
+ description: intl.formatMessage(messages$3.rowLimitExceededDescription, {
675
+ rowLimit: intl.formatNumber(ROW_LIMITS[state.resourceType])
676
+ })
677
+ });
678
+ if (errors.length > 0) {
679
+ actions.setFileUploadClientSideErrors(errors);
680
+ actions.setCurrentStep(3);
681
+ return false;
682
+ }
683
+ return true;
684
+ };
685
+ const handleUploadError = error => {
686
+ if (isAbortError(error)) {
687
+ actions.cancelImport();
688
+ return;
689
+ }
690
+ if (error instanceof HttpError) {
691
+ var _error$errorData, _error$errorData2;
692
+ if (((_error$errorData = error.errorData) === null || _error$errorData === void 0 ? void 0 : _error$errorData.code) === 'MISSING_KEY_ERROR') {
693
+ actions.cancelImport();
694
+ showNotification({
695
+ kind: 'error',
696
+ domain: constants.DOMAINS.PAGE,
697
+ text: error.errorData.message
698
+ });
699
+ } else if (((_error$errorData2 = error.errorData) === null || _error$errorData2 === void 0 ? void 0 : _error$errorData2.invalid) > 0) {
700
+ actions.setUploadFileResponse(error.errorData);
701
+ } else {
702
+ actions.cancelImport();
703
+ showNotification({
704
+ kind: 'error',
705
+ domain: constants.DOMAINS.PAGE,
706
+ text: intl.formatMessage(messages$3.unexpectedError)
707
+ });
708
+ }
709
+ } else {
710
+ var _state$droppedFile;
711
+ actions.cancelImport();
712
+ showNotification({
713
+ kind: 'error',
714
+ domain: constants.DOMAINS.PAGE,
715
+ text: isError(error) ? error.toString() : String(error)
716
+ });
717
+ sentry.reportErrorToSentry(new Error('Upload File Error: An unexpected issue occurred while uploading the file'), {
718
+ extra: {
719
+ error,
720
+ projectKey,
721
+ containerKey: state.containerKey,
722
+ resourceType: state.resourceType,
723
+ fileSizeInBytes: (_state$droppedFile = state.droppedFile) === null || _state$droppedFile === void 0 ? void 0 : _state$droppedFile.size
724
+ }
725
+ });
726
+ }
727
+ };
728
+ const handleUploadAndValidation = async () => {
729
+ if (!projectKey || !state.droppedFile || !state.resourceType) return;
730
+ const canUpload = await isFileValid(state.droppedFile);
731
+ if (!canUpload) return;
732
+ actions.setCurrentStep(2);
733
+ const containerKey = encodeFileNameWithTimestampToContainerKey(state.droppedFile.name);
734
+ actions.setContainerKey(containerKey);
735
+ const newAbortController = new AbortController();
736
+ actions.setAbortController(newAbortController);
737
+ try {
738
+ await createImportContainerForFileUpload({
739
+ key: containerKey,
740
+ resourceType: state.resourceType
741
+ }, projectKey, asyncDispatch);
742
+ const fileUploadResponse = await uploadFileForImport({
743
+ projectKey,
744
+ containerKey,
745
+ resourceType: state.resourceType,
746
+ file: state.droppedFile,
747
+ abortSignal: newAbortController.signal
748
+ });
749
+ actions.setUploadFileResponse(fileUploadResponse);
750
+ } catch (error) {
751
+ deleteImportContainer(projectKey, containerKey, asyncDispatch);
752
+ handleUploadError(error);
753
+ } finally {
754
+ actions.setCurrentStep(3);
755
+ }
756
+ };
757
+ return {
758
+ handleUploadAndValidation
759
+ };
760
+ };
761
+
762
+ function resourceTypeToDisplayName(_ref) {
763
+ let resourceType = _ref.resourceType,
764
+ _ref$isUpperCase = _ref.isUpperCase,
765
+ isUpperCase = _ref$isUpperCase === void 0 ? false : _ref$isUpperCase,
766
+ _ref$isPlural = _ref.isPlural,
767
+ isPlural = _ref$isPlural === void 0 ? false : _ref$isPlural;
768
+ let displayName;
769
+ switch (resourceType) {
770
+ case 'category':
771
+ displayName = isPlural ? 'Categories' : 'Category';
772
+ break;
773
+ case 'product':
774
+ displayName = isPlural ? 'Products' : 'Product';
775
+ break;
776
+ default:
777
+ throw new UnexpectedResourceTypeError(resourceType);
778
+ }
779
+ return isUpperCase ? displayName : displayName.toLowerCase();
780
+ }
781
+
782
+ const getBorderColor = state => {
783
+ const borderColors = {
784
+ default: '#909dbc',
785
+ error: '#e60050',
786
+ active: uiKit.customProperties.colorPrimary
787
+ };
788
+ return borderColors[state] || borderColors.default;
789
+ };
790
+ const getDashedBorder = function () {
791
+ let state = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'default';
792
+ const color = getBorderColor(state);
793
+ const svgContent = "\n <svg width=\"100%\" height=\"100%\" xmlns=\"http://www.w3.org/2000/svg\">\n <rect width=\"100%\" height=\"100%\" fill=\"none\" stroke=\"".concat(color, "\" stroke-width=\"2px\" stroke-dasharray=\"6,6\" stroke-dashoffset=\"0\" stroke-linecap=\"square\"/>\n </svg>\n ");
794
+ return "data:image/svg+xml,".concat(encodeURIComponent(svgContent));
795
+ };
796
+ const base = /*#__PURE__*/react.css("border-radius:", uiKit.customProperties.borderRadius6, ";min-height:136px;display:flex;justify-content:center;align-items:center;" + ("" ), "" );
797
+ const disabled = /*#__PURE__*/react.css("" , "" );
798
+ const readyForDrop = /*#__PURE__*/react.css("background-image:url(\"", getDashedBorder(), "\");background-color:", uiKit.customProperties.colorSurface, ";" + ("" ), "" );
799
+ const activeDrag = /*#__PURE__*/react.css("background-image:url(\"", getDashedBorder('active'), "\");background-color:", uiKit.customProperties.colorPrimary95, ";padding:", uiKit.customProperties.spacing50, " 100px;" + ("" ), "" );
800
+ const fileDropped = /*#__PURE__*/react.css("background-image:url(\"", getDashedBorder(), "\");background-color:", uiKit.customProperties.colorSurface, ";padding:", uiKit.customProperties.spacing50, " 100px;" + ("" ), "" );
801
+ const styles = {
802
+ base,
803
+ readyForDrop,
804
+ fileDropped,
805
+ disabled,
806
+ activeDrag
807
+ };
808
+
809
+ const DropWrapper = /*#__PURE__*/_styled__default["default"]("div", {
810
+ target: "ef0z5en0"
811
+ } )(styles.base, " ", props => {
812
+ if (props.dropAreaState === 'disabled') {
813
+ return styles.disabled;
814
+ }
815
+ if (props.dropAreaState === 'ready-for-drop') {
816
+ return styles.readyForDrop;
817
+ }
818
+ if (props.dropAreaState === 'active-drag') {
819
+ return styles.activeDrag;
820
+ }
821
+ if (props.dropAreaState === 'file-dropped') {
822
+ return styles.fileDropped;
823
+ }
824
+ return getDefaultDropWrapperStyles(props.dropAreaState);
825
+ }, ";" + ("" ));
826
+ function getDefaultDropWrapperStyles(_dropAreaState) {
827
+ return /*#__PURE__*/react.css("" , "" );
828
+ }
829
+
830
+ var ActiveDragDropArea = /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return require('./active-drag-drop-area-be3680ab.cjs.prod.js' /* webpackChunkName: "active-drag-drop-area" */); }));
831
+
832
+ var DisabledDropArea = /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return require('./disabled-drop-area-99c1fa0b.cjs.prod.js' /* webpackChunkName: "disabled-drop-area" */); }));
833
+
834
+ var EnabledDropArea = /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return require('./enabled-drop-area-32e0dc61.cjs.prod.js' /* webpackChunkName: "enabled-drop-area" */); }));
835
+
836
+ var FileDropped = /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return require('./file-dropped-area-e856a71f.cjs.prod.js' /* webpackChunkName: "filed-dropped-area" */); }));
837
+
838
+ function getDropArea(_ref) {
839
+ let dropAreaState = _ref.dropAreaState,
840
+ resourceType = _ref.resourceType,
841
+ isFileDropped = _ref.isFileDropped;
842
+ if (dropAreaState === 'file-dropped') {
843
+ return jsxRuntime.jsx(FileDropped, {});
844
+ }
845
+ if (dropAreaState === 'disabled' || !resourceType) {
846
+ return jsxRuntime.jsx(DisabledDropArea, {});
847
+ }
848
+ if (dropAreaState === 'ready-for-drop') {
849
+ return jsxRuntime.jsx(EnabledDropArea, {});
850
+ }
851
+ if (dropAreaState === 'active-drag') {
852
+ return jsxRuntime.jsx(ActiveDragDropArea, {
853
+ isFileDropped: isFileDropped
854
+ });
855
+ }
856
+ return fallbackDropArea();
857
+ }
858
+ function fallbackDropArea(_invalidDropAreaState) {
859
+ return jsxRuntime.jsx(DisabledDropArea, {});
860
+ }
861
+ function getDropAreaState(flags) {
862
+ if (flags.isDragActive) {
863
+ return 'active-drag';
864
+ }
865
+ if (flags.hasResourceType) {
866
+ return 'disabled';
867
+ }
868
+ if (flags.isReady) {
869
+ return 'file-dropped';
870
+ }
871
+ return 'ready-for-drop';
872
+ }
873
+
874
+ var messages$2 = reactIntl.defineMessages({
875
+ modalDescription: {
876
+ id: 'ImportResourcesModal.modalDescription',
877
+ description: 'Label for the modal category description',
878
+ defaultMessage: 'Maximum file size is {fileSize} MB with a limit of {rowLimit} rows. Download <csvTemplateLink>the CSV template</csvTemplateLink> or refer to <documentationLink>the documentation</documentationLink>.'
879
+ },
880
+ dragAndDropCSV: {
881
+ id: 'ImportResourcesModal.dragAndDropCSV',
882
+ description: 'The message telling the user to drag and drop CSV file in the file drop area',
883
+ defaultMessage: 'Drag and drop CSV'
884
+ },
885
+ or: {
886
+ id: 'ImportResourcesModal.or',
887
+ description: 'The word "or" in the drag and drop message',
888
+ defaultMessage: 'or'
889
+ },
890
+ browseButton: {
891
+ id: 'ImportResourcesModal.browseFile',
892
+ defaultMessage: 'Browse file'
893
+ },
894
+ uploadFile: {
895
+ id: 'ImportResourcesModal.uploadFile',
896
+ description: 'Label for a button on the file upload page, shown on active drop area state',
897
+ defaultMessage: 'Upload file'
898
+ },
899
+ chooseFile: {
900
+ id: 'ImportResourcesModal.chooseFile',
901
+ description: 'Label for a button on the file upload page, shown on ready to upload state',
902
+ defaultMessage: 'Choose file'
903
+ },
904
+ fileUploadFailed: {
905
+ id: 'ImportResourcesModal.fileUploadFailed',
906
+ description: 'A title on the file upload page, shown on file upload error state',
907
+ defaultMessage: 'File upload failed'
908
+ },
909
+ fileFormatNotSupported: {
910
+ id: 'ImportResourcesModal.fileFormatNotSupported',
911
+ description: 'Error message displayed when a user drags and drops a non-CSV file',
912
+ defaultMessage: 'Invalid file format: The file is not in CSV format and cannot be processed.'
913
+ },
914
+ tooManyFilesError: {
915
+ id: 'ImportResourcesModal.tooManyFilesError',
916
+ description: 'Error message displayed when a user drags and drops multiple files at once',
917
+ defaultMessage: 'Multiple files detected: You can only drag and drop one file at a time.'
918
+ },
919
+ genericError: {
920
+ id: 'ImportResourcesModal.genericError',
921
+ description: 'Default error message for unexpected file upload issues (for unhandled cases)',
922
+ defaultMessage: 'Error occurred: Please try uploading the file again or contact our support team for assistance.'
923
+ }
924
+ });
925
+
926
+ function ownKeys$a(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
927
+ function _objectSpread$a(e) { for (var r = 1; r < arguments.length; r++) { var _context3, _context4; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context3 = ownKeys$a(Object(t), !0)).call(_context3, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context4 = ownKeys$a(Object(t))).call(_context4, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
928
+ const FileDropArea = () => {
929
+ const intl = reactIntl.useIntl();
930
+ const _useImportResourcesCo = useImportResourcesContext(),
931
+ state = _useImportResourcesCo.state,
932
+ actions = _useImportResourcesCo.actions;
933
+ const isResourceTypeSelected = Boolean(state.resourceType);
934
+ const showNotification = actionsGlobal.useShowNotification();
935
+ const onDrop = React__default["default"].useCallback(_ref => {
936
+ let _ref2 = _slicedToArray(_ref, 1),
937
+ file = _ref2[0];
938
+ if (!file) return;
939
+ assertResourceType(state.resourceType);
940
+ actions.setDroppedFile(file);
941
+ }, [state.resourceType]);
942
+ const _useDropzone = reactDropzone.useDropzone({
943
+ onDrop,
944
+ multiple: false,
945
+ disabled: !isResourceTypeSelected,
946
+ accept: {
947
+ 'text/csv': ['.csv']
948
+ },
949
+ onDropRejected: _ref3 => {
950
+ var _context, _context2;
951
+ let _ref4 = _slicedToArray(_ref3, 1),
952
+ rejectedFile = _ref4[0];
953
+ if (_someInstanceProperty__default["default"](_context = rejectedFile.errors).call(_context, error => error.code === 'too-many-files')) {
954
+ showNotification({
955
+ kind: 'error',
956
+ domain: constants.DOMAINS.PAGE,
957
+ text: intl.formatMessage(messages$2.tooManyFilesError)
958
+ });
959
+ return;
960
+ }
961
+ if (_someInstanceProperty__default["default"](_context2 = rejectedFile.errors).call(_context2, error => error.code === 'file-invalid-type')) {
962
+ showNotification({
963
+ kind: 'error',
964
+ domain: constants.DOMAINS.PAGE,
965
+ text: intl.formatMessage(messages$2.fileFormatNotSupported)
966
+ });
967
+ } else {
968
+ showNotification({
969
+ kind: 'error',
970
+ domain: constants.DOMAINS.PAGE,
971
+ text: intl.formatMessage(messages$2.genericError)
972
+ });
973
+ }
974
+ }
975
+ }),
976
+ getRootProps = _useDropzone.getRootProps,
977
+ getInputProps = _useDropzone.getInputProps,
978
+ isDragActive = _useDropzone.isDragActive;
979
+ const dropAreaState = React__default["default"].useMemo(() => getDropAreaState({
980
+ isReady: Boolean(state.droppedFile),
981
+ hasResourceType: !state.resourceType,
982
+ isDragActive
983
+ }), [state.resourceType, state.droppedFile, isDragActive]);
984
+ const dropArea = getDropArea({
985
+ dropAreaState,
986
+ resourceType: 'category',
987
+ isFileDropped: Boolean(state.droppedFile)
988
+ });
989
+ return jsxRuntime.jsxs(DropWrapper, _objectSpread$a(_objectSpread$a({
990
+ role: "presentation"
991
+ }, getRootProps()), {}, {
992
+ dropAreaState: dropAreaState,
993
+ children: [jsxRuntime.jsx("input", _objectSpread$a({
994
+ "data-testid": "file-input"
995
+ }, getInputProps())), jsxRuntime.jsx(uiKit.Constraints.Horizontal, {
996
+ children: dropArea
997
+ })]
998
+ }));
999
+ };
1000
+
1001
+ var sharedMessages = reactIntl.defineMessages({
1002
+ modalTitle: {
1003
+ id: 'ImportResourcesModal.modalTitle',
1004
+ description: 'Label for the modal title',
1005
+ defaultMessage: 'Import {resourceType} by CSV'
1006
+ },
1007
+ uploadButton: {
1008
+ id: 'ImportResourcesModal.uploadButton',
1009
+ description: 'Label for the upload button',
1010
+ defaultMessage: 'Upload and preview'
1011
+ },
1012
+ cancel: {
1013
+ id: 'ImportResourcesModal.cancel',
1014
+ description: 'Label for the cancel button',
1015
+ defaultMessage: 'Cancel'
1016
+ },
1017
+ close: {
1018
+ id: 'ImportResourcesModal.close',
1019
+ description: 'Label for the close button',
1020
+ defaultMessage: 'Close'
1021
+ }
1022
+ });
1023
+
1024
+ function ownKeys$9(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
1025
+ function _objectSpread$9(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context = ownKeys$9(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context2 = ownKeys$9(Object(t))).call(_context2, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
1026
+ const Upload = () => {
1027
+ const _useImportResourcesCo = useImportResourcesContext(),
1028
+ state = _useImportResourcesCo.state,
1029
+ onClose = _useImportResourcesCo.onClose;
1030
+ const intl = reactIntl.useIntl();
1031
+ const resourceTypePlural = resourceTypeToDisplayName({
1032
+ resourceType: state.resourceType,
1033
+ isPlural: true
1034
+ });
1035
+ const _useUpload = useUpload(),
1036
+ handleUploadAndValidation = _useUpload.handleUploadAndValidation;
1037
+ const templateLink = RESOURCE_TYPE_TEMPLATE_DOWNLOAD_LINKS[state.resourceType];
1038
+ const documentationLink = RESOURCE_TYPE_DOCUMENTATION_LINKS[state.resourceType];
1039
+ return jsxRuntime.jsx(applicationComponents.FormDialog, {
1040
+ size: 16,
1041
+ isOpen: true,
1042
+ title: intl.formatMessage(sharedMessages.modalTitle, {
1043
+ resourceType: resourceTypePlural
1044
+ }),
1045
+ labelPrimary: intl.formatMessage(sharedMessages.uploadButton),
1046
+ onPrimaryButtonClick: handleUploadAndValidation,
1047
+ isPrimaryButtonDisabled: !Boolean(state.droppedFile),
1048
+ onSecondaryButtonClick: () => onClose({
1049
+ shouldDeleteImportContainer: true
1050
+ }),
1051
+ onClose: () => onClose({
1052
+ shouldDeleteImportContainer: true
1053
+ }),
1054
+ children: jsxRuntime.jsxs(uiKit.Spacings.Stack, {
1055
+ scale: "l",
1056
+ children: [jsxRuntime.jsx(uiKit.Text.Body, {
1057
+ intlMessage: _objectSpread$9(_objectSpread$9({}, messages$2.modalDescription), {}, {
1058
+ values: {
1059
+ fileSize: intl.formatNumber(FILE_SIZE_LIMITS_MB[state.resourceType]),
1060
+ rowLimit: intl.formatNumber(ROW_LIMITS[state.resourceType]),
1061
+ csvTemplateLink: msg => jsxRuntime.jsx(uiKit.Link, {
1062
+ tone: "secondary",
1063
+ isExternal: true,
1064
+ to: templateLink,
1065
+ children: msg
1066
+ }),
1067
+ documentationLink: msg => jsxRuntime.jsx(uiKit.Link, {
1068
+ tone: "secondary",
1069
+ isExternal: true,
1070
+ to: documentationLink,
1071
+ children: msg
1072
+ })
1073
+ }
1074
+ })
1075
+ }), jsxRuntime.jsx(FileDropArea, {})]
1076
+ })
1077
+ });
1078
+ };
1079
+
1080
+ var messages$1 = reactIntl.defineMessages({
1081
+ startImportButton: {
1082
+ id: 'ImportResourcesModal.startImportButton',
1083
+ description: 'Label for the modal Start import button',
1084
+ defaultMessage: 'Start import'
1085
+ },
1086
+ BodyText: {
1087
+ id: 'ImportResourcesModal.BodyText',
1088
+ description: 'Confirmation dialog text',
1089
+ defaultMessage: 'You are about to import <bold>{count}</bold> rows to the project: <bold>{projectName}</bold>.'
1090
+ },
1091
+ BodyNote: {
1092
+ id: 'ImportResourcesModal.BodyNote',
1093
+ description: 'Confirmation dialog text',
1094
+ defaultMessage: 'Please be aware that existing values with the same keys will be overwritten by the data included in the CSV.'
1095
+ },
1096
+ BodyQuestion: {
1097
+ id: 'ImportResourcesModal.BodyQuestion',
1098
+ description: 'Confirmation question',
1099
+ defaultMessage: 'Proceed with the import?'
1100
+ },
1101
+ uploadNotificationSuccessMessage: {
1102
+ id: 'ImportResourcesModal.successMessage',
1103
+ description: 'Notification success message',
1104
+ defaultMessage: '<b>Your import has started.</b><newline></newline> <logsLink>Go to Import logs</logsLink> to view the progress.'
1105
+ },
1106
+ previewOfYourImport: {
1107
+ id: 'ImportResourcesModal.previewOfYourImport',
1108
+ description: 'Label for modal path',
1109
+ defaultMessage: "Here's a preview of your import"
1110
+ },
1111
+ rowsToBeImported: {
1112
+ id: 'ImportResourcesModal.rowsToBeImported',
1113
+ description: 'This message indicates the number of rows that are ready to be imported into the system.',
1114
+ defaultMessage: '<b>{rowCount}</b> rows to be imported'
1115
+ },
1116
+ columnsToBeImported: {
1117
+ id: 'ImportResourcesModal.columnsToBeImported',
1118
+ description: 'This message indicates the number of columns that are ready to be imported into the system.',
1119
+ defaultMessage: '<b>{columnCount}</b> columns to be imported'
1120
+ },
1121
+ columnsToBeIgnored: {
1122
+ id: 'ImportResourcesModal.columnsToBeIgnored',
1123
+ description: "This message indicates the number of columns that will be deliberately skipped during the import because they can't be imported",
1124
+ defaultMessage: "We will intentionally ignore <b>{columnCount}</b> columns as they can't be imported"
1125
+ },
1126
+ showMore: {
1127
+ id: 'ImportResourcesModal.showMore',
1128
+ description: 'A button label for expanding the import preview to show more details.',
1129
+ defaultMessage: 'Show more'
1130
+ },
1131
+ showLess: {
1132
+ id: 'ImportResourcesModal.showLess',
1133
+ description: 'A button label for collapsing the import preview to show fewer details.',
1134
+ defaultMessage: 'Show less'
1135
+ },
1136
+ continue: {
1137
+ id: 'ImportResourcesModal.continue',
1138
+ description: 'Confirmation dialog continue button',
1139
+ defaultMessage: 'Continue'
1140
+ },
1141
+ confirmationBodyText: {
1142
+ id: 'ImportResourcesModal.confirmationBodyText',
1143
+ description: 'Confirmation dialog text',
1144
+ defaultMessage: 'You are about to import <bold>{count}</bold> rows to the project: <bold>{projectName}</bold>.'
1145
+ },
1146
+ confirmationBodyNote: {
1147
+ id: 'ImportResourcesModal.confirmationBodyNote',
1148
+ description: 'Confirmation dialog text',
1149
+ defaultMessage: 'Please be aware that existing values with the same keys will be overwritten by the data included in the CSV.'
1150
+ },
1151
+ confirmationBodyQuestion: {
1152
+ id: 'ImportResourcesModal.confirmationBodyQuestion',
1153
+ description: 'Confirmation question',
1154
+ defaultMessage: 'Proceed with the import?'
1155
+ }
1156
+ });
1157
+
1158
+ function ownKeys$8(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
1159
+ function _objectSpread$8(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context = ownKeys$8(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context2 = ownKeys$8(Object(t))).call(_context2, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
1160
+ const truncate = (isExpanded, columns, columnsCount) => {
1161
+ return isExpanded ? columns.join(' | ') : _sliceInstanceProperty__default["default"](columns).call(columns, 0, columnsCount).join(' | ') + (columns.length > columnsCount ? '...' : '');
1162
+ };
1163
+ const SpacedLink = /*#__PURE__*/_styled__default["default"]("span", {
1164
+ target: "e1amawj90"
1165
+ } )("margin-left:", uiKit.customProperties.spacingS, ";" + ("" ));
1166
+ const ColumnList = props => {
1167
+ const _React$useState = React__default["default"].useState(false),
1168
+ _React$useState2 = _slicedToArray(_React$useState, 2),
1169
+ isExpanded = _React$useState2[0],
1170
+ setIsExpanded = _React$useState2[1];
1171
+ const shouldShowExpandButton = props.columns.length > INITIAL_COLUMN_DISPLAY_COUNT;
1172
+ return jsxRuntime.jsxs(uiKit.Spacings.Inline, {
1173
+ scale: "xl",
1174
+ children: [jsxRuntime.jsx("div", {}), jsxRuntime.jsx(jsxRuntime.Fragment, {
1175
+ children: jsxRuntime.jsxs(uiKit.Text.Body, {
1176
+ tone: "secondary",
1177
+ children: [truncate(isExpanded, props.columns, INITIAL_COLUMN_DISPLAY_COUNT), shouldShowExpandButton && jsxRuntime.jsx(SpacedLink, {
1178
+ children: jsxRuntime.jsx(uiKit.Link, {
1179
+ to: "",
1180
+ tone: "secondary",
1181
+ onClick: e => {
1182
+ e.preventDefault();
1183
+ setIsExpanded(!isExpanded);
1184
+ },
1185
+ children: isExpanded ? jsxRuntime.jsx(reactIntl.FormattedMessage, _objectSpread$8({}, messages$1.showLess)) : jsxRuntime.jsx(reactIntl.FormattedMessage, _objectSpread$8({}, messages$1.showMore))
1186
+ })
1187
+ })]
1188
+ })
1189
+ })]
1190
+ });
1191
+ };
1192
+
1193
+ function ownKeys$7(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
1194
+ function _objectSpread$7(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context = ownKeys$7(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context2 = ownKeys$7(Object(t))).call(_context2, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
1195
+ function UploadPreviewModal() {
1196
+ const _useImportResourcesCo = useImportResourcesContext(),
1197
+ state = _useImportResourcesCo.state;
1198
+ const intl = reactIntl.useIntl();
1199
+ const _useImportResourcesCo2 = useImportResourcesContext(),
1200
+ actions = _useImportResourcesCo2.actions,
1201
+ onClose = _useImportResourcesCo2.onClose;
1202
+ if (!state.resourceType || !state.uploadFileResponse) return null;
1203
+ const ignoredColumns = state.uploadFileResponse.ignoredColumns;
1204
+ const validatedColumns = getValidatedColumns(state.uploadFileResponse.columns, ignoredColumns);
1205
+ return jsxRuntime.jsx(applicationComponents.FormDialog, {
1206
+ size: 16,
1207
+ isOpen: true,
1208
+ title: intl.formatMessage(sharedMessages.modalTitle, {
1209
+ resourceType: state.resourceType
1210
+ }),
1211
+ labelPrimary: intl.formatMessage(messages$1.continue),
1212
+ onSecondaryButtonClick: () => onClose({
1213
+ shouldDeleteImportContainer: true
1214
+ }),
1215
+ onPrimaryButtonClick: () => {
1216
+ actions.setCurrentStep(4);
1217
+ },
1218
+ onClose: () => onClose({
1219
+ shouldDeleteImportContainer: true
1220
+ }),
1221
+ children: jsxRuntime.jsx(applicationComponents.PageContentNarrow, {
1222
+ children: jsxRuntime.jsx(uiKit.Spacings.Stack, {
1223
+ scale: "xxxl",
1224
+ children: jsxRuntime.jsx(uiKit.Spacings.Stack, {
1225
+ scale: "xl",
1226
+ children: jsxRuntime.jsxs(uiKit.Spacings.Stack, {
1227
+ scale: "m",
1228
+ children: [jsxRuntime.jsx("div", {}), jsxRuntime.jsx(uiKit.Text.Body, {
1229
+ intlMessage: messages$1.previewOfYourImport
1230
+ }), jsxRuntime.jsx(uiKit.Card, {
1231
+ insetScale: "xl",
1232
+ children: jsxRuntime.jsxs(uiKit.Spacings.Stack, {
1233
+ scale: "xs",
1234
+ children: [jsxRuntime.jsxs(uiKit.Spacings.Inline, {
1235
+ alignItems: "center",
1236
+ children: [jsxRuntime.jsx(uiKit.CheckBoldIcon, {
1237
+ color: "success"
1238
+ }), jsxRuntime.jsx(uiKit.Text.Body, {
1239
+ intlMessage: _objectSpread$7(_objectSpread$7({}, messages$1.rowsToBeImported), {}, {
1240
+ values: {
1241
+ rowCount: intl.formatNumber(state.uploadFileResponse.rowsCount),
1242
+ b: getBold$3
1243
+ }
1244
+ })
1245
+ })]
1246
+ }), jsxRuntime.jsxs(uiKit.Spacings.Inline, {
1247
+ alignItems: "center",
1248
+ children: [jsxRuntime.jsx(uiKit.CheckBoldIcon, {
1249
+ color: "success"
1250
+ }), jsxRuntime.jsx(uiKit.Text.Body, {
1251
+ intlMessage: _objectSpread$7(_objectSpread$7({}, messages$1.columnsToBeImported), {}, {
1252
+ values: {
1253
+ columnCount: intl.formatNumber(validatedColumns.length),
1254
+ b: getBold$3
1255
+ }
1256
+ })
1257
+ })]
1258
+ }), jsxRuntime.jsx(ColumnList, {
1259
+ columns: validatedColumns
1260
+ })]
1261
+ })
1262
+ }), ignoredColumns.length > 0 && jsxRuntime.jsx(uiKit.Card, {
1263
+ insetScale: "xl",
1264
+ children: jsxRuntime.jsxs(uiKit.Spacings.Stack, {
1265
+ scale: "xs",
1266
+ children: [jsxRuntime.jsxs(uiKit.Spacings.Inline, {
1267
+ alignItems: "center",
1268
+ children: [jsxRuntime.jsx(uiKit.EyeCrossedIcon, {
1269
+ color: "neutral60"
1270
+ }), jsxRuntime.jsx(uiKit.Text.Body, {
1271
+ intlMessage: _objectSpread$7(_objectSpread$7({}, messages$1.columnsToBeIgnored), {}, {
1272
+ values: {
1273
+ columnCount: intl.formatNumber(ignoredColumns.length),
1274
+ b: getBold$3
1275
+ }
1276
+ })
1277
+ })]
1278
+ }), jsxRuntime.jsx(ColumnList, {
1279
+ columns: ignoredColumns
1280
+ })]
1281
+ })
1282
+ })]
1283
+ })
1284
+ })
1285
+ })
1286
+ })
1287
+ });
1288
+ }
1289
+ function getBold$3(msg) {
1290
+ return jsxRuntime.jsx(uiKit.Text.Body, {
1291
+ as: "span",
1292
+ isBold: true,
1293
+ children: msg
1294
+ });
1295
+ }
1296
+
1297
+ function ownKeys$6(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
1298
+ function _objectSpread$6(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context = ownKeys$6(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context2 = ownKeys$6(Object(t))).call(_context2, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
1299
+ const getNewLine = () => jsxRuntime.jsx("br", {});
1300
+ const getImportLogsLink = (msg, projectKey) => jsxRuntime.jsx(uiKit.Link, {
1301
+ to: "/".concat(projectKey, "/operations/import/logs"),
1302
+ children: msg
1303
+ });
1304
+ const ImportConfirmationModal = () => {
1305
+ var _state$uploadFileResp;
1306
+ const intl = reactIntl.useIntl();
1307
+ const _useImportResourcesCo = useImportResourcesContext(),
1308
+ state = _useImportResourcesCo.state,
1309
+ onStartImportSuccess = _useImportResourcesCo.onStartImportSuccess,
1310
+ onClose = _useImportResourcesCo.onClose;
1311
+ const _useApplicationContex = applicationShellConnectors.useApplicationContext(context => {
1312
+ var _context$project, _context$project2;
1313
+ return {
1314
+ projectKey: (_context$project = context.project) === null || _context$project === void 0 ? void 0 : _context$project.key,
1315
+ projectName: (_context$project2 = context.project) === null || _context$project2 === void 0 ? void 0 : _context$project2.name
1316
+ };
1317
+ }),
1318
+ projectKey = _useApplicationContex.projectKey,
1319
+ projectName = _useApplicationContex.projectName;
1320
+ const asyncDispatch = sdk.useAsyncDispatch();
1321
+ const showNotification = actionsGlobal.useShowNotification();
1322
+ const ImportRunningTextNotification = () => jsxRuntime.jsx(uiKit.Text.Body, {
1323
+ intlMessage: _objectSpread$6(_objectSpread$6({}, messages$1.uploadNotificationSuccessMessage), {}, {
1324
+ values: {
1325
+ newline: getNewLine,
1326
+ logsLink: msg => getImportLogsLink(msg, projectKey),
1327
+ b: getBold$2
1328
+ }
1329
+ })
1330
+ });
1331
+ return jsxRuntime.jsx(applicationComponents.ConfirmationDialog, {
1332
+ title: intl.formatMessage(sharedMessages.modalTitle, {
1333
+ resourceType: resourceTypeToDisplayName({
1334
+ resourceType: state.resourceType,
1335
+ isPlural: true
1336
+ })
1337
+ }),
1338
+ labelPrimary: intl.formatMessage(messages$1.startImportButton),
1339
+ isOpen: true,
1340
+ onClose: () => onClose({
1341
+ shouldDeleteImportContainer: true
1342
+ }),
1343
+ onCancel: () => onClose({
1344
+ shouldDeleteImportContainer: true
1345
+ }),
1346
+ dataAttributesPrimaryButton: {
1347
+ 'data-test-id': 'confirmation-dialog-confirm'
1348
+ },
1349
+ dataAttributesSecondaryButton: {
1350
+ 'data-test-id': 'confirmation-dialog-cancel'
1351
+ },
1352
+ onConfirm: async () => {
1353
+ try {
1354
+ var _state$droppedFile;
1355
+ const canConfirm = projectKey && state.containerKey && ((_state$droppedFile = state.droppedFile) === null || _state$droppedFile === void 0 ? void 0 : _state$droppedFile.name) && state.resourceType;
1356
+ if (!canConfirm) return;
1357
+ onClose();
1358
+ await processUploadedFile({
1359
+ projectKey,
1360
+ containerKey: state.containerKey,
1361
+ resourceType: state.resourceType,
1362
+ asyncDispatch
1363
+ });
1364
+ onStartImportSuccess();
1365
+ showNotification({
1366
+ kind: 'info',
1367
+ domain: constants.DOMAINS.SIDE,
1368
+ // @ts-ignore
1369
+ text: jsxRuntime.jsx(ImportRunningTextNotification, {})
1370
+ }, {
1371
+ dismissAfter: 5000
1372
+ });
1373
+ } catch (error) {
1374
+ onClose({
1375
+ shouldDeleteImportContainer: true
1376
+ });
1377
+ showNotification({
1378
+ kind: 'error',
1379
+ domain: constants.DOMAINS.PAGE,
1380
+ text: isError(error) ? error.toString() : String(error)
1381
+ });
1382
+ }
1383
+ },
1384
+ size: 16,
1385
+ children: jsxRuntime.jsxs(uiKit.Spacings.Stack, {
1386
+ scale: "xl",
1387
+ children: [jsxRuntime.jsxs("div", {
1388
+ children: [jsxRuntime.jsx(uiKit.Text.Body, {
1389
+ intlMessage: _objectSpread$6(_objectSpread$6({}, messages$1.confirmationBodyText), {}, {
1390
+ values: {
1391
+ projectName: projectName,
1392
+ count: intl.formatNumber((state === null || state === void 0 || (_state$uploadFileResp = state.uploadFileResponse) === null || _state$uploadFileResp === void 0 ? void 0 : _state$uploadFileResp.rowsCount) || 0),
1393
+ bold: getBold$2
1394
+ }
1395
+ })
1396
+ }), jsxRuntime.jsx(uiKit.Text.Body, {
1397
+ intlMessage: messages$1.confirmationBodyNote
1398
+ })]
1399
+ }), jsxRuntime.jsx(uiKit.Text.Body, {
1400
+ intlMessage: messages$1.confirmationBodyQuestion
1401
+ })]
1402
+ })
1403
+ });
1404
+ };
1405
+ function getBold$2(msg) {
1406
+ return jsxRuntime.jsx(uiKit.Text.Body, {
1407
+ as: "span",
1408
+ isBold: true,
1409
+ children: msg
1410
+ });
1411
+ }
1412
+
1413
+ var messages = reactIntl.defineMessages({
1414
+ row: {
1415
+ id: 'ImportResourcesModal.row',
1416
+ description: 'In Upload file error modal - "Row" column',
1417
+ defaultMessage: 'Row'
1418
+ },
1419
+ errorType: {
1420
+ id: 'ImportResourcesModal.errorType',
1421
+ description: 'In Upload file error modal - "Error type" column',
1422
+ defaultMessage: 'Error type'
1423
+ },
1424
+ details: {
1425
+ id: 'ImportResourcesModal.details',
1426
+ description: 'In Upload file error modal - "Details" column',
1427
+ defaultMessage: 'Details'
1428
+ },
1429
+ uploadingError: {
1430
+ id: 'ImportResourcesModal.uploadingError',
1431
+ description: 'Title when errors detected while uploading file',
1432
+ defaultMessage: 'There are <b>{errorsCount}</b> errors detected while uploading the file <b>{fileName}</b>.'
1433
+ },
1434
+ supportedValuesDocumentation: {
1435
+ id: 'ImportResourcesModal.supportedValuesDocumentation',
1436
+ description: 'Link to the documentation for supported values',
1437
+ defaultMessage: '<documentationLink>View the documentation</documentationLink> for supported values.'
1438
+ },
1439
+ uploadNewFile: {
1440
+ id: 'ImportResourcesModal.uploadNewFile',
1441
+ description: 'Upload new file button',
1442
+ defaultMessage: 'Upload new file'
1443
+ }
1444
+ });
1445
+
1446
+ function ownKeys$5(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
1447
+ function _objectSpread$5(e) { for (var r = 1; r < arguments.length; r++) { var _context2, _context3; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context2 = ownKeys$5(Object(t), !0)).call(_context2, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context3 = ownKeys$5(Object(t))).call(_context3, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
1448
+ const getColumns$1 = () => [{
1449
+ key: 'errorType',
1450
+ label: jsxRuntime.jsx(reactIntl.FormattedMessage, _objectSpread$5({}, messages.errorType)),
1451
+ width: 'max-content'
1452
+ }, {
1453
+ key: 'details',
1454
+ label: jsxRuntime.jsx(reactIntl.FormattedMessage, _objectSpread$5({}, messages.details))
1455
+ }];
1456
+ const UploadClientSideErrorTable = props => {
1457
+ var _context;
1458
+ const pagination = uiKit.usePaginationState({
1459
+ perPage: 10
1460
+ });
1461
+ const startIndex = (pagination.page.value - 1) * pagination.perPage.value;
1462
+ const endIndex = startIndex + pagination.perPage.value;
1463
+ const currentPageRows = _sliceInstanceProperty__default["default"](_context = props.rows).call(_context, startIndex, endIndex);
1464
+ const shouldShowPagination = props.rows.length > pagination.perPage.value;
1465
+ return jsxRuntime.jsxs(uiKit.Spacings.Stack, {
1466
+ scale: "l",
1467
+ children: [jsxRuntime.jsx(DataTable__default["default"], {
1468
+ verticalCellAlignment: "center",
1469
+ isCondensed: true,
1470
+ rows: currentPageRows,
1471
+ columns: getColumns$1(),
1472
+ itemRenderer: itemRenderer$1
1473
+ }), shouldShowPagination && jsxRuntime.jsx(uiKit.PageNavigator, {
1474
+ onPageChange: pagination.page.onChange,
1475
+ page: pagination.page.value,
1476
+ totalPages: Math.ceil(props.rows.length / pagination.perPage.value)
1477
+ })]
1478
+ });
1479
+ };
1480
+ function itemRenderer$1(item, column) {
1481
+ switch (column.key) {
1482
+ case 'errorType':
1483
+ return jsxRuntime.jsx(uiKit.Stamp, {
1484
+ isCondensed: true,
1485
+ label: item.title,
1486
+ tone: "critical"
1487
+ });
1488
+ case 'details':
1489
+ return jsxRuntime.jsx(uiKit.Text.Body, {
1490
+ children: item.description
1491
+ });
1492
+ default:
1493
+ throw new UnexpectedColumnError(column.key);
1494
+ }
1495
+ }
1496
+
1497
+ function ownKeys$4(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
1498
+ function _objectSpread$4(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context = ownKeys$4(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context2 = ownKeys$4(Object(t))).call(_context2, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
1499
+ const UploadClientSideErrorsModal = () => {
1500
+ var _state$droppedFile;
1501
+ const intl = reactIntl.useIntl();
1502
+ const _useImportResourcesCo = useImportResourcesContext(),
1503
+ state = _useImportResourcesCo.state,
1504
+ actions = _useImportResourcesCo.actions,
1505
+ onClose = _useImportResourcesCo.onClose;
1506
+ const errorsCount = state.fileUploadClientSideErrors.length;
1507
+ return jsxRuntime.jsx(applicationComponents.InfoDialog, {
1508
+ size: 16,
1509
+ isOpen: true,
1510
+ title: intl.formatMessage(sharedMessages.modalTitle, {
1511
+ resourceType: resourceTypeToDisplayName({
1512
+ resourceType: state.resourceType,
1513
+ isPlural: true
1514
+ })
1515
+ }),
1516
+ onClose: () => onClose(),
1517
+ children: jsxRuntime.jsxs(uiKit.Spacings.Stack, {
1518
+ scale: "l",
1519
+ children: [jsxRuntime.jsx(uiKit.Text.Body, {
1520
+ intlMessage: _objectSpread$4(_objectSpread$4({}, messages.uploadingError), {}, {
1521
+ values: {
1522
+ fileName: (_state$droppedFile = state.droppedFile) === null || _state$droppedFile === void 0 ? void 0 : _state$droppedFile.name,
1523
+ errorsCount: intl.formatNumber(errorsCount),
1524
+ b: getBold$1
1525
+ }
1526
+ })
1527
+ }), jsxRuntime.jsx(UploadClientSideErrorTable, {
1528
+ rows: mapUploadFileClientSideErrorsToUploadFileErrorRows(state.fileUploadClientSideErrors)
1529
+ }), jsxRuntime.jsxs(uiKit.Spacings.Inline, {
1530
+ scale: "m",
1531
+ justifyContent: "flex-end",
1532
+ children: [jsxRuntime.jsx(uiKit.SecondaryButton, {
1533
+ label: intl.formatMessage(sharedMessages.close),
1534
+ onClick: () => onClose()
1535
+ }), jsxRuntime.jsx(uiKit.PrimaryButton, {
1536
+ iconLeft: jsxRuntime.jsx(uiKit.ImportIcon, {}),
1537
+ label: intl.formatMessage(messages.uploadNewFile),
1538
+ onClick: () => actions.uploadNewFile()
1539
+ })]
1540
+ })]
1541
+ })
1542
+ });
1543
+ };
1544
+ function getBold$1(msg) {
1545
+ return jsxRuntime.jsx(uiKit.Text.Body, {
1546
+ as: "span",
1547
+ isBold: true,
1548
+ children: msg
1549
+ });
1550
+ }
1551
+
1552
+ function ownKeys$3(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
1553
+ function _objectSpread$3(e) { for (var r = 1; r < arguments.length; r++) { var _context2, _context3; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context2 = ownKeys$3(Object(t), !0)).call(_context2, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context3 = ownKeys$3(Object(t))).call(_context3, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
1554
+ const getColumns = () => [{
1555
+ key: 'row',
1556
+ label: jsxRuntime.jsx(reactIntl.FormattedMessage, _objectSpread$3({}, messages.row)),
1557
+ width: 'max-content'
1558
+ }, {
1559
+ key: 'errorType',
1560
+ label: jsxRuntime.jsx(reactIntl.FormattedMessage, _objectSpread$3({}, messages.errorType)),
1561
+ width: 'max-content'
1562
+ }, {
1563
+ key: 'details',
1564
+ label: jsxRuntime.jsx(reactIntl.FormattedMessage, _objectSpread$3({}, messages.details))
1565
+ }];
1566
+ const UploadServerSideErrorTable = props => {
1567
+ var _context;
1568
+ const pagination = uiKit.usePaginationState({
1569
+ perPage: 10
1570
+ });
1571
+ const startIndex = (pagination.page.value - 1) * pagination.perPage.value;
1572
+ const endIndex = startIndex + pagination.perPage.value;
1573
+ const currentPageRows = _sliceInstanceProperty__default["default"](_context = props.rows).call(_context, startIndex, endIndex);
1574
+ const shouldShowPagination = props.rows.length > pagination.perPage.value;
1575
+ return jsxRuntime.jsxs(uiKit.Spacings.Stack, {
1576
+ scale: "l",
1577
+ children: [jsxRuntime.jsx(DataTable__default["default"], {
1578
+ verticalCellAlignment: "center",
1579
+ isCondensed: true,
1580
+ rows: currentPageRows,
1581
+ columns: getColumns(),
1582
+ itemRenderer: itemRenderer
1583
+ }), shouldShowPagination && jsxRuntime.jsx(uiKit.PageNavigator, {
1584
+ onPageChange: pagination.page.onChange,
1585
+ page: pagination.page.value,
1586
+ totalPages: Math.ceil(props.rows.length / pagination.perPage.value)
1587
+ })]
1588
+ });
1589
+ };
1590
+ function itemRenderer(item, column) {
1591
+ switch (column.key) {
1592
+ case 'row':
1593
+ return item.row;
1594
+ case 'errorType':
1595
+ return jsxRuntime.jsx(uiKit.Stamp, {
1596
+ isCondensed: true,
1597
+ label: item.code,
1598
+ tone: "critical"
1599
+ });
1600
+ case 'details':
1601
+ return jsxRuntime.jsxs(uiKit.Spacings.Inline, {
1602
+ scale: "xs",
1603
+ children: [jsxRuntime.jsx(uiKit.Text.Body, {
1604
+ tone: "information",
1605
+ children: item.field
1606
+ }), jsxRuntime.jsx(uiKit.Text.Body, {
1607
+ children: extractErrorDescriptionFromValidationMessage(item.validationMessage)
1608
+ })]
1609
+ });
1610
+ default:
1611
+ throw new UnexpectedColumnError(column.key);
1612
+ }
1613
+ }
1614
+
1615
+ function ownKeys$2(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
1616
+ function _objectSpread$2(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context = ownKeys$2(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context2 = ownKeys$2(Object(t))).call(_context2, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
1617
+ const UploadServerSideErrorsModal = () => {
1618
+ var _state$uploadFileResp, _state$droppedFile, _state$uploadFileResp2;
1619
+ const intl = reactIntl.useIntl();
1620
+ const _useImportResourcesCo = useImportResourcesContext(),
1621
+ state = _useImportResourcesCo.state,
1622
+ actions = _useImportResourcesCo.actions,
1623
+ onClose = _useImportResourcesCo.onClose;
1624
+ const errorsCount = getFileUploadErrorsCount((_state$uploadFileResp = state.uploadFileResponse) === null || _state$uploadFileResp === void 0 ? void 0 : _state$uploadFileResp.results);
1625
+ const documentationLink = RESOURCE_TYPE_DOCUMENTATION_LINKS[state.resourceType];
1626
+ return jsxRuntime.jsx(applicationComponents.InfoDialog, {
1627
+ size: 16,
1628
+ isOpen: true,
1629
+ title: intl.formatMessage(sharedMessages.modalTitle, {
1630
+ resourceType: resourceTypeToDisplayName({
1631
+ resourceType: state.resourceType,
1632
+ isPlural: true
1633
+ })
1634
+ }),
1635
+ onClose: onClose,
1636
+ children: jsxRuntime.jsxs(uiKit.Spacings.Stack, {
1637
+ scale: "l",
1638
+ children: [jsxRuntime.jsxs(uiKit.Spacings.Stack, {
1639
+ scale: "xs",
1640
+ children: [jsxRuntime.jsx(uiKit.Text.Body, {
1641
+ intlMessage: _objectSpread$2(_objectSpread$2({}, messages.uploadingError), {}, {
1642
+ values: {
1643
+ fileName: (_state$droppedFile = state.droppedFile) === null || _state$droppedFile === void 0 ? void 0 : _state$droppedFile.name,
1644
+ errorsCount: intl.formatNumber(errorsCount),
1645
+ b: getBold
1646
+ }
1647
+ })
1648
+ }), jsxRuntime.jsx(uiKit.Text.Body, {
1649
+ intlMessage: _objectSpread$2(_objectSpread$2({}, messages.supportedValuesDocumentation), {}, {
1650
+ values: {
1651
+ documentationLink: msg => jsxRuntime.jsx(uiKit.Link, {
1652
+ tone: "secondary",
1653
+ isExternal: true,
1654
+ to: documentationLink,
1655
+ children: msg
1656
+ })
1657
+ }
1658
+ })
1659
+ })]
1660
+ }), jsxRuntime.jsx(UploadServerSideErrorTable, {
1661
+ rows: mapUploadFileErrorsResponseToUploadFileErrorRows((_state$uploadFileResp2 = state.uploadFileResponse) === null || _state$uploadFileResp2 === void 0 ? void 0 : _state$uploadFileResp2.results)
1662
+ }), jsxRuntime.jsxs(uiKit.Spacings.Inline, {
1663
+ scale: "m",
1664
+ justifyContent: "flex-end",
1665
+ children: [jsxRuntime.jsx(uiKit.SecondaryButton, {
1666
+ label: intl.formatMessage(sharedMessages.close),
1667
+ onClick: () => onClose()
1668
+ }), jsxRuntime.jsx(uiKit.PrimaryButton, {
1669
+ iconLeft: jsxRuntime.jsx(uiKit.ImportIcon, {}),
1670
+ label: intl.formatMessage(messages.uploadNewFile),
1671
+ onClick: () => actions.uploadNewFile()
1672
+ })]
1673
+ })]
1674
+ })
1675
+ });
1676
+ };
1677
+ function getBold(msg) {
1678
+ return jsxRuntime.jsx(uiKit.Text.Body, {
1679
+ as: "span",
1680
+ isBold: true,
1681
+ children: msg
1682
+ });
1683
+ }
1684
+
1685
+ const UploadResult = () => {
1686
+ var _state$uploadFileResp;
1687
+ const _useImportResourcesCo = useImportResourcesContext(),
1688
+ state = _useImportResourcesCo.state;
1689
+ if (state.fileUploadClientSideErrors.length > 0) return jsxRuntime.jsx(UploadClientSideErrorsModal, {});
1690
+ if (((_state$uploadFileResp = state.uploadFileResponse) === null || _state$uploadFileResp === void 0 ? void 0 : _state$uploadFileResp.invalid) > 0) return jsxRuntime.jsx(UploadServerSideErrorsModal, {});
1691
+ return jsxRuntime.jsx(UploadPreviewModal, {});
1692
+ };
1693
+
1694
+ function ownKeys$1(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
1695
+ function _objectSpread$1(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context = ownKeys$1(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context2 = ownKeys$1(Object(t))).call(_context2, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
1696
+ var FileIcon = function FileIcon(props) {
1697
+ return jsxRuntime.jsxs("svg", _objectSpread$1(_objectSpread$1({}, props), {}, {
1698
+ children: [jsxRuntime.jsx("mask", {
1699
+ id: "a",
1700
+ style: {
1701
+ maskType: "alpha"
1702
+ },
1703
+ maskUnits: "userSpaceOnUse",
1704
+ x: "0",
1705
+ y: "0",
1706
+ width: "32",
1707
+ height: "32",
1708
+ children: jsxRuntime.jsx("path", {
1709
+ fill: "#D9D9D9",
1710
+ d: "M0 0h32v32H0z"
1711
+ })
1712
+ }), jsxRuntime.jsx("g", {
1713
+ mask: "url(#a)",
1714
+ children: jsxRuntime.jsx("path", {
1715
+ d: "M14.667 25.333h2.666v-5.566l2.134 2.133 1.866-1.9L16 14.667 10.667 20l1.9 1.867 2.1-2.1v5.566Zm-6.667 4a2.568 2.568 0 0 1-1.883-.783 2.568 2.568 0 0 1-.784-1.883V5.333c0-.733.261-1.36.784-1.883A2.568 2.568 0 0 1 8 2.667h10.667l8 8v16c0 .733-.261 1.36-.784 1.883a2.568 2.568 0 0 1-1.883.783H8ZM17.333 12H24l-6.667-6.667V12Z",
1716
+ fill: "#B1ACFF"
1717
+ })
1718
+ })]
1719
+ }));
1720
+ };
1721
+ FileIcon.defaultProps = {
1722
+ width: "32",
1723
+ height: "32",
1724
+ fill: "none",
1725
+ xmlns: "http://www.w3.org/2000/svg"
1726
+ };
1727
+ const Uploading = () => {
1728
+ var _state$droppedFile;
1729
+ const intl = reactIntl.useIntl();
1730
+ const _useImportResourcesCo = useImportResourcesContext(),
1731
+ state = _useImportResourcesCo.state,
1732
+ onClose = _useImportResourcesCo.onClose;
1733
+ const resourceTypePlural = resourceTypeToDisplayName({
1734
+ resourceType: state.resourceType,
1735
+ isPlural: true
1736
+ });
1737
+ if ((_state$droppedFile = state.droppedFile) !== null && _state$droppedFile !== void 0 && _state$droppedFile.name) return jsxRuntime.jsx(applicationComponents.InfoDialog, {
1738
+ size: 16,
1739
+ isOpen: true,
1740
+ title: intl.formatMessage(sharedMessages.modalTitle, {
1741
+ resourceType: resourceTypePlural
1742
+ }),
1743
+ onClose: () => onClose({
1744
+ shouldDeleteImportContainer: true
1745
+ }),
1746
+ children: jsxRuntime.jsxs(uiKit.Spacings.Stack, {
1747
+ scale: "m",
1748
+ children: [jsxRuntime.jsxs(uiKit.Spacings.Inline, {
1749
+ alignItems: "center",
1750
+ justifyContent: "space-between",
1751
+ children: [jsxRuntime.jsxs(uiKit.Spacings.Inline, {
1752
+ alignItems: "center",
1753
+ children: [jsxRuntime.jsx(FileIcon, {}), jsxRuntime.jsx(uiKit.Text.Body, {
1754
+ isBold: true,
1755
+ children: truncate__default["default"](state.droppedFile.name, {
1756
+ length: 40
1757
+ })
1758
+ }), jsxRuntime.jsxs(uiKit.Text.Body, {
1759
+ tone: "secondary",
1760
+ children: [intl.formatNumber(convertFileSizeToKB(state.droppedFile.size)), ' ', "KB"]
1761
+ })]
1762
+ }), jsxRuntime.jsx(uiKit.SecondaryButton, {
1763
+ tone: "secondary",
1764
+ size: "medium",
1765
+ label: intl.formatMessage(sharedMessages.cancel),
1766
+ onClick: () => {
1767
+ state.abortController.abort();
1768
+ }
1769
+ })]
1770
+ }), jsxRuntime.jsx(uiKit.ProgressBar, {
1771
+ barWidth: "scale",
1772
+ height: "10",
1773
+ progress: 100
1774
+ }), jsxRuntime.jsx("div", {})]
1775
+ })
1776
+ });
1777
+ return null;
1778
+ };
1779
+
1780
+ const CurrentStep = () => {
1781
+ const _useImportResourcesCo = useImportResourcesContext(),
1782
+ state = _useImportResourcesCo.state;
1783
+ const steps = {
1784
+ 1: jsxRuntime.jsx(Upload, {}),
1785
+ 2: jsxRuntime.jsx(Uploading, {}),
1786
+ 3: jsxRuntime.jsx(UploadResult, {}),
1787
+ 4: jsxRuntime.jsx(ImportConfirmationModal, {})
1788
+ };
1789
+ return steps[state.currentStep] || null;
1790
+ };
1791
+
1792
+ const getChunkImport = locale => {
1793
+ const intlLocale = i18n.mapLocaleToIntlLocale(locale);
1794
+ switch (intlLocale) {
1795
+ case 'de':
1796
+ return Promise.resolve().then(function () { return require( /* webpackChunkName: "import-resources-modal-i18n-de" */'./de-d954fe3d.cjs.prod.js'); });
1797
+ case 'es':
1798
+ return Promise.resolve().then(function () { return require( /* webpackChunkName: "import-resources-modal-i18n-es" */'./es-042343bd.cjs.prod.js'); });
1799
+ case 'fr-FR':
1800
+ return Promise.resolve().then(function () { return require( /* webpackChunkName: "import-resources-modal-i18n-fr-FR" */'./fr-FR-fce1ca96.cjs.prod.js'); });
1801
+ case 'zh-CN':
1802
+ return Promise.resolve().then(function () { return require( /* webpackChunkName: "import-resources-modal-i18n-zh-CN" */'./zh-CN-52baa549.cjs.prod.js'); });
1803
+ case 'ja':
1804
+ return Promise.resolve().then(function () { return require( /* webpackChunkName: "import-resources-modal-i18n-ja" */'./ja-37632763.cjs.prod.js'); });
1805
+ case 'pt-BR':
1806
+ return Promise.resolve().then(function () { return require( /* webpackChunkName: "change-history-i18n-pt-BR" */'./pt-BR-ec2a1a11.cjs.prod.js'); });
1807
+ default:
1808
+ return Promise.resolve().then(function () { return require( /* webpackChunkName: "import-resources-modal-i18n-en" */'./en-c7757448.cjs.prod.js'); });
1809
+ }
1810
+ };
1811
+ const loadMessages = async locale => {
1812
+ try {
1813
+ const chunkImport = await getChunkImport(locale);
1814
+ return i18n.parseChunkImport(chunkImport);
1815
+ } catch (error) {
1816
+ // eslint-disable-next-line no-console
1817
+ console.warn("Something went wrong while loading the import-resources-modal messages for ".concat(locale), error);
1818
+ sentry.reportErrorToSentry(new Error("Something went wrong while loading the import-resources-modal messages for ".concat(locale)), {
1819
+ extra: error
1820
+ });
1821
+ return {};
1822
+ }
1823
+ };
1824
+
1825
+ const useAsyncIntlMessages = (locale, loader) => {
1826
+ const _useState = React.useState({
1827
+ isLoading: true,
1828
+ messages: undefined,
1829
+ error: undefined
1830
+ }),
1831
+ _useState2 = _slicedToArray(_useState, 2),
1832
+ state = _useState2[0],
1833
+ setState = _useState2[1];
1834
+ React.useEffect(() => {
1835
+ let _isUnmounting = false;
1836
+ async function load() {
1837
+ try {
1838
+ if (!_isUnmounting) {
1839
+ const messages = await loader(locale);
1840
+ setState({
1841
+ isLoading: false,
1842
+ messages
1843
+ });
1844
+ }
1845
+ } catch (error) {
1846
+ setState({
1847
+ isLoading: false,
1848
+ error
1849
+ });
1850
+ }
1851
+ }
1852
+ if (locale) load();
1853
+ return () => {
1854
+ _isUnmounting = true;
1855
+ };
1856
+ }, [locale, loader]);
1857
+ return state;
1858
+ };
1859
+
1860
+ function ownKeys(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
1861
+ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context = ownKeys(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context2 = ownKeys(Object(t))).call(_context2, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
1862
+ const ImportResourcesModal = props => {
1863
+ const _useApplicationContex = applicationShellConnectors.useApplicationContext(context => ({
1864
+ locale: context.user && context.user.locale
1865
+ })),
1866
+ locale = _useApplicationContex.locale;
1867
+ const messages = useAsyncIntlMessages(locale, loadMessages);
1868
+ if (!props.isOpen || messages.isLoading) return null;
1869
+ return jsxRuntime.jsx(reactIntl.IntlProvider, {
1870
+ locale: locale,
1871
+ messages: messages.messages,
1872
+ children: jsxRuntime.jsx(ImportResourcesProvider, _objectSpread(_objectSpread({}, props), {}, {
1873
+ children: jsxRuntime.jsx(CurrentStep, {})
1874
+ }))
1875
+ });
1876
+ };
1877
+ ImportResourcesModal.displayName = 'ImportResourcesModal';
1878
+
1879
+ exports.EnabledDropArea = EnabledDropArea;
1880
+ exports.FileDropped = FileDropped;
1881
+ exports.ImportResourcesModal = ImportResourcesModal;
1882
+ exports.messages = messages$2;
1883
+ exports.useImportResourcesContext = useImportResourcesContext;