@commercetools-frontend-extensions/import-resources-modal 1.11.3 → 1.11.5

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 (26) hide show
  1. package/dist/commercetools-frontend-extensions-import-resources-modal.cjs.dev.js +2086 -53
  2. package/dist/commercetools-frontend-extensions-import-resources-modal.cjs.prod.js +2062 -53
  3. package/dist/commercetools-frontend-extensions-import-resources-modal.esm.js +2071 -51
  4. package/dist/declarations/src/@types/index.d.ts +0 -6
  5. package/package.json +2 -2
  6. package/dist/active-drag-drop-area-3ad5dd22.esm.js +0 -60
  7. package/dist/active-drag-drop-area-94cea372.cjs.prod.js +0 -62
  8. package/dist/active-drag-drop-area-edf9d7a9.cjs.dev.js +0 -62
  9. package/dist/declarations/src/@types/api.d.ts +0 -13
  10. package/dist/declarations/src/@types/file-upload.d.ts +0 -60
  11. package/dist/declarations/src/@types/import-container.d.ts +0 -36
  12. package/dist/declarations/src/@types/import-states.d.ts +0 -9
  13. package/dist/declarations/src/@types/import-summary.d.ts +0 -12
  14. package/dist/declarations/src/@types/shared.d.ts +0 -7
  15. package/dist/disabled-drop-area-6af7f861.cjs.dev.js +0 -105
  16. package/dist/disabled-drop-area-d068b119.esm.js +0 -92
  17. package/dist/disabled-drop-area-d8a66b62.cjs.prod.js +0 -105
  18. package/dist/enabled-drop-area-819e5dd2.cjs.dev.js +0 -79
  19. package/dist/enabled-drop-area-b6fe0252.cjs.prod.js +0 -79
  20. package/dist/enabled-drop-area-d5d394ff.esm.js +0 -77
  21. package/dist/file-dropped-area-0e55c4a0.cjs.prod.js +0 -82
  22. package/dist/file-dropped-area-b64c266f.esm.js +0 -80
  23. package/dist/file-dropped-area-d4d52da4.cjs.dev.js +0 -82
  24. package/dist/index-c0e77d3f.cjs.dev.js +0 -2733
  25. package/dist/index-f14adfdc.esm.js +0 -2699
  26. package/dist/index-f96fadf7.cjs.prod.js +0 -2701
@@ -2,60 +2,2069 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var dist_commercetoolsFrontendExtensionsImportResourcesModal = require('./index-f96fadf7.cjs.prod.js');
6
- require('react');
7
- require('@babel/runtime-corejs3/core-js-stable/object/keys');
8
- require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols');
9
- require('@babel/runtime-corejs3/core-js-stable/instance/filter');
10
- require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor');
11
- require('@babel/runtime-corejs3/core-js-stable/instance/for-each');
12
- require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors');
13
- require('@babel/runtime-corejs3/core-js-stable/object/define-properties');
14
- require('@babel/runtime-corejs3/core-js-stable/object/define-property');
15
- require('@babel/runtime-corejs3/helpers/defineProperty');
16
- require('@babel/runtime-corejs3/helpers/slicedToArray');
17
- require('@commercetools-frontend/application-shell-connectors');
18
- require('@commercetools-frontend/sdk');
19
- require('@commercetools-frontend/constants');
20
- require('@commercetools-frontend/application-shell');
21
- require('@babel/runtime-corejs3/core-js-stable/reflect/construct');
22
- require('@babel/runtime-corejs3/helpers/createClass');
23
- require('@babel/runtime-corejs3/helpers/classCallCheck');
24
- require('@babel/runtime-corejs3/helpers/possibleConstructorReturn');
25
- require('@babel/runtime-corejs3/helpers/getPrototypeOf');
26
- require('@babel/runtime-corejs3/helpers/inherits');
27
- require('@babel/runtime-corejs3/helpers/wrapNativeSuper');
28
- require('pluralize');
29
- require('@babel/runtime-corejs3/core-js-stable/array/is-array');
30
- require('@babel/runtime-corejs3/core-js-stable/instance/reduce');
31
- require('@babel/runtime-corejs3/core-js-stable/instance/map');
32
- require('@babel/runtime-corejs3/core-js-stable/instance/slice');
33
- require('@babel/runtime-corejs3/core-js-stable/json/stringify');
34
- require('@babel/runtime-corejs3/core-js-stable/instance/some');
35
- require('@babel/runtime-corejs3/core-js-stable/instance/bind');
36
- require('@babel/runtime-corejs3/core-js-stable/instance/starts-with');
37
- require('@babel/runtime-corejs3/core-js-stable/url-search-params');
38
- require('@babel/runtime-corejs3/core-js-stable/object/entries');
39
- require('@babel/runtime-corejs3/core-js-stable/instance/every');
40
- require('@emotion/react/jsx-runtime');
41
- require('react-intl');
42
- require('@commercetools-frontend/application-components');
43
- require('@commercetools-frontend/fullstory');
44
- require('@commercetools-frontend/ui-kit');
45
- require('react-dropzone');
46
- require('@commercetools-frontend/actions-global');
47
- require('@emotion/styled/base');
5
+ var _Object$keys = require('@babel/runtime-corejs3/core-js-stable/object/keys');
6
+ var _Object$getOwnPropertySymbols = require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols');
7
+ var _filterInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/filter');
8
+ var _Object$getOwnPropertyDescriptor = require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor');
9
+ var _forEachInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/for-each');
10
+ var _Object$getOwnPropertyDescriptors = require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors');
11
+ var _Object$defineProperties = require('@babel/runtime-corejs3/core-js-stable/object/define-properties');
12
+ var _Object$defineProperty = require('@babel/runtime-corejs3/core-js-stable/object/define-property');
13
+ var _defineProperty = require('@babel/runtime-corejs3/helpers/defineProperty');
14
+ var _everyInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/every');
15
+ var reactIntl = require('react-intl');
16
+ var applicationShellConnectors = require('@commercetools-frontend/application-shell-connectors');
17
+ var operations = require('@commercetools-frontend-extensions/operations');
18
+ var _slicedToArray = require('@babel/runtime-corejs3/helpers/slicedToArray');
19
+ var React = require('react');
20
+ var jsxRuntime = require('@emotion/react/jsx-runtime');
21
+ var applicationComponents = require('@commercetools-frontend/application-components');
22
+ var fullstory = require('@commercetools-frontend/fullstory');
23
+ var permissions = require('@commercetools-frontend/permissions');
24
+ var uiKit = require('@commercetools-frontend/ui-kit');
25
+ var actionsGlobal = require('@commercetools-frontend/actions-global');
26
+ var constants = require('@commercetools-frontend/constants');
27
+ var _Reflect$construct = require('@babel/runtime-corejs3/core-js-stable/reflect/construct');
28
+ var _createClass = require('@babel/runtime-corejs3/helpers/createClass');
29
+ var _classCallCheck = require('@babel/runtime-corejs3/helpers/classCallCheck');
30
+ var _possibleConstructorReturn = require('@babel/runtime-corejs3/helpers/possibleConstructorReturn');
31
+ var _getPrototypeOf = require('@babel/runtime-corejs3/helpers/getPrototypeOf');
32
+ var _inherits = require('@babel/runtime-corejs3/helpers/inherits');
33
+ var _wrapNativeSuper = require('@babel/runtime-corejs3/helpers/wrapNativeSuper');
34
+ var sentry = require('@commercetools-frontend/sentry');
35
+ var _mapInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/map');
36
+ var _sliceInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/slice');
37
+ var _styled = require('@emotion/styled/base');
48
38
  require('@emotion/react');
49
- require('@commercetools-frontend/permissions');
50
- require('@commercetools-frontend/sentry');
51
- require('@babel/runtime-corejs3/core-js-stable/promise');
52
- require('@babel/runtime-corejs3/core-js-stable/instance/includes');
53
- require('@babel/runtime-corejs3/core-js-stable/instance/flat-map');
54
- require('@babel/runtime-corejs3/core-js-stable/instance/find');
55
- require('papaparse');
56
- require('@commercetools-frontend/i18n');
39
+ var i18n = require('@commercetools-frontend/i18n');
57
40
 
41
+ function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
58
42
 
43
+ var _Object$keys__default = /*#__PURE__*/_interopDefault(_Object$keys);
44
+ var _Object$getOwnPropertySymbols__default = /*#__PURE__*/_interopDefault(_Object$getOwnPropertySymbols);
45
+ var _filterInstanceProperty__default = /*#__PURE__*/_interopDefault(_filterInstanceProperty);
46
+ var _Object$getOwnPropertyDescriptor__default = /*#__PURE__*/_interopDefault(_Object$getOwnPropertyDescriptor);
47
+ var _forEachInstanceProperty__default = /*#__PURE__*/_interopDefault(_forEachInstanceProperty);
48
+ var _Object$getOwnPropertyDescriptors__default = /*#__PURE__*/_interopDefault(_Object$getOwnPropertyDescriptors);
49
+ var _Object$defineProperties__default = /*#__PURE__*/_interopDefault(_Object$defineProperties);
50
+ var _Object$defineProperty__default = /*#__PURE__*/_interopDefault(_Object$defineProperty);
51
+ var _everyInstanceProperty__default = /*#__PURE__*/_interopDefault(_everyInstanceProperty);
52
+ var React__default = /*#__PURE__*/_interopDefault(React);
53
+ var _Reflect$construct__default = /*#__PURE__*/_interopDefault(_Reflect$construct);
54
+ var _mapInstanceProperty__default = /*#__PURE__*/_interopDefault(_mapInstanceProperty);
55
+ var _sliceInstanceProperty__default = /*#__PURE__*/_interopDefault(_sliceInstanceProperty);
56
+ var _styled__default = /*#__PURE__*/_interopDefault(_styled);
59
57
 
60
- exports["default"] = dist_commercetoolsFrontendExtensionsImportResourcesModal.ImportResourcesModal;
61
- exports.useImportPermission = dist_commercetoolsFrontendExtensionsImportResourcesModal.useImportPermission;
58
+ let CurrentStep$1 = /*#__PURE__*/function (CurrentStep) {
59
+ CurrentStep["Upload"] = "upload";
60
+ CurrentStep["Uploading"] = "uploading";
61
+ CurrentStep["UploadResult"] = "upload-result";
62
+ CurrentStep["ImportConfirmationModal"] = "import-confirmation-modal";
63
+ return CurrentStep;
64
+ }({});
65
+
66
+ 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; }
67
+ 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; }
68
+
69
+ // TODO: make this resource type specific
70
+
71
+ function reducer(state, action) {
72
+ if (action.type === 'setCurrentStep') return _objectSpread$c(_objectSpread$c({}, state), {}, {
73
+ currentStep: action.currentStep,
74
+ progress: 0
75
+ });
76
+ if (action.type === 'setUploadFileResponse') return _objectSpread$c(_objectSpread$c({}, state), {}, {
77
+ uploadFileResponse: action.uploadFileResponse
78
+ });
79
+ if (action.type === 'setResourceType') return _objectSpread$c(_objectSpread$c({}, state), {}, {
80
+ resourceType: action.resourceType
81
+ });
82
+ if (action.type === 'setContainerKey') return _objectSpread$c(_objectSpread$c({}, state), {}, {
83
+ containerKey: action.containerKey
84
+ });
85
+ if (action.type === 'cancelImport') return _objectSpread$c(_objectSpread$c({}, state), {}, {
86
+ currentStep: CurrentStep$1.Upload,
87
+ containerKey: undefined,
88
+ fileUploadErrors: [],
89
+ uploadFileResponse: undefined,
90
+ droppedFile: undefined,
91
+ dropAreaState: 'disabled',
92
+ progress: 0
93
+ });
94
+ if (action.type === 'uploadNewFile') return _objectSpread$c(_objectSpread$c({}, state), {}, {
95
+ currentStep: CurrentStep$1.Upload,
96
+ containerKey: undefined,
97
+ fileUploadErrors: [],
98
+ uploadFileResponse: undefined,
99
+ droppedFile: undefined,
100
+ dropAreaState: 'ready-for-drop',
101
+ progress: 0
102
+ });
103
+ if (action.type === 'setDroppedFile') {
104
+ return _objectSpread$c(_objectSpread$c({}, state), {}, {
105
+ droppedFile: action.droppedFile
106
+ });
107
+ }
108
+ if (action.type === 'setFileUploadErrors') {
109
+ return _objectSpread$c(_objectSpread$c({}, state), {}, {
110
+ fileUploadErrors: action.fileUploadErrors
111
+ });
112
+ }
113
+ if (action.type === 'setAbortController') {
114
+ return _objectSpread$c(_objectSpread$c({}, state), {}, {
115
+ abortController: action.abortController
116
+ });
117
+ }
118
+ if (action.type === 'setProgress') {
119
+ return _objectSpread$c(_objectSpread$c({}, state), {}, {
120
+ progress: action.progress
121
+ });
122
+ }
123
+ if (action.type === 'setUploadSettings') {
124
+ return _objectSpread$c(_objectSpread$c({}, state), {}, {
125
+ settings: _objectSpread$c(_objectSpread$c({}, state.settings), action.settings)
126
+ });
127
+ }
128
+ throw new Error(getUnknownActionError(action));
129
+ }
130
+ function getUnknownActionError(actionType) {
131
+ return `Unkown type: ${actionType}`;
132
+ }
133
+ const initialState = {
134
+ currentStep: CurrentStep$1.Upload,
135
+ abortController: new AbortController(),
136
+ dropAreaState: 'disabled',
137
+ uploadFileResponse: undefined,
138
+ fileUploadErrors: [],
139
+ resourceType: 'category',
140
+ containerKey: undefined,
141
+ progress: 0,
142
+ settings: {
143
+ decimalSeparator: '.'
144
+ }
145
+ };
146
+
147
+ 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; }
148
+ 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; }
149
+ const ImportResourcesContext = /*#__PURE__*/React__default["default"].createContext();
150
+ const ImportResourcesProvider = props => {
151
+ const _useApplicationContex = applicationShellConnectors.useApplicationContext(context => ({
152
+ projectKey: context.project?.key
153
+ })),
154
+ projectKey = _useApplicationContex.projectKey;
155
+ const _React$useReducer = React__default["default"].useReducer(reducer, _objectSpread$b(_objectSpread$b({}, initialState), {}, {
156
+ resourceType: props.resourceTypes[0]
157
+ })),
158
+ _React$useReducer2 = _slicedToArray(_React$useReducer, 2),
159
+ state = _React$useReducer2[0],
160
+ dispatch = _React$useReducer2[1];
161
+ const setCurrentStep = currentStep => dispatch({
162
+ type: 'setCurrentStep',
163
+ currentStep
164
+ });
165
+ const setUploadFileResponse = uploadFileResponse => dispatch({
166
+ type: 'setUploadFileResponse',
167
+ uploadFileResponse: uploadFileResponse
168
+ });
169
+ const setResourceType = resourceType => dispatch({
170
+ type: 'setResourceType',
171
+ resourceType: resourceType
172
+ });
173
+ const setContainerKey = containerKey => dispatch({
174
+ type: 'setContainerKey',
175
+ containerKey
176
+ });
177
+ const cancelImport = () => dispatch({
178
+ type: 'cancelImport'
179
+ });
180
+ const uploadNewFile = () => dispatch({
181
+ type: 'uploadNewFile'
182
+ });
183
+ const setDroppedFile = droppedFile => dispatch({
184
+ type: 'setDroppedFile',
185
+ droppedFile: droppedFile
186
+ });
187
+ const setAbortController = abortController => dispatch({
188
+ type: 'setAbortController',
189
+ abortController: abortController
190
+ });
191
+ const setFileUploadErrors = fileUploadErrors => dispatch({
192
+ type: 'setFileUploadErrors',
193
+ fileUploadErrors: fileUploadErrors
194
+ });
195
+ const setProgress = progress => dispatch({
196
+ type: 'setProgress',
197
+ progress
198
+ });
199
+ const setUploadSettings = nextSettings => {
200
+ dispatch({
201
+ type: 'setUploadSettings',
202
+ settings: nextSettings
203
+ });
204
+ };
205
+ const handleClose = function () {
206
+ let _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
207
+ shouldDeleteImportContainer = _ref.shouldDeleteImportContainer;
208
+ if (state.abortController) state.abortController.abort();
209
+ if (typeof props.onClose === 'function') props.onClose();
210
+ // Removes the associated import container when the import is closed
211
+ if (shouldDeleteImportContainer && projectKey && state.containerKey) operations.deleteImportContainer({
212
+ projectKey,
213
+ importContainerKey: state.containerKey
214
+ });
215
+ };
216
+ const handleStartImportSuccess = () => {
217
+ if (typeof props.onStartImportSuccess === 'function') props.onStartImportSuccess();
218
+ };
219
+ return jsxRuntime.jsx(ImportResourcesContext.Provider, {
220
+ value: {
221
+ state,
222
+ resourceTypes: props.resourceTypes,
223
+ onClose: handleClose,
224
+ onStartImportSuccess: handleStartImportSuccess,
225
+ actions: {
226
+ setCurrentStep,
227
+ cancelImport,
228
+ uploadNewFile,
229
+ setUploadFileResponse,
230
+ setResourceType,
231
+ setDroppedFile,
232
+ setContainerKey,
233
+ setAbortController,
234
+ setFileUploadErrors,
235
+ setProgress,
236
+ setUploadSettings
237
+ }
238
+ },
239
+ children: props.children
240
+ });
241
+ };
242
+
243
+ function getDropArea(_ref) {
244
+ let dropAreaState = _ref.dropAreaState,
245
+ resourceType = _ref.resourceType,
246
+ isFileDropped = _ref.isFileDropped,
247
+ fileName = _ref.fileName,
248
+ messages = _ref.messages;
249
+ if (dropAreaState === 'file-dropped') {
250
+ return jsxRuntime.jsx(operations.FileDroppedArea, {
251
+ fileName: fileName,
252
+ chooseFileLabel: messages.chooseFile
253
+ });
254
+ }
255
+ if (dropAreaState === 'disabled' || !resourceType) {
256
+ return jsxRuntime.jsx(operations.DisabledDropArea, {});
257
+ }
258
+ if (dropAreaState === 'ready-for-drop') {
259
+ return jsxRuntime.jsx(operations.EnabledDropArea, {
260
+ dragAndDropText: messages.dragAndDropCSV,
261
+ orText: messages.or,
262
+ browseFileText: messages.browseButton
263
+ });
264
+ }
265
+ if (dropAreaState === 'active-drag') {
266
+ return jsxRuntime.jsx(operations.ActiveDragDropArea, {
267
+ isFileDropped: isFileDropped,
268
+ fileName: fileName,
269
+ chooseFileLabel: messages.chooseFile,
270
+ dragAndDropText: messages.dragAndDropCSV,
271
+ orText: messages.or,
272
+ browseFileText: messages.browseButton
273
+ });
274
+ }
275
+ return fallbackDropArea();
276
+ }
277
+ function fallbackDropArea(_dropAreaState) {
278
+ return jsxRuntime.jsx(operations.DisabledDropArea, {});
279
+ }
280
+ function getDropAreaState(flags) {
281
+ if (flags.isDragActive) {
282
+ return 'active-drag';
283
+ }
284
+ if (flags.hasResourceType) {
285
+ return 'disabled';
286
+ }
287
+ if (flags.isReady) {
288
+ return 'file-dropped';
289
+ }
290
+ return 'ready-for-drop';
291
+ }
292
+
293
+ var messages$5 = reactIntl.defineMessages({
294
+ dragAndDropCSV: {
295
+ id: 'ImportResourcesModal.dragAndDropCSV',
296
+ description: 'The message telling the user to drag and drop CSV file in the file drop area',
297
+ defaultMessage: 'Drag and drop CSV'
298
+ },
299
+ or: {
300
+ id: 'ImportResourcesModal.or',
301
+ description: 'The word "or" in the drag and drop message',
302
+ defaultMessage: 'or'
303
+ },
304
+ browseButton: {
305
+ id: 'ImportResourcesModal.browseFile',
306
+ defaultMessage: 'Browse file'
307
+ },
308
+ uploadFile: {
309
+ id: 'ImportResourcesModal.uploadFile',
310
+ description: 'Label for a button on the file upload page, shown on active drop area state',
311
+ defaultMessage: 'Upload file'
312
+ },
313
+ chooseFile: {
314
+ id: 'ImportResourcesModal.chooseFile',
315
+ description: 'Label for a button on the file upload page, shown on ready to upload state',
316
+ defaultMessage: 'Choose file'
317
+ },
318
+ fileUploadFailed: {
319
+ id: 'ImportResourcesModal.fileUploadFailed',
320
+ description: 'A title on the file upload page, shown on file upload error state',
321
+ defaultMessage: 'File upload failed'
322
+ },
323
+ fileFormatNotSupported: {
324
+ id: 'ImportResourcesModal.fileFormatNotSupported',
325
+ description: 'Error message displayed when a user drags and drops a non-CSV file',
326
+ defaultMessage: 'Invalid file format: The file is not in CSV format and cannot be processed.'
327
+ },
328
+ tooManyFilesError: {
329
+ id: 'ImportResourcesModal.tooManyFilesError',
330
+ description: 'Error message displayed when a user drags and drops multiple files at once',
331
+ defaultMessage: 'Multiple files detected: You can only drag and drop one file at a time.'
332
+ },
333
+ genericError: {
334
+ id: 'ImportResourcesModal.genericError',
335
+ description: 'Default error message for unexpected file upload issues (for unhandled cases)',
336
+ defaultMessage: 'Error occurred: Please try uploading the file again or contact our support team for assistance.'
337
+ },
338
+ dataType: {
339
+ id: 'ImportResourcesModal.dataType',
340
+ description: 'Label for the data type selection dropdown',
341
+ defaultMessage: 'Data type'
342
+ },
343
+ instructions: {
344
+ id: 'ImportResourcesModal.instructions',
345
+ description: 'Label for the instructions section',
346
+ defaultMessage: 'Instructions'
347
+ },
348
+ prerequisitesOfImportingData: {
349
+ id: 'ImportResourcesModal.infoBox.prerequisitesOfImportingData',
350
+ description: 'A message to guide users to check the prerequisites of importing data',
351
+ defaultMessage: 'Prerequisites of importing data'
352
+ },
353
+ keysForEveryResource: {
354
+ id: 'ImportResourcesModal.infoBox.keysForEveryResource',
355
+ description: 'A message to guide users to provide keys for every resource they import',
356
+ defaultMessage: 'You must provide keys for every resource you import, including embedded resources such as Prices and Assets. Please consult with your admins to assign keys through <link>the HTTP API</link>.'
357
+ },
358
+ publishProducts: {
359
+ id: 'ImportResourcesModal.settings.publishProducts',
360
+ description: 'Label for the publish products checkbox',
361
+ defaultMessage: 'Publish all products in the file'
362
+ },
363
+ separatorTitle: {
364
+ id: 'ImportResourcesModal.uploadSeparator.separatorTitle',
365
+ description: 'Title for the separator selection',
366
+ defaultMessage: 'Separator'
367
+ },
368
+ decimalsSeparatorDescription: {
369
+ id: 'ImportResourcesModal.uploadSeparator.decimalsSeparatorDescription',
370
+ description: 'Description for the decimals separator selection',
371
+ defaultMessage: 'Select the decimals separator that match your CSV file. The column separator is automatically detected.'
372
+ },
373
+ decimalSeparatorPoint: {
374
+ id: 'ImportResourcesModal.uploadSeparator.decimalSeparatorPoint',
375
+ description: 'Label for point decimal separator option',
376
+ defaultMessage: 'point (.)'
377
+ },
378
+ decimalSeparatorComma: {
379
+ id: 'ImportResourcesModal.uploadSeparator.decimalSeparatorComma',
380
+ description: 'Label for comma decimal separator option',
381
+ defaultMessage: 'comma (,)'
382
+ },
383
+ decimals: {
384
+ id: 'ImportResourcesModal.uploadSeparator.decimals',
385
+ description: 'Label for decimal separator select',
386
+ defaultMessage: 'Decimals'
387
+ }
388
+ });
389
+
390
+ function _callSuper$1(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct$1() ? _Reflect$construct__default["default"](o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
391
+ function _isNativeReflectConstruct$1() { try { var t = !Boolean.prototype.valueOf.call(_Reflect$construct__default["default"](Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct$1 = function () { return !!t; })(); }
392
+ let UnexpectedResourceTypeError = /*#__PURE__*/function (_Error) {
393
+ function UnexpectedResourceTypeError(resourceType) {
394
+ var _this;
395
+ _classCallCheck(this, UnexpectedResourceTypeError);
396
+ _this = _callSuper$1(this, UnexpectedResourceTypeError, [`Unexpected resource type "${resourceType}"`]);
397
+ _this.name = 'UnexpectedResourceTypeError';
398
+ return _this;
399
+ }
400
+ _inherits(UnexpectedResourceTypeError, _Error);
401
+ return _createClass(UnexpectedResourceTypeError);
402
+ }(/*#__PURE__*/_wrapNativeSuper(Error));
403
+
404
+ function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? _Reflect$construct__default["default"](o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
405
+ function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(_Reflect$construct__default["default"](Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function () { return !!t; })(); }
406
+ let MissingImportResourceProviderError = /*#__PURE__*/function (_Error) {
407
+ function MissingImportResourceProviderError() {
408
+ var _this;
409
+ _classCallCheck(this, MissingImportResourceProviderError);
410
+ _this = _callSuper(this, MissingImportResourceProviderError, ['useImportResourcesContext must be used within ImportResourcesProvider']);
411
+ _this.name = 'MissingImportResourceProviderError';
412
+ return _this;
413
+ }
414
+ _inherits(MissingImportResourceProviderError, _Error);
415
+ return _createClass(MissingImportResourceProviderError);
416
+ }(/*#__PURE__*/_wrapNativeSuper(Error));
417
+
418
+ function useImportResourcesContext() {
419
+ const context = React.useContext(ImportResourcesContext);
420
+ if (!context) {
421
+ throw new MissingImportResourceProviderError();
422
+ }
423
+ return context;
424
+ }
425
+
426
+ var messages$4 = reactIntl.defineMessages({
427
+ fileSizeExceededTitle: {
428
+ id: 'ImportResourcesModal.sizeExceededTitle',
429
+ defaultMessage: 'File size exceeded'
430
+ },
431
+ fileSizeExceededDescription: {
432
+ id: 'ImportResourcesModal.sizeExceededDescription',
433
+ description: 'Error description when the file size exceeds the allowable limit',
434
+ defaultMessage: 'The file exceeds the maximum allowed size of {fileSizeLimit} MB'
435
+ },
436
+ rowLimitExceededTitle: {
437
+ id: 'ImportResourcesModal.rowLimitExceededTitle',
438
+ defaultMessage: 'Row limit exceeded'
439
+ },
440
+ rowLimitExceededDescription: {
441
+ id: 'ImportResourcesModal.rowLimitExceededDescription',
442
+ description: 'Error description when the file contains more rows than the allowable maximum',
443
+ defaultMessage: 'The file contains more than the allowable maximum of {rowLimit} rows'
444
+ },
445
+ wrongSeparatorTitle: {
446
+ id: 'ImportResourcesModal.wrongSeparatorTitle',
447
+ defaultMessage: 'Wrong separator'
448
+ },
449
+ wrongSeparatorDescription: {
450
+ id: 'ImportResourcesModal.wrongSeparatorDescription',
451
+ description: 'Message within the drop area when a CSV file uses an unexpected separator',
452
+ defaultMessage: 'The file is using an unsupported separator. Please use one of the allowed separators: {delimiterList}.'
453
+ },
454
+ dropAreaNotEnoughRowsTitle: {
455
+ id: 'ImportResourcesModal.dropAreaNotEnoughRowsTitle',
456
+ description: 'Error title shown when the uploaded CSV file does not contain a header and at least one row of data',
457
+ defaultMessage: 'Invalid CSV file'
458
+ },
459
+ dropAreaNotEnoughRowsDescription: {
460
+ id: 'ImportResourcesModal.dropAreaNotEnoughRowsDescription',
461
+ description: 'Error description shown when the uploaded CSV file does not contain a header and at least one row of data',
462
+ defaultMessage: 'Make sure the file contains a header and at least one row of data'
463
+ },
464
+ unexpectedError: {
465
+ id: 'ImportResourcesModal.unexpectedError',
466
+ description: 'Generic notification message when file upload fails',
467
+ defaultMessage: 'An unexpected error occurred during the file upload. Please try again, or contact support if this error occurs again.'
468
+ },
469
+ missingRequiredField: {
470
+ id: 'ImportResourcesModal.missingRequiredField',
471
+ description: 'Error message displayed when a required field is missing',
472
+ defaultMessage: 'Missing required field'
473
+ },
474
+ missingKeyError: {
475
+ id: 'ImportResourcesModal.missingKeyError',
476
+ description: 'Error message displayed when the uploaded file is missing the key field',
477
+ defaultMessage: "The 'key' field is missing or incomplete in some rows. Please ensure every row has a 'key' value."
478
+ },
479
+ missingRequiredKeys: {
480
+ id: 'ImportResourcesModal.missingRequiredKeys',
481
+ description: 'Error message displayed when the uploaded file is missing required keys',
482
+ defaultMessage: 'Make sure the file contains required keys for the elements including {fieldNames}'
483
+ }
484
+ });
485
+
486
+ const IMPORTABLE_RESOURCES = {
487
+ CATEGORY: 'category',
488
+ PRODUCT: 'product',
489
+ INVENTORY: 'inventory',
490
+ DISCOUNT_CODE: 'discount-code',
491
+ CUSTOMER: 'customer',
492
+ ORDER: 'order',
493
+ PRODUCT_TYPE: 'product-type',
494
+ BUSINESS_UNIT: 'business-unit'
495
+ };
496
+
497
+ var sharedMessages = reactIntl.defineMessages({
498
+ [`modalTitle.${IMPORTABLE_RESOURCES.CATEGORY}`]: {
499
+ id: 'ImportResourcesModal.modalTitle.category',
500
+ description: 'Label for the categories modal title',
501
+ defaultMessage: 'Import categories by CSV'
502
+ },
503
+ [`modalTitle.${IMPORTABLE_RESOURCES.PRODUCT}`]: {
504
+ id: 'ImportResourcesModal.modalTitle.product',
505
+ description: 'Label for the products modal title',
506
+ defaultMessage: 'Import products by CSV'
507
+ },
508
+ [`modalTitle.${IMPORTABLE_RESOURCES.INVENTORY}`]: {
509
+ id: 'ImportResourcesModal.modalTitle.inventoryEntry',
510
+ description: 'Label for the inventories modal title',
511
+ defaultMessage: 'Import inventories by CSV'
512
+ },
513
+ [`modalTitle.${IMPORTABLE_RESOURCES.DISCOUNT_CODE}`]: {
514
+ id: 'ImportResourcesModal.modalTitle.discountCode',
515
+ description: 'Label for the inventories modal title',
516
+ defaultMessage: 'Import discount codes by CSV'
517
+ },
518
+ [`modalTitle.${IMPORTABLE_RESOURCES.BUSINESS_UNIT}`]: {
519
+ id: 'ImportResourcesModal.modalTitle.businessUnit',
520
+ description: 'Label for the business units modal title',
521
+ defaultMessage: 'Import business units by CSV'
522
+ },
523
+ [`modalTitle.${IMPORTABLE_RESOURCES.CUSTOMER}`]: {
524
+ id: 'ImportResourcesModal.modalTitle.customer',
525
+ description: 'Label for the customers modal title',
526
+ defaultMessage: 'Import customers by CSV'
527
+ },
528
+ [`modalTitle.${IMPORTABLE_RESOURCES.ORDER}`]: {
529
+ id: 'ImportResourcesModal.modalTitle.order',
530
+ description: 'Label for the order modal title',
531
+ defaultMessage: 'Import orders by CSV'
532
+ },
533
+ [`modalTitle.${IMPORTABLE_RESOURCES.PRODUCT_TYPE}`]: {
534
+ id: 'ImportResourcesModal.modalTitle.productType',
535
+ description: 'Label for the product type modal title',
536
+ defaultMessage: 'Import product types by CSV'
537
+ },
538
+ uploadButton: {
539
+ id: 'ImportResourcesModal.uploadButton',
540
+ description: 'Label for the upload button',
541
+ defaultMessage: 'Upload and preview'
542
+ },
543
+ cancel: {
544
+ id: 'ImportResourcesModal.cancel',
545
+ description: 'Label for the cancel button',
546
+ defaultMessage: 'Cancel'
547
+ },
548
+ close: {
549
+ id: 'ImportResourcesModal.close',
550
+ description: 'Label for the close button',
551
+ defaultMessage: 'Close'
552
+ },
553
+ listConjunctionOr: {
554
+ id: 'ImportResourcesModal.listConjunctionOr',
555
+ description: 'Label for the list conjunction or',
556
+ defaultMessage: 'or'
557
+ },
558
+ delimiterComma: {
559
+ id: 'ImportResourcesModal.delimiterComma',
560
+ description: 'Label for the delimiter name comma',
561
+ defaultMessage: 'comma'
562
+ },
563
+ delimiterSemicolon: {
564
+ id: 'ImportResourcesModal.delimiterSemicolon',
565
+ description: 'Label for the delimiter name semicolon',
566
+ defaultMessage: 'semicolon'
567
+ },
568
+ delimiterPipe: {
569
+ id: 'ImportResourcesModal.delimiterPipe',
570
+ description: 'Label for the delimiter name pipe',
571
+ defaultMessage: 'pipe'
572
+ },
573
+ delimiterTab: {
574
+ id: 'ImportResourcesModal.delimiterTab',
575
+ description: 'Label for the delimiter name tab',
576
+ defaultMessage: 'tab'
577
+ },
578
+ // Resource types
579
+ product: {
580
+ id: 'ImportResourcesModal.product',
581
+ description: 'Label for the product resource type',
582
+ defaultMessage: 'Product'
583
+ },
584
+ products: {
585
+ id: 'ImportResourcesModal.products',
586
+ description: 'Label for the products resource type',
587
+ defaultMessage: 'Products'
588
+ },
589
+ inventory: {
590
+ id: 'ImportResourcesModal.inventory',
591
+ description: 'Label for the inventory entry resource type',
592
+ defaultMessage: 'Inventory'
593
+ },
594
+ inventories: {
595
+ id: 'ImportResourcesModal.inventories',
596
+ description: 'Label for the inventories entry resource type',
597
+ defaultMessage: 'Inventories'
598
+ },
599
+ category: {
600
+ id: 'ImportResourcesModal.category',
601
+ description: 'Label for the category resource type',
602
+ defaultMessage: 'Category'
603
+ },
604
+ categories: {
605
+ id: 'ImportResourcesModal.categories',
606
+ description: 'Label for the categories resource type',
607
+ defaultMessage: 'Categories'
608
+ },
609
+ 'custom-object': {
610
+ id: 'ImportResourcesModal.custom-object',
611
+ description: 'Label for the custom-object resource type',
612
+ defaultMessage: 'Custom object'
613
+ },
614
+ 'custom-objects': {
615
+ id: 'ImportResourcesModal.custom-objects',
616
+ description: 'Label for the custom-objects resource type',
617
+ defaultMessage: 'Custom objects'
618
+ },
619
+ customer: {
620
+ id: 'ImportResourcesModal.customer',
621
+ description: 'Label for the customer resource type',
622
+ defaultMessage: 'Customer'
623
+ },
624
+ customers: {
625
+ id: 'ImportResourcesModal.customers',
626
+ description: 'Label for the customers resource type',
627
+ defaultMessage: 'Customers'
628
+ },
629
+ order: {
630
+ id: 'ImportResourcesModal.order',
631
+ description: 'Label for the order resource type',
632
+ defaultMessage: 'Order'
633
+ },
634
+ orders: {
635
+ id: 'ImportResourcesModal.orders',
636
+ description: 'Label for the orders resource type',
637
+ defaultMessage: 'Orders'
638
+ },
639
+ 'order-patch': {
640
+ id: 'ImportResourcesModal.order-patch',
641
+ description: 'Label for the order-patch resource type',
642
+ defaultMessage: 'Order patch'
643
+ },
644
+ 'order-patches': {
645
+ id: 'ImportResourcesModal.order-patches',
646
+ description: 'Label for the order-patches resource type',
647
+ defaultMessage: 'Order patches'
648
+ },
649
+ price: {
650
+ id: 'ImportResourcesModal.price',
651
+ description: 'Label for the price resource type',
652
+ defaultMessage: 'Price'
653
+ },
654
+ prices: {
655
+ id: 'ImportResourcesModal.prices',
656
+ description: 'Label for the prices resource type',
657
+ defaultMessage: 'Prices'
658
+ },
659
+ 'product-draft': {
660
+ id: 'ImportResourcesModal.product-draft',
661
+ description: 'Label for the product-draft resource type',
662
+ defaultMessage: 'Product draft'
663
+ },
664
+ 'product-drafts': {
665
+ id: 'ImportResourcesModal.product-drafts',
666
+ description: 'Label for the product-drafts resource type',
667
+ defaultMessage: 'Product drafts'
668
+ },
669
+ 'product-type': {
670
+ id: 'ImportResourcesModal.product-type',
671
+ description: 'Label for the product-type resource type',
672
+ defaultMessage: 'Product type'
673
+ },
674
+ 'product-types': {
675
+ id: 'ImportResourcesModal.product-types',
676
+ description: 'Label for the product-types resource type',
677
+ defaultMessage: 'Product types'
678
+ },
679
+ 'product-variant': {
680
+ id: 'ImportResourcesModal.product-variant',
681
+ description: 'Label for the product-variant resource type',
682
+ defaultMessage: 'Product variant'
683
+ },
684
+ 'product-variants': {
685
+ id: 'ImportResourcesModal.product-variants',
686
+ description: 'Label for the product-variants resource type',
687
+ defaultMessage: 'Product variants'
688
+ },
689
+ 'product-variant-patch': {
690
+ id: 'ImportResourcesModal.product-variant-patch',
691
+ description: 'Label for the product-variant-patch resource type',
692
+ defaultMessage: 'Product variant patch'
693
+ },
694
+ 'product-variant-patches': {
695
+ id: 'ImportResourcesModal.product-variant-patches',
696
+ description: 'Label for the product-variant-patches resource type',
697
+ defaultMessage: 'Product variant patches'
698
+ },
699
+ 'standalone-price': {
700
+ id: 'ImportResourcesModal.standalone-price',
701
+ description: 'Label for the standalone-price resource type',
702
+ defaultMessage: 'Standalone price'
703
+ },
704
+ 'standalone-prices': {
705
+ id: 'ImportResourcesModal.standalone-prices',
706
+ description: 'Label for the standalone-prices resource type',
707
+ defaultMessage: 'Standalone prices'
708
+ },
709
+ type: {
710
+ id: 'ImportResourcesModal.type',
711
+ description: 'Label for the type resource type',
712
+ defaultMessage: 'Type'
713
+ },
714
+ types: {
715
+ id: 'ImportResourcesModal.types',
716
+ description: 'Label for the types resource type',
717
+ defaultMessage: 'Types'
718
+ },
719
+ 'discount-code': {
720
+ id: 'ImportResourcesModal.discount-code',
721
+ description: 'Label for the discount-code resource type',
722
+ defaultMessage: 'Discount code'
723
+ },
724
+ 'discount-codes': {
725
+ id: 'ImportResourcesModal.discount-codes',
726
+ description: 'Label for the discount-codes resource type',
727
+ defaultMessage: 'Discount codes'
728
+ },
729
+ 'business-unit': {
730
+ id: 'ImportResourcesModal.business-unit',
731
+ description: 'Label for the business-unit resource type',
732
+ defaultMessage: 'Business unit'
733
+ },
734
+ 'business-units': {
735
+ id: 'ImportResourcesModal.business-units',
736
+ description: 'Label for the business-units resource type',
737
+ defaultMessage: 'Business units'
738
+ },
739
+ unknownResourceType: {
740
+ id: 'ImportResourcesModal.unknown-resource-type',
741
+ description: 'Label for the unknown resource type',
742
+ defaultMessage: 'Unknown resource type'
743
+ }
744
+ //
745
+ });
746
+
747
+ const formatAllowedDelimitersForMessageDisplay = intl => {
748
+ const localizedOr = intl.formatMessage(sharedMessages.listConjunctionOr);
749
+ const descriptions = _mapInstanceProperty__default["default"](operations.COLUMN_DELIMITERS).call(operations.COLUMN_DELIMITERS, delimiter => {
750
+ let nameDescriptor;
751
+ switch (delimiter) {
752
+ case ',':
753
+ nameDescriptor = sharedMessages.delimiterComma;
754
+ break;
755
+ case ';':
756
+ nameDescriptor = sharedMessages.delimiterSemicolon;
757
+ break;
758
+ case '|':
759
+ nameDescriptor = sharedMessages.delimiterPipe;
760
+ break;
761
+ case '\t':
762
+ nameDescriptor = sharedMessages.delimiterTab;
763
+ break;
764
+ default:
765
+ nameDescriptor = undefined;
766
+ }
767
+ const name = nameDescriptor ? intl.formatMessage(nameDescriptor) : delimiter;
768
+ return delimiter === '\t' ? name : `${name} (${delimiter})`;
769
+ });
770
+ if (descriptions.length === 1) {
771
+ return descriptions[0];
772
+ }
773
+ const lastDescription = descriptions.pop();
774
+ return `${descriptions.join(', ')} ${localizedOr} ${lastDescription}`;
775
+ };
776
+
777
+ function resourceTypeToMessage(resourceType) {
778
+ const resourceTypeMap = {
779
+ category: sharedMessages.category,
780
+ product: sharedMessages.product,
781
+ 'product-type': sharedMessages['product-type'],
782
+ order: sharedMessages.order,
783
+ customer: sharedMessages.customer,
784
+ 'discount-code': sharedMessages['discount-code'],
785
+ inventory: sharedMessages.inventory,
786
+ 'inventory-entry': sharedMessages.inventory,
787
+ 'order-patch': sharedMessages['order-patch'],
788
+ price: sharedMessages.price,
789
+ 'product-draft': sharedMessages['product-draft'],
790
+ 'product-variant': sharedMessages['product-variant'],
791
+ 'product-variant-patch': sharedMessages['product-variant-patch'],
792
+ 'standalone-price': sharedMessages['standalone-price'],
793
+ 'custom-object': sharedMessages['custom-object'],
794
+ 'business-unit': sharedMessages['business-unit'],
795
+ type: sharedMessages.type
796
+ };
797
+ const message = resourceTypeMap[resourceType];
798
+ if (!message) {
799
+ console.warn(new UnexpectedResourceTypeError(resourceType));
800
+ return sharedMessages.unknownResourceType;
801
+ }
802
+ return message;
803
+ }
804
+ function resourceTypeToPluralMessage(resourceType) {
805
+ const resourceTypePluralMap = {
806
+ category: sharedMessages.categories,
807
+ 'custom-object': sharedMessages['custom-objects'],
808
+ product: sharedMessages.products,
809
+ 'product-type': sharedMessages['product-types'],
810
+ order: sharedMessages.orders,
811
+ customer: sharedMessages.customers,
812
+ 'discount-code': sharedMessages['discount-codes'],
813
+ inventory: sharedMessages.inventories,
814
+ 'inventory-entry': sharedMessages.inventories,
815
+ 'order-patch': sharedMessages['order-patches'],
816
+ price: sharedMessages.prices,
817
+ 'product-draft': sharedMessages['product-drafts'],
818
+ 'product-variant': sharedMessages['product-variants'],
819
+ 'product-variant-patch': sharedMessages['product-variant-patches'],
820
+ 'standalone-price': sharedMessages['standalone-prices'],
821
+ 'business-unit': sharedMessages['business-units']
822
+ };
823
+ const message = resourceTypePluralMap[resourceType];
824
+ if (!message) {
825
+ console.warn(new UnexpectedResourceTypeError(resourceType));
826
+ return sharedMessages.unknownResourceType;
827
+ }
828
+ return message;
829
+ }
830
+
831
+ 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; }
832
+ function _objectSpread$a(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$a(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$a(Object(t))).call(_context2, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
833
+ const useUpload = () => {
834
+ const intl = reactIntl.useIntl();
835
+ const _useApplicationContex = applicationShellConnectors.useApplicationContext(context => ({
836
+ projectKey: context.project?.key
837
+ })),
838
+ projectKey = _useApplicationContex.projectKey;
839
+ const _useImportResourcesCo = useImportResourcesContext(),
840
+ state = _useImportResourcesCo.state,
841
+ actions = _useImportResourcesCo.actions;
842
+ const showNotification = actionsGlobal.useShowNotification();
843
+ const _useImportContainerUp = operations.useImportContainerUpload({
844
+ projectKey: projectKey
845
+ }),
846
+ upload = _useImportContainerUp.upload;
847
+ React__default["default"].useEffect(() => {
848
+ return () => {
849
+ if (state.abortController) state.abortController.abort();
850
+ };
851
+ }, [state.abortController]);
852
+ const isFileValid = async file => {
853
+ const errors = [];
854
+ const isDelimiterValid = await operations.validateDelimiter(file, operations.COLUMN_DELIMITERS);
855
+ if (!isDelimiterValid) errors.push({
856
+ title: intl.formatMessage(messages$4.wrongSeparatorTitle),
857
+ description: intl.formatMessage(messages$4.wrongSeparatorDescription, {
858
+ delimiterList: formatAllowedDelimitersForMessageDisplay(intl)
859
+ })
860
+ });
861
+ const rowCount = await operations.getRowCount(file);
862
+ if (rowCount < 1) errors.push({
863
+ title: intl.formatMessage(messages$4.dropAreaNotEnoughRowsTitle),
864
+ description: intl.formatMessage(messages$4.dropAreaNotEnoughRowsDescription)
865
+ });
866
+ if (state.resourceType && file.size > operations.toBytes(operations.MAX_FILE_SIZE_MB)) errors.push({
867
+ title: intl.formatMessage(messages$4.fileSizeExceededTitle),
868
+ description: intl.formatMessage(messages$4.fileSizeExceededDescription, {
869
+ fileSizeLimit: intl.formatNumber(operations.MAX_FILE_SIZE_MB)
870
+ })
871
+ });
872
+ if (state.resourceType && rowCount > operations.MAX_ROW_COUNT) errors.push({
873
+ title: intl.formatMessage(messages$4.rowLimitExceededTitle),
874
+ description: intl.formatMessage(messages$4.rowLimitExceededDescription, {
875
+ rowLimit: intl.formatNumber(operations.MAX_ROW_COUNT)
876
+ })
877
+ });
878
+ if (errors.length > 0) {
879
+ actions.setFileUploadErrors(errors);
880
+ actions.setCurrentStep(CurrentStep$1.UploadResult);
881
+ return false;
882
+ }
883
+ return true;
884
+ };
885
+ const handleUploadError = error => {
886
+ if (operations.isAbortError(error)) {
887
+ actions.cancelImport();
888
+ return;
889
+ }
890
+ if (error instanceof operations.HttpError) {
891
+ if (error.errorData?.code === 'MISSING_KEY_ERROR') {
892
+ actions.setFileUploadErrors([{
893
+ title: intl.formatMessage(messages$4.missingRequiredField),
894
+ description: intl.formatMessage(messages$4.missingKeyError)
895
+ }]);
896
+ actions.setCurrentStep(CurrentStep$1.UploadResult);
897
+ } else if (error.errorData?.code === 'MissingCsvFieldIdentifier') {
898
+ const MissingCsvFieldIdentifierError = error.errorData;
899
+ const fieldNames = operations.formatKeys(MissingCsvFieldIdentifierError.rowValue);
900
+ actions.setFileUploadErrors([{
901
+ title: intl.formatMessage(messages$4.missingRequiredField),
902
+ description: intl.formatMessage(messages$4.missingRequiredKeys, {
903
+ fieldNames
904
+ })
905
+ }]);
906
+ actions.setCurrentStep(CurrentStep$1.UploadResult);
907
+ } else if (error.errorData?.invalid > 0) {
908
+ actions.setUploadFileResponse(error.errorData);
909
+ actions.setCurrentStep(CurrentStep$1.UploadResult);
910
+ } else {
911
+ actions.cancelImport();
912
+ showNotification({
913
+ kind: 'error',
914
+ domain: constants.DOMAINS.PAGE,
915
+ text: intl.formatMessage(messages$4.unexpectedError)
916
+ });
917
+ }
918
+ } else {
919
+ actions.cancelImport();
920
+ showNotification({
921
+ kind: 'error',
922
+ domain: constants.DOMAINS.PAGE,
923
+ text: operations.isError(error) ? error.toString() : String(error)
924
+ });
925
+ sentry.reportErrorToSentry(new Error('Upload File Error: An unexpected issue occurred while uploading the file'), {
926
+ extra: {
927
+ error,
928
+ resourceType: state.resourceType,
929
+ fileSizeInBytes: state.droppedFile?.size
930
+ }
931
+ });
932
+ }
933
+ };
934
+ const handleUploadAndValidation = async () => {
935
+ if (!state.droppedFile || !state.resourceType) return;
936
+ const canUpload = await isFileValid(state.droppedFile);
937
+ if (!canUpload) return;
938
+ actions.setCurrentStep(CurrentStep$1.Uploading);
939
+ try {
940
+ const shouldApplyPublishSettings = state.resourceType === 'product';
941
+ const xhr = await upload({
942
+ file: state.droppedFile,
943
+ resourceType: state.resourceType,
944
+ settings: _objectSpread$a({
945
+ format: 'CSV',
946
+ decimalSeparator: state.settings?.decimalSeparator
947
+ }, shouldApplyPublishSettings ? {
948
+ resourceType: state.resourceType === 'product' ? 'product-draft' : state.resourceType,
949
+ options: {
950
+ publishAllChanges: state.settings?.publish ?? false
951
+ }
952
+ } : {}),
953
+ onSuccess: (fileUploadResponse, containerKey) => {
954
+ actions.setContainerKey(containerKey);
955
+ actions.setUploadFileResponse(fileUploadResponse);
956
+ actions.setCurrentStep(CurrentStep$1.UploadResult);
957
+ },
958
+ onProgress: progress => {
959
+ actions.setProgress(progress);
960
+ },
961
+ onError: handleUploadError
962
+ });
963
+ actions.setAbortController(xhr);
964
+ } catch (error) {
965
+ handleUploadError(error);
966
+ actions.setCurrentStep(CurrentStep$1.UploadResult);
967
+ }
968
+ };
969
+ return {
970
+ handleUploadAndValidation
971
+ };
972
+ };
973
+
974
+ const INITIAL_COLUMN_DISPLAY_COUNT = 8;
975
+
976
+ const PERMISSIONS = {
977
+ // Categories
978
+ ManageCategories: 'ManageCategories',
979
+ ViewCategories: 'ViewCategories',
980
+ // Products
981
+ ManageProducts: 'ManageProducts',
982
+ ViewProducts: 'ViewProducts',
983
+ // ProductTypes
984
+ ManageProductTypes: 'ManageProductTypes',
985
+ ViewProductTypes: 'ViewProductTypes',
986
+ // DiscountCodes
987
+ ManageDiscountCodes: 'ManageDiscountCodes',
988
+ ViewDiscountCodes: 'ViewDiscountCodes',
989
+ // Customers
990
+ ManageCustomers: 'ManageCustomers',
991
+ ViewCustomers: 'ViewCustomers',
992
+ // Orders
993
+ ManageOrders: 'ManageOrders',
994
+ ViewOrders: 'ViewOrders',
995
+ // KeyValueDocuments
996
+ ManageKeyValueDocuments: 'ManageKeyValueDocuments',
997
+ ViewKeyValueDocuments: 'ViewKeyValueDocuments',
998
+ // BusinessUnits
999
+ ManageBusinessUnits: 'ManageBusinessUnits',
1000
+ ViewBusinessUnits: 'ViewBusinessUnits'
1001
+ };
1002
+
1003
+ 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; }
1004
+ 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; }
1005
+ const DEFAULT_SHORT_LIVED_FLAGS = {};
1006
+ const DEFAULT_LONG_LIVED_FLAGS = {};
1007
+ _objectSpread$9(_objectSpread$9({}, DEFAULT_SHORT_LIVED_FLAGS), DEFAULT_LONG_LIVED_FLAGS);
1008
+
1009
+ const useImportPermission = () => {
1010
+ const _useApplicationContex = applicationShellConnectors.useApplicationContext(applicationContext => ({
1011
+ actionRights: applicationContext.actionRights?.products
1012
+ })),
1013
+ actionRights = _useApplicationContex.actionRights;
1014
+ const canManageProducts = permissions.useIsAuthorized({
1015
+ demandedPermissions: [PERMISSIONS.ManageProducts]
1016
+ });
1017
+ const canManageCustomers = permissions.useIsAuthorized({
1018
+ demandedPermissions: [PERMISSIONS.ManageCustomers]
1019
+ });
1020
+ const canManageOrders = permissions.useIsAuthorized({
1021
+ demandedPermissions: [PERMISSIONS.ManageOrders]
1022
+ });
1023
+ const canManageKeyValueDocuments = permissions.useIsAuthorized({
1024
+ demandedPermissions: [PERMISSIONS.ManageKeyValueDocuments]
1025
+ });
1026
+ const canMAnageCategories = permissions.useIsAuthorized({
1027
+ demandedPermissions: [PERMISSIONS.ManageCategories]
1028
+ });
1029
+ const canManageDiscountCodes = permissions.useIsAuthorized({
1030
+ demandedPermissions: [PERMISSIONS.ManageDiscountCodes]
1031
+ });
1032
+ const canManageBusinessUnits = permissions.useIsAuthorized({
1033
+ demandedPermissions: [PERMISSIONS.ManageBusinessUnits]
1034
+ });
1035
+ const canImportProducts = React.useMemo(() => {
1036
+ if (!actionRights) return false;
1037
+ const canAddPrices = actionRights.canAddPrices,
1038
+ canAddProducts = actionRights.canAddProducts,
1039
+ canEditAttributesAll = actionRights['canEditAttributes:all'],
1040
+ canEditPrices = actionRights.canEditPrices;
1041
+ return canManageProducts && canAddPrices && canAddProducts && canEditAttributesAll && canEditPrices;
1042
+ }, [canManageProducts, actionRights]);
1043
+ const canManageCustomObjects = React.useMemo(() => {
1044
+ return canManageProducts || canManageCustomers || canManageOrders || canManageKeyValueDocuments;
1045
+ }, [canManageCustomers, canManageOrders, canManageProducts, canManageKeyValueDocuments]);
1046
+ return {
1047
+ canImportProducts,
1048
+ canImportCategories: canMAnageCategories,
1049
+ canImportDiscountCodes: canManageDiscountCodes,
1050
+ canImportBusinessUnits: canManageBusinessUnits,
1051
+ canImportInventories: canManageProducts,
1052
+ canImportProductTypes: canManageProducts,
1053
+ canImportCustomObjects: canManageCustomObjects
1054
+ };
1055
+ };
1056
+
1057
+ const FileDropArea = () => {
1058
+ const intl = reactIntl.useIntl();
1059
+ const _useImportResourcesCo = useImportResourcesContext(),
1060
+ state = _useImportResourcesCo.state,
1061
+ actions = _useImportResourcesCo.actions;
1062
+ const isResourceTypeSelected = Boolean(state.resourceType);
1063
+ const showNotification = actionsGlobal.useShowNotification();
1064
+ const onDrop = React__default["default"].useCallback(_ref => {
1065
+ let _ref2 = _slicedToArray(_ref, 1),
1066
+ file = _ref2[0];
1067
+ if (!file) return;
1068
+ operations.assertResourceType(state.resourceType);
1069
+ actions.setDroppedFile(file);
1070
+ }, [state.resourceType, actions]);
1071
+ const handleDropRejected = React__default["default"].useCallback(errorType => {
1072
+ const errorMessageMap = {
1073
+ 'too-many-files': messages$5.tooManyFilesError,
1074
+ 'invalid-type': messages$5.fileFormatNotSupported,
1075
+ generic: messages$5.genericError
1076
+ };
1077
+ showNotification({
1078
+ kind: 'error',
1079
+ domain: constants.DOMAINS.PAGE,
1080
+ text: intl.formatMessage(errorMessageMap[errorType])
1081
+ });
1082
+ }, [intl, showNotification]);
1083
+ const getState = React__default["default"].useCallback(isDragActive => getDropAreaState({
1084
+ isReady: Boolean(state.droppedFile),
1085
+ hasResourceType: !state.resourceType,
1086
+ isDragActive
1087
+ }), [state.resourceType, state.droppedFile]);
1088
+ return jsxRuntime.jsx(operations.FileDropArea, {
1089
+ onDrop: onDrop,
1090
+ onDropRejected: handleDropRejected,
1091
+ disabled: !isResourceTypeSelected,
1092
+ accept: {
1093
+ 'text/csv': ['.csv']
1094
+ },
1095
+ getDropAreaState: getState,
1096
+ children: dropAreaState => getDropArea({
1097
+ dropAreaState,
1098
+ resourceType: 'category',
1099
+ isFileDropped: Boolean(state.droppedFile),
1100
+ fileName: state.droppedFile?.name,
1101
+ messages: {
1102
+ chooseFile: intl.formatMessage(messages$5.chooseFile),
1103
+ dragAndDropCSV: intl.formatMessage(messages$5.dragAndDropCSV),
1104
+ or: intl.formatMessage(messages$5.or),
1105
+ browseButton: intl.formatMessage(messages$5.browseButton)
1106
+ }
1107
+ })
1108
+ });
1109
+ };
1110
+
1111
+ const Upload = () => {
1112
+ const _useImportResourcesCo = useImportResourcesContext(),
1113
+ state = _useImportResourcesCo.state,
1114
+ onClose = _useImportResourcesCo.onClose,
1115
+ resourceTypes = _useImportResourcesCo.resourceTypes,
1116
+ actions = _useImportResourcesCo.actions;
1117
+ const intl = reactIntl.useIntl();
1118
+ const _useUpload = useUpload(),
1119
+ handleUploadAndValidation = _useUpload.handleUploadAndValidation;
1120
+ const isMultipleResourceTypes = resourceTypes.length > 1;
1121
+ const canPublishProducts = permissions.useIsAuthorized({
1122
+ demandedPermissions: ['ManageProducts'],
1123
+ demandedActionRights: [{
1124
+ group: 'products',
1125
+ name: 'PublishProducts'
1126
+ }]
1127
+ });
1128
+ return jsxRuntime.jsx(applicationComponents.FormDialog, {
1129
+ size: 16,
1130
+ isOpen: true,
1131
+ title: intl.formatMessage(sharedMessages[`modalTitle.${state.resourceType}`]),
1132
+ labelPrimary: intl.formatMessage(sharedMessages.uploadButton),
1133
+ onPrimaryButtonClick: handleUploadAndValidation,
1134
+ isPrimaryButtonDisabled: !Boolean(state.droppedFile),
1135
+ onSecondaryButtonClick: () => onClose({
1136
+ shouldDeleteImportContainer: true
1137
+ }),
1138
+ onClose: () => onClose({
1139
+ shouldDeleteImportContainer: true
1140
+ }),
1141
+ dataAttributesPrimaryButton: {
1142
+ 'data-tracking-target': `${state.resourceType}_import-upload_and_preview_button`
1143
+ },
1144
+ children: jsxRuntime.jsx(fullstory.Masking.Unmask, {
1145
+ children: jsxRuntime.jsxs(uiKit.Spacings.Stack, {
1146
+ scale: "l",
1147
+ children: [isMultipleResourceTypes ? jsxRuntime.jsxs(uiKit.Grid, {
1148
+ gridRowGap: uiKit.designTokens.spacingL,
1149
+ gridTemplateColumns: `calc(${uiKit.designTokens.constraint3} + ${uiKit.designTokens.spacingL}) auto`,
1150
+ children: [jsxRuntime.jsx(uiKit.Grid.Item, {
1151
+ children: jsxRuntime.jsx(uiKit.Text.Body, {
1152
+ isBold: true,
1153
+ intlMessage: messages$5.dataType
1154
+ })
1155
+ }), jsxRuntime.jsx(uiKit.Grid.Item, {
1156
+ children: jsxRuntime.jsx(ResourceTypeSelection, {})
1157
+ }), jsxRuntime.jsx(uiKit.Grid.Item, {
1158
+ children: jsxRuntime.jsx(uiKit.Text.Body, {
1159
+ isBold: true,
1160
+ intlMessage: messages$5.instructions
1161
+ })
1162
+ }), jsxRuntime.jsx(uiKit.Grid.Item, {
1163
+ children: jsxRuntime.jsx(Instructions, {})
1164
+ })]
1165
+ }) : jsxRuntime.jsx(jsxRuntime.Fragment, {
1166
+ children: jsxRuntime.jsx(Instructions, {})
1167
+ }), jsxRuntime.jsx(operations.InfoBox, {
1168
+ title: intl.formatMessage(messages$5.prerequisitesOfImportingData),
1169
+ description: intl.formatMessage(messages$5.keysForEveryResource, {
1170
+ link: msg => jsxRuntime.jsx(uiKit.Link, {
1171
+ tone: "secondary",
1172
+ isExternal: true,
1173
+ to: operations.CT_API_DOCS_URL,
1174
+ children: msg
1175
+ }, "link")
1176
+ })
1177
+ }), jsxRuntime.jsx(operations.UploadSeparator, {
1178
+ value: state.settings?.decimalSeparator,
1179
+ onChange: decimalSeparator => {
1180
+ actions.setUploadSettings({
1181
+ decimalSeparator
1182
+ });
1183
+ },
1184
+ separatorTitle: intl.formatMessage(messages$5.separatorTitle),
1185
+ decimalsSeparatorDescription: intl.formatMessage(messages$5.decimalsSeparatorDescription),
1186
+ decimalSeparatorPointLabel: intl.formatMessage(messages$5.decimalSeparatorPoint),
1187
+ decimalSeparatorCommaLabel: intl.formatMessage(messages$5.decimalSeparatorComma),
1188
+ decimalsLabel: intl.formatMessage(messages$5.decimals)
1189
+ }), jsxRuntime.jsx(fullstory.Masking.Mask, {
1190
+ children: jsxRuntime.jsx(FileDropArea, {})
1191
+ }), jsxRuntime.jsx(operations.UploadSettings, {
1192
+ resourceType: state.resourceType,
1193
+ isPublishChecked: state.settings?.publish,
1194
+ onPublishChange: checked => {
1195
+ actions.setUploadSettings({
1196
+ publish: checked
1197
+ });
1198
+ },
1199
+ publishProductsLabel: intl.formatMessage(messages$5.publishProducts),
1200
+ dataTrackingTarget: "product_import-publish_checkbox",
1201
+ canPublishProducts: canPublishProducts
1202
+ })]
1203
+ })
1204
+ })
1205
+ });
1206
+ };
1207
+
1208
+ var messages$3 = reactIntl.defineMessages({
1209
+ row: {
1210
+ id: 'ImportResourcesModal.row',
1211
+ description: 'In Upload file error modal - "Row" column',
1212
+ defaultMessage: 'Row'
1213
+ },
1214
+ errorType: {
1215
+ id: 'ImportResourcesModal.errorType',
1216
+ description: 'In Upload file error modal - "Error type" column',
1217
+ defaultMessage: 'Error type'
1218
+ },
1219
+ details: {
1220
+ id: 'ImportResourcesModal.details',
1221
+ description: 'In Upload file error modal - "Details" column',
1222
+ defaultMessage: 'Details'
1223
+ },
1224
+ uploadErrorDescription: {
1225
+ id: 'ImportResourcesModal.uploadErrorDescription',
1226
+ description: 'Title when errors detected while uploading file',
1227
+ defaultMessage: 'There {errorsCount, plural, one {is <b>{errorsCount}</b> error} other {are <b>{errorsCount}</b> errors}} detected while uploading the file <b>{fileName}</b>.'
1228
+ },
1229
+ supportedValuesDocumentation: {
1230
+ id: 'ImportResourcesModal.supportedValuesDocumentation',
1231
+ description: 'Link to the documentation for supported values',
1232
+ defaultMessage: '<documentationLink>View the documentation</documentationLink> for supported values.'
1233
+ },
1234
+ uploadNewFile: {
1235
+ id: 'ImportResourcesModal.uploadNewFile',
1236
+ description: 'Upload new file button',
1237
+ defaultMessage: 'Upload new file'
1238
+ }
1239
+ });
1240
+
1241
+ 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; }
1242
+ function _objectSpread$8(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$8(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$8(Object(t))).call(_context3, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
1243
+ const getColumns$1 = () => [{
1244
+ key: 'errorType',
1245
+ label: jsxRuntime.jsx(reactIntl.FormattedMessage, _objectSpread$8({}, messages$3.errorType)),
1246
+ width: 'max-content'
1247
+ }, {
1248
+ key: 'details',
1249
+ label: jsxRuntime.jsx(reactIntl.FormattedMessage, _objectSpread$8({}, messages$3.details))
1250
+ }];
1251
+ const UploadErrorTable = props => {
1252
+ var _context;
1253
+ const pagination = uiKit.usePaginationState({
1254
+ perPage: 10
1255
+ });
1256
+ const startIndex = (pagination.page.value - 1) * pagination.perPage.value;
1257
+ const endIndex = startIndex + pagination.perPage.value;
1258
+ const currentPageRows = _sliceInstanceProperty__default["default"](_context = props.rows).call(_context, startIndex, endIndex);
1259
+ const shouldShowPagination = props.rows.length > pagination.perPage.value;
1260
+ return jsxRuntime.jsxs(uiKit.Spacings.Stack, {
1261
+ scale: "l",
1262
+ children: [jsxRuntime.jsx(uiKit.DataTable, {
1263
+ verticalCellAlignment: "center",
1264
+ isCondensed: true,
1265
+ rows: currentPageRows,
1266
+ columns: getColumns$1(),
1267
+ itemRenderer: itemRenderer$1
1268
+ }), shouldShowPagination && jsxRuntime.jsx(uiKit.PageNavigator, {
1269
+ onPageChange: pagination.page.onChange,
1270
+ page: pagination.page.value,
1271
+ totalPages: Math.ceil(props.rows.length / pagination.perPage.value)
1272
+ })]
1273
+ });
1274
+ };
1275
+ function itemRenderer$1(item, column) {
1276
+ switch (column.key) {
1277
+ case 'errorType':
1278
+ return jsxRuntime.jsx(uiKit.Stamp, {
1279
+ isCondensed: true,
1280
+ label: item.title,
1281
+ tone: "critical"
1282
+ });
1283
+ case 'details':
1284
+ return jsxRuntime.jsx(uiKit.Text.Body, {
1285
+ children: item.description
1286
+ });
1287
+ default:
1288
+ throw new operations.UnexpectedColumnError(column.key);
1289
+ }
1290
+ }
1291
+
1292
+ 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; }
1293
+ 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; }
1294
+ const UploadErrorsModal = () => {
1295
+ const intl = reactIntl.useIntl();
1296
+ const _useImportResourcesCo = useImportResourcesContext(),
1297
+ state = _useImportResourcesCo.state,
1298
+ actions = _useImportResourcesCo.actions,
1299
+ onClose = _useImportResourcesCo.onClose;
1300
+ const errorsCount = state.fileUploadErrors.length;
1301
+ return jsxRuntime.jsx(applicationComponents.InfoDialog, {
1302
+ size: 16,
1303
+ isOpen: true,
1304
+ title: intl.formatMessage(sharedMessages[`modalTitle.${state.resourceType}`]),
1305
+ onClose: () => onClose(),
1306
+ children: jsxRuntime.jsx(fullstory.Masking.Unmask, {
1307
+ children: jsxRuntime.jsxs(uiKit.Spacings.Stack, {
1308
+ scale: "l",
1309
+ children: [jsxRuntime.jsx(fullstory.Masking.Mask, {
1310
+ children: jsxRuntime.jsx(uiKit.Text.Body, {
1311
+ intlMessage: _objectSpread$7(_objectSpread$7({}, messages$3.uploadErrorDescription), {}, {
1312
+ values: {
1313
+ fileName: state.droppedFile?.name,
1314
+ errorsCount: intl.formatNumber(errorsCount),
1315
+ b: getBold$3
1316
+ }
1317
+ })
1318
+ })
1319
+ }), jsxRuntime.jsx(UploadErrorTable, {
1320
+ rows: operations.mapFileUploadErrorsToUploadFileErrorRows(state.fileUploadErrors)
1321
+ }), jsxRuntime.jsxs(uiKit.Spacings.Inline, {
1322
+ scale: "m",
1323
+ justifyContent: "flex-end",
1324
+ children: [jsxRuntime.jsx(uiKit.SecondaryButton, {
1325
+ label: intl.formatMessage(sharedMessages.close),
1326
+ onClick: () => onClose()
1327
+ }), jsxRuntime.jsx(uiKit.PrimaryButton, {
1328
+ iconLeft: jsxRuntime.jsx(uiKit.ImportIcon, {}),
1329
+ label: intl.formatMessage(messages$3.uploadNewFile),
1330
+ onClick: () => actions.uploadNewFile()
1331
+ })]
1332
+ })]
1333
+ })
1334
+ })
1335
+ });
1336
+ };
1337
+ function getBold$3(msg) {
1338
+ return jsxRuntime.jsx(uiKit.Text.Body, {
1339
+ as: "span",
1340
+ isBold: true,
1341
+ children: msg
1342
+ }, crypto.randomUUID());
1343
+ }
1344
+
1345
+ 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; }
1346
+ function _objectSpread$6(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$6(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$6(Object(t))).call(_context3, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
1347
+ const getColumns = () => [{
1348
+ key: 'row',
1349
+ label: jsxRuntime.jsx(reactIntl.FormattedMessage, _objectSpread$6({}, messages$3.row)),
1350
+ width: 'max-content'
1351
+ }, {
1352
+ key: 'errorType',
1353
+ label: jsxRuntime.jsx(reactIntl.FormattedMessage, _objectSpread$6({}, messages$3.errorType)),
1354
+ width: 'max-content'
1355
+ }, {
1356
+ key: 'details',
1357
+ label: jsxRuntime.jsx(reactIntl.FormattedMessage, _objectSpread$6({}, messages$3.details))
1358
+ }];
1359
+ const UploadRowErrorTable = props => {
1360
+ var _context;
1361
+ const pagination = uiKit.usePaginationState({
1362
+ perPage: 10
1363
+ });
1364
+ const startIndex = (pagination.page.value - 1) * pagination.perPage.value;
1365
+ const endIndex = startIndex + pagination.perPage.value;
1366
+ const currentPageRows = _sliceInstanceProperty__default["default"](_context = props.rows).call(_context, startIndex, endIndex);
1367
+ const shouldShowPagination = props.rows.length > pagination.perPage.value;
1368
+ return jsxRuntime.jsxs(uiKit.Spacings.Stack, {
1369
+ scale: "l",
1370
+ children: [jsxRuntime.jsx(uiKit.DataTable, {
1371
+ verticalCellAlignment: "center",
1372
+ isCondensed: true,
1373
+ rows: currentPageRows,
1374
+ columns: getColumns(),
1375
+ itemRenderer: itemRenderer
1376
+ }), shouldShowPagination && jsxRuntime.jsx(uiKit.PageNavigator, {
1377
+ onPageChange: pagination.page.onChange,
1378
+ page: pagination.page.value,
1379
+ totalPages: Math.ceil(props.rows.length / pagination.perPage.value)
1380
+ })]
1381
+ });
1382
+ };
1383
+ function itemRenderer(item, column) {
1384
+ switch (column.key) {
1385
+ case 'row':
1386
+ return item.row;
1387
+ case 'errorType':
1388
+ return jsxRuntime.jsx(uiKit.Stamp, {
1389
+ isCondensed: true,
1390
+ label: operations.formatErrorCode(item.code),
1391
+ tone: "critical"
1392
+ });
1393
+ case 'details':
1394
+ return jsxRuntime.jsxs(uiKit.Spacings.Inline, {
1395
+ scale: "xs",
1396
+ children: [jsxRuntime.jsx(uiKit.Text.Body, {
1397
+ tone: "information",
1398
+ children: item.field
1399
+ }), jsxRuntime.jsx(uiKit.Text.Body, {
1400
+ children: operations.extractErrorDescriptionFromValidationMessage(item.validationMessage)
1401
+ })]
1402
+ });
1403
+ default:
1404
+ throw new operations.UnexpectedColumnError(column.key);
1405
+ }
1406
+ }
1407
+
1408
+ 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; }
1409
+ function _objectSpread$5(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$5(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$5(Object(t))).call(_context2, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
1410
+ const UploadRowErrorsModal = () => {
1411
+ const intl = reactIntl.useIntl();
1412
+ const _useImportResourcesCo = useImportResourcesContext(),
1413
+ state = _useImportResourcesCo.state,
1414
+ actions = _useImportResourcesCo.actions,
1415
+ onClose = _useImportResourcesCo.onClose;
1416
+ const errorsCount = operations.getFileUploadErrorsCount(state.uploadFileResponse?.results);
1417
+ const documentationLink = operations.RESOURCE_TYPE_DOCUMENTATION_LINKS[state.resourceType];
1418
+ return jsxRuntime.jsx(applicationComponents.InfoDialog, {
1419
+ size: 16,
1420
+ isOpen: true,
1421
+ title: intl.formatMessage(sharedMessages[`modalTitle.${state.resourceType}`]),
1422
+ onClose: onClose,
1423
+ children: jsxRuntime.jsx(fullstory.Masking.Unmask, {
1424
+ children: jsxRuntime.jsxs(uiKit.Spacings.Stack, {
1425
+ scale: "l",
1426
+ children: [jsxRuntime.jsxs(uiKit.Spacings.Stack, {
1427
+ scale: "xs",
1428
+ children: [jsxRuntime.jsx(fullstory.Masking.Mask, {
1429
+ children: jsxRuntime.jsx(uiKit.Text.Body, {
1430
+ intlMessage: _objectSpread$5(_objectSpread$5({}, messages$3.uploadErrorDescription), {}, {
1431
+ values: {
1432
+ fileName: state.droppedFile?.name,
1433
+ errorsCount: intl.formatNumber(errorsCount),
1434
+ b: getBold$2
1435
+ }
1436
+ })
1437
+ })
1438
+ }), jsxRuntime.jsx(uiKit.Text.Body, {
1439
+ intlMessage: _objectSpread$5(_objectSpread$5({}, messages$3.supportedValuesDocumentation), {}, {
1440
+ values: {
1441
+ documentationLink: msg => jsxRuntime.jsx(uiKit.Link, {
1442
+ tone: "secondary",
1443
+ isExternal: true,
1444
+ to: documentationLink,
1445
+ children: msg
1446
+ }, "documentationLink")
1447
+ }
1448
+ })
1449
+ })]
1450
+ }), jsxRuntime.jsx(UploadRowErrorTable, {
1451
+ rows: operations.mapUploadFileErrorsResponseToUploadFileErrorRows(state.uploadFileResponse?.results)
1452
+ }), jsxRuntime.jsxs(uiKit.Spacings.Inline, {
1453
+ scale: "m",
1454
+ justifyContent: "flex-end",
1455
+ children: [jsxRuntime.jsx(uiKit.SecondaryButton, {
1456
+ label: intl.formatMessage(sharedMessages.close),
1457
+ onClick: () => onClose()
1458
+ }), jsxRuntime.jsx(uiKit.PrimaryButton, {
1459
+ iconLeft: jsxRuntime.jsx(uiKit.ImportIcon, {}),
1460
+ label: intl.formatMessage(messages$3.uploadNewFile),
1461
+ onClick: () => actions.uploadNewFile()
1462
+ })]
1463
+ })]
1464
+ })
1465
+ })
1466
+ });
1467
+ };
1468
+ function getBold$2(msg) {
1469
+ return jsxRuntime.jsx(uiKit.Text.Body, {
1470
+ as: "span",
1471
+ isBold: true,
1472
+ children: msg
1473
+ }, crypto.randomUUID());
1474
+ }
1475
+
1476
+ var messages$2 = reactIntl.defineMessages({
1477
+ startImportButton: {
1478
+ id: 'ImportResourcesModal.startImportButton',
1479
+ description: 'Label for the modal Start import button',
1480
+ defaultMessage: 'Start import'
1481
+ },
1482
+ importNotificationSuccessMessage: {
1483
+ id: 'ImportResourcesModal.successMessage',
1484
+ description: 'Notification success message',
1485
+ defaultMessage: '<b>Your import has started.</b><newline></newline> <logsLink>Go to Import logs</logsLink> to view the progress.'
1486
+ },
1487
+ importNotificationPrepareMessage: {
1488
+ id: 'ImportResourcesModal.prepareMessage',
1489
+ description: 'Notification for preparing import',
1490
+ defaultMessage: '<b>Prepare import</b><newline></newline>Once preparation is complete, you can track the import progress <logsLink>in the Import logs</logsLink>.'
1491
+ },
1492
+ previewOfYourImport: {
1493
+ id: 'ImportResourcesModal.previewOfYourImport',
1494
+ description: 'Label for modal path',
1495
+ defaultMessage: "Here's a preview of your import"
1496
+ },
1497
+ itemsToBeImported: {
1498
+ id: 'ImportResourcesModal.itemsToBeImported',
1499
+ description: 'This message indicates the number of items that are ready to be imported into the project.',
1500
+ defaultMessage: '{itemCount, plural, one {<b>1</b> {resourceType} to be imported{publish, select, true { and published} other {}}} other {<b>{itemCount}</b> {resourceTypePlural} to be imported{publish, select, true { and published} other {}}}}'
1501
+ },
1502
+ columnsToBeImported: {
1503
+ id: 'ImportResourcesModal.columnsToBeImported',
1504
+ description: 'This message indicates the number of columns that are ready to be imported into the system.',
1505
+ defaultMessage: '<b>{columnCount}</b> columns to be imported'
1506
+ },
1507
+ columnsToBeIgnored: {
1508
+ id: 'ImportResourcesModal.columnsToBeIgnored',
1509
+ description: "This message indicates the number of columns that will be deliberately skipped during the import because they can't be imported",
1510
+ defaultMessage: "We will intentionally ignore <b>{columnCount}</b> columns as they can't be imported"
1511
+ },
1512
+ showMore: {
1513
+ id: 'ImportResourcesModal.showMore',
1514
+ description: 'A button label for expanding the import preview to show more details.',
1515
+ defaultMessage: 'Show more'
1516
+ },
1517
+ showLess: {
1518
+ id: 'ImportResourcesModal.showLess',
1519
+ description: 'A button label for collapsing the import preview to show fewer details.',
1520
+ defaultMessage: 'Show less'
1521
+ },
1522
+ continue: {
1523
+ id: 'ImportResourcesModal.continue',
1524
+ description: 'Confirmation dialog continue button',
1525
+ defaultMessage: 'Continue'
1526
+ },
1527
+ confirmationBodyText: {
1528
+ id: 'ImportResourcesModal.confirmationBodyText',
1529
+ description: 'Confirmation dialog text',
1530
+ defaultMessage: 'You are about to import {count, plural, one {<bold>1</bold> row} other {<bold>{count}</bold> rows}} in the project: <bold>{projectName}</bold>.'
1531
+ },
1532
+ confirmationBodyNote: {
1533
+ id: 'ImportResourcesModal.confirmationBodyNote',
1534
+ description: 'Confirmation dialog text',
1535
+ defaultMessage: 'Please be aware that existing values with the same keys will be overwritten by the data included in the CSV.'
1536
+ },
1537
+ confirmationBodyQuestion: {
1538
+ id: 'ImportResourcesModal.confirmationBodyQuestion',
1539
+ description: 'Confirmation question',
1540
+ defaultMessage: 'Proceed with the import?'
1541
+ }
1542
+ });
1543
+
1544
+ 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; }
1545
+ function _objectSpread$4(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$4(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$4(Object(t))).call(_context3, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
1546
+ const AlignedContainer = /*#__PURE__*/_styled__default["default"]("div", {
1547
+ target: "e1amawj91"
1548
+ } )({
1549
+ name: "1x0d6yz",
1550
+ styles: "padding-top:5px"
1551
+ } );
1552
+ const ModifiedTagList = /*#__PURE__*/_styled__default["default"](uiKit.TagList, {
1553
+ target: "e1amawj90"
1554
+ } )({
1555
+ name: "u9abxe",
1556
+ styles: ">div{margin:8px 8px 0 0;}"
1557
+ } );
1558
+ const ColumnList = props => {
1559
+ var _context;
1560
+ const _React$useState = React__default["default"].useState(false),
1561
+ _React$useState2 = _slicedToArray(_React$useState, 2),
1562
+ isExpanded = _React$useState2[0],
1563
+ setIsExpanded = _React$useState2[1];
1564
+ const shouldShowExpandButton = props.columns.length > INITIAL_COLUMN_DISPLAY_COUNT;
1565
+ const finalColumns = isExpanded ? props.columns : _sliceInstanceProperty__default["default"](_context = props.columns).call(_context, 0, INITIAL_COLUMN_DISPLAY_COUNT);
1566
+ return jsxRuntime.jsxs(ModifiedTagList, {
1567
+ children: [_mapInstanceProperty__default["default"](finalColumns).call(finalColumns, (column, index) => jsxRuntime.jsx(uiKit.Stamp, {
1568
+ label: column,
1569
+ tone: "secondary"
1570
+ }, index)), shouldShowExpandButton && jsxRuntime.jsx(AlignedContainer, {
1571
+ children: jsxRuntime.jsx(uiKit.Link, {
1572
+ to: "",
1573
+ tone: "secondary",
1574
+ onClick: e => {
1575
+ e.preventDefault();
1576
+ setIsExpanded(!isExpanded);
1577
+ },
1578
+ children: isExpanded ? jsxRuntime.jsx(reactIntl.FormattedMessage, _objectSpread$4({}, messages$2.showLess)) : jsxRuntime.jsx(reactIntl.FormattedMessage, _objectSpread$4({}, messages$2.showMore))
1579
+ })
1580
+ })]
1581
+ });
1582
+ };
1583
+
1584
+ 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; }
1585
+ function _objectSpread$3(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$3(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$3(Object(t))).call(_context2, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
1586
+ function UploadPreviewModal() {
1587
+ const _useImportResourcesCo = useImportResourcesContext(),
1588
+ state = _useImportResourcesCo.state;
1589
+ const intl = reactIntl.useIntl();
1590
+ const _useImportResourcesCo2 = useImportResourcesContext(),
1591
+ actions = _useImportResourcesCo2.actions,
1592
+ onClose = _useImportResourcesCo2.onClose;
1593
+ if (!state.resourceType || !state.uploadFileResponse) return null;
1594
+ const resourceTypeMessage = resourceTypeToMessage(state.resourceType);
1595
+ const resourceType = intl.formatMessage(resourceTypeMessage).toLowerCase();
1596
+ const resourceTypePluralMessage = resourceTypeToPluralMessage(state.resourceType);
1597
+ const resourceTypePlural = intl.formatMessage(resourceTypePluralMessage).toLowerCase();
1598
+ const ignoredColumns = state.uploadFileResponse.ignoredColumns;
1599
+ const validatedColumns = operations.getValidatedColumns(state.uploadFileResponse.columns, ignoredColumns);
1600
+ return jsxRuntime.jsx(applicationComponents.FormDialog, {
1601
+ size: 16,
1602
+ isOpen: true,
1603
+ title: intl.formatMessage(sharedMessages[`modalTitle.${state.resourceType}`]),
1604
+ labelPrimary: intl.formatMessage(messages$2.continue),
1605
+ onSecondaryButtonClick: () => onClose({
1606
+ shouldDeleteImportContainer: true
1607
+ }),
1608
+ onPrimaryButtonClick: () => {
1609
+ actions.setCurrentStep(CurrentStep$1.ImportConfirmationModal);
1610
+ },
1611
+ onClose: () => onClose({
1612
+ shouldDeleteImportContainer: true
1613
+ }),
1614
+ children: jsxRuntime.jsx(fullstory.Masking.Unmask, {
1615
+ children: jsxRuntime.jsx(applicationComponents.PageContentNarrow, {
1616
+ children: jsxRuntime.jsx(uiKit.Spacings.Stack, {
1617
+ scale: "xxxl",
1618
+ children: jsxRuntime.jsx(uiKit.Spacings.Stack, {
1619
+ scale: "xl",
1620
+ children: jsxRuntime.jsxs(uiKit.Spacings.Stack, {
1621
+ scale: "m",
1622
+ children: [jsxRuntime.jsx("div", {}), jsxRuntime.jsx(uiKit.Text.Body, {
1623
+ intlMessage: messages$2.previewOfYourImport
1624
+ }), jsxRuntime.jsx(uiKit.Card, {
1625
+ insetScale: "xl",
1626
+ children: jsxRuntime.jsxs(uiKit.Spacings.Stack, {
1627
+ scale: "s",
1628
+ children: [jsxRuntime.jsxs(uiKit.Spacings.Stack, {
1629
+ scale: "xs",
1630
+ children: [jsxRuntime.jsxs(uiKit.Spacings.Inline, {
1631
+ alignItems: "center",
1632
+ children: [jsxRuntime.jsx(uiKit.CheckBoldIcon, {
1633
+ color: "success"
1634
+ }), jsxRuntime.jsx(uiKit.Text.Body, {
1635
+ intlMessage: _objectSpread$3(_objectSpread$3({}, messages$2.itemsToBeImported), {}, {
1636
+ values: {
1637
+ resourceType,
1638
+ resourceTypePlural,
1639
+ itemCount: intl.formatNumber(state.uploadFileResponse.itemsCount),
1640
+ publish: state.resourceType === 'product' && state.settings?.publish,
1641
+ b: getBold$1
1642
+ }
1643
+ })
1644
+ })]
1645
+ }), jsxRuntime.jsxs(uiKit.Spacings.Inline, {
1646
+ alignItems: "center",
1647
+ children: [jsxRuntime.jsx(uiKit.CheckBoldIcon, {
1648
+ color: "success"
1649
+ }), jsxRuntime.jsx(uiKit.Text.Body, {
1650
+ intlMessage: _objectSpread$3(_objectSpread$3({}, messages$2.columnsToBeImported), {}, {
1651
+ values: {
1652
+ columnCount: intl.formatNumber(validatedColumns.length),
1653
+ b: getBold$1
1654
+ }
1655
+ })
1656
+ })]
1657
+ })]
1658
+ }), jsxRuntime.jsx(ColumnList, {
1659
+ columns: validatedColumns
1660
+ })]
1661
+ })
1662
+ }), ignoredColumns.length > 0 && jsxRuntime.jsx(uiKit.Card, {
1663
+ insetScale: "xl",
1664
+ children: jsxRuntime.jsxs(uiKit.Spacings.Stack, {
1665
+ scale: "s",
1666
+ children: [jsxRuntime.jsxs(uiKit.Spacings.Inline, {
1667
+ alignItems: "center",
1668
+ children: [jsxRuntime.jsx(uiKit.EyeCrossedIcon, {
1669
+ color: "neutral60"
1670
+ }), jsxRuntime.jsx(uiKit.Text.Body, {
1671
+ intlMessage: _objectSpread$3(_objectSpread$3({}, messages$2.columnsToBeIgnored), {}, {
1672
+ values: {
1673
+ columnCount: intl.formatNumber(ignoredColumns.length),
1674
+ b: getBold$1
1675
+ }
1676
+ })
1677
+ })]
1678
+ }), jsxRuntime.jsx(ColumnList, {
1679
+ columns: ignoredColumns
1680
+ })]
1681
+ })
1682
+ })]
1683
+ })
1684
+ })
1685
+ })
1686
+ })
1687
+ })
1688
+ });
1689
+ }
1690
+ function getBold$1(msg) {
1691
+ return jsxRuntime.jsx(uiKit.Text.Body, {
1692
+ as: "span",
1693
+ isBold: true,
1694
+ children: msg
1695
+ }, crypto.randomUUID());
1696
+ }
1697
+
1698
+ 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; }
1699
+ 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; }
1700
+ const getNewLine = () => jsxRuntime.jsx("br", {}, "break");
1701
+ const getImportLogsLink = (msg, projectKey) => jsxRuntime.jsx(uiKit.Link, {
1702
+ to: `/${projectKey}/operations/import/logs`,
1703
+ children: msg
1704
+ }, "link");
1705
+ var _ref2 = {
1706
+ name: "1vs9i7r",
1707
+ styles: "width:360px"
1708
+ } ;
1709
+ const ImportRunningTextNotification = props => jsxRuntime.jsx("div", {
1710
+ css: _ref2,
1711
+ children: jsxRuntime.jsx(uiKit.Text.Body, {
1712
+ intlMessage: _objectSpread$2(_objectSpread$2({}, messages$2.importNotificationSuccessMessage), {}, {
1713
+ values: {
1714
+ newline: getNewLine,
1715
+ logsLink: msg => getImportLogsLink(msg, props.projectKey),
1716
+ b: getBold
1717
+ }
1718
+ })
1719
+ })
1720
+ });
1721
+ var _ref = {
1722
+ name: "1vs9i7r",
1723
+ styles: "width:360px"
1724
+ } ;
1725
+ const ImportPreparingTextNotification = props => jsxRuntime.jsx("div", {
1726
+ css: _ref,
1727
+ children: jsxRuntime.jsx(uiKit.Text.Body, {
1728
+ intlMessage: _objectSpread$2(_objectSpread$2({}, messages$2.importNotificationPrepareMessage), {}, {
1729
+ values: {
1730
+ newline: getNewLine,
1731
+ logsLink: msg => getImportLogsLink(msg, props.projectKey),
1732
+ b: getBold
1733
+ }
1734
+ })
1735
+ })
1736
+ });
1737
+ const ImportConfirmationModal = () => {
1738
+ const intl = reactIntl.useIntl();
1739
+ const _useImportResourcesCo = useImportResourcesContext(),
1740
+ state = _useImportResourcesCo.state,
1741
+ onStartImportSuccess = _useImportResourcesCo.onStartImportSuccess,
1742
+ onClose = _useImportResourcesCo.onClose;
1743
+ const _useApplicationContex = applicationShellConnectors.useApplicationContext(context => ({
1744
+ projectKey: context.project?.key,
1745
+ projectName: context.project?.name
1746
+ })),
1747
+ projectKey = _useApplicationContex.projectKey,
1748
+ projectName = _useApplicationContex.projectName;
1749
+ const showNotification = actionsGlobal.useShowNotification();
1750
+ return jsxRuntime.jsx(applicationComponents.ConfirmationDialog, {
1751
+ title: intl.formatMessage(sharedMessages[`modalTitle.${state.resourceType}`]),
1752
+ labelPrimary: intl.formatMessage(messages$2.startImportButton),
1753
+ isOpen: true,
1754
+ onClose: () => onClose({
1755
+ shouldDeleteImportContainer: true
1756
+ }),
1757
+ onCancel: () => onClose({
1758
+ shouldDeleteImportContainer: true
1759
+ }),
1760
+ dataAttributesPrimaryButton: {
1761
+ 'data-test-id': 'confirmation-dialog-confirm'
1762
+ },
1763
+ dataAttributesSecondaryButton: {
1764
+ 'data-test-id': 'confirmation-dialog-cancel',
1765
+ 'data-tracking-target': `${state.resourceType}_import-start_import_button`
1766
+ },
1767
+ onConfirm: async () => {
1768
+ try {
1769
+ const canConfirm = projectKey && state.containerKey && state.droppedFile?.name && state.resourceType;
1770
+ if (!canConfirm) return;
1771
+ onClose();
1772
+ showNotification({
1773
+ kind: 'info',
1774
+ domain: constants.DOMAINS.SIDE,
1775
+ // @ts-ignore
1776
+ text: jsxRuntime.jsx(ImportPreparingTextNotification, {
1777
+ projectKey: projectKey
1778
+ })
1779
+ }, {
1780
+ dismissAfter: 5000
1781
+ });
1782
+ await operations.processUploadedFile({
1783
+ projectKey,
1784
+ importContainerKey: state.containerKey,
1785
+ resourceType: state.resourceType
1786
+ });
1787
+ onStartImportSuccess();
1788
+ showNotification({
1789
+ kind: 'info',
1790
+ domain: constants.DOMAINS.SIDE,
1791
+ // @ts-ignore
1792
+ text: jsxRuntime.jsx(ImportRunningTextNotification, {
1793
+ projectKey: projectKey
1794
+ })
1795
+ }, {
1796
+ dismissAfter: 5000
1797
+ });
1798
+ } catch (error) {
1799
+ onClose({
1800
+ shouldDeleteImportContainer: true
1801
+ });
1802
+ showNotification({
1803
+ kind: 'error',
1804
+ domain: constants.DOMAINS.PAGE,
1805
+ text: operations.isError(error) ? error.toString() : String(error)
1806
+ });
1807
+ }
1808
+ },
1809
+ size: 16,
1810
+ children: jsxRuntime.jsx(fullstory.Masking.Unmask, {
1811
+ children: jsxRuntime.jsxs(uiKit.Spacings.Stack, {
1812
+ scale: "xl",
1813
+ children: [jsxRuntime.jsxs("div", {
1814
+ children: [jsxRuntime.jsx(uiKit.Text.Body, {
1815
+ intlMessage: _objectSpread$2(_objectSpread$2({}, messages$2.confirmationBodyText), {}, {
1816
+ values: {
1817
+ projectName: projectName,
1818
+ count: intl.formatNumber(state?.uploadFileResponse?.rowsCount || 0),
1819
+ bold: getBold
1820
+ }
1821
+ })
1822
+ }), jsxRuntime.jsx(uiKit.Text.Body, {
1823
+ intlMessage: messages$2.confirmationBodyNote
1824
+ })]
1825
+ }), jsxRuntime.jsx(uiKit.Text.Body, {
1826
+ intlMessage: messages$2.confirmationBodyQuestion
1827
+ })]
1828
+ })
1829
+ })
1830
+ });
1831
+ };
1832
+ function getBold(msg) {
1833
+ return jsxRuntime.jsx(uiKit.Text.Body, {
1834
+ as: "span",
1835
+ isBold: true,
1836
+ children: msg
1837
+ }, crypto.randomUUID());
1838
+ }
1839
+
1840
+ const UploadResult = () => {
1841
+ const _useImportResourcesCo = useImportResourcesContext(),
1842
+ state = _useImportResourcesCo.state;
1843
+ if (state.fileUploadErrors.length > 0) return jsxRuntime.jsx(UploadErrorsModal, {});
1844
+ if (state.uploadFileResponse?.invalid > 0) return jsxRuntime.jsx(UploadRowErrorsModal, {});
1845
+ return jsxRuntime.jsx(UploadPreviewModal, {});
1846
+ };
1847
+
1848
+ const Uploading = () => {
1849
+ const intl = reactIntl.useIntl();
1850
+ const _useImportResourcesCo = useImportResourcesContext(),
1851
+ state = _useImportResourcesCo.state,
1852
+ actions = _useImportResourcesCo.actions,
1853
+ onClose = _useImportResourcesCo.onClose;
1854
+ if (!state.droppedFile?.name) return null;
1855
+ return jsxRuntime.jsx(operations.UploadingModal, {
1856
+ isOpen: true,
1857
+ title: intl.formatMessage(sharedMessages[`modalTitle.${state.resourceType}`]),
1858
+ fileName: state.droppedFile.name,
1859
+ fileSize: state.droppedFile.size,
1860
+ progress: state.progress,
1861
+ cancelLabel: intl.formatMessage(sharedMessages.cancel),
1862
+ onCancel: () => {
1863
+ actions.setCurrentStep(CurrentStep$1.Upload);
1864
+ state.abortController.abort();
1865
+ },
1866
+ onClose: () => onClose({
1867
+ shouldDeleteImportContainer: true
1868
+ })
1869
+ });
1870
+ };
1871
+
1872
+ const CurrentStep = () => {
1873
+ const _useImportResourcesCo = useImportResourcesContext(),
1874
+ state = _useImportResourcesCo.state;
1875
+ const steps = {
1876
+ upload: jsxRuntime.jsx(Upload, {}),
1877
+ uploading: jsxRuntime.jsx(Uploading, {}),
1878
+ 'upload-result': jsxRuntime.jsx(UploadResult, {}),
1879
+ 'import-confirmation-modal': jsxRuntime.jsx(ImportConfirmationModal, {})
1880
+ };
1881
+ return steps[state.currentStep] || null;
1882
+ };
1883
+
1884
+ var messages$1 = reactIntl.defineMessages({
1885
+ products: {
1886
+ id: 'ImportResourcesModal.radio.products',
1887
+ description: 'Label for the products radio button',
1888
+ defaultMessage: 'Products (including variants, assets, prices and images)'
1889
+ },
1890
+ inventories: {
1891
+ id: 'ImportResourcesModal.radio.inventories',
1892
+ description: 'Label for the inventories radio button',
1893
+ defaultMessage: 'Inventories'
1894
+ },
1895
+ categories: {
1896
+ id: 'ImportResourcesModal.radio.categories',
1897
+ description: 'Label for the categories radio button',
1898
+ defaultMessage: 'Categories'
1899
+ }
1900
+ });
1901
+
1902
+ const resourceTypeToDisplayName = resourceType => {
1903
+ switch (resourceType) {
1904
+ case IMPORTABLE_RESOURCES.PRODUCT:
1905
+ return messages$1.products;
1906
+ case IMPORTABLE_RESOURCES.INVENTORY:
1907
+ return messages$1.inventories;
1908
+ case IMPORTABLE_RESOURCES.CATEGORY:
1909
+ return messages$1.categories;
1910
+ default:
1911
+ throw new Error(`Unknown resource type: ${resourceType}`);
1912
+ }
1913
+ };
1914
+ const ResourceTypeSelection = () => {
1915
+ const _useImportResourcesCo = useImportResourcesContext(),
1916
+ state = _useImportResourcesCo.state,
1917
+ actions = _useImportResourcesCo.actions,
1918
+ resourceTypes = _useImportResourcesCo.resourceTypes;
1919
+ return jsxRuntime.jsx(uiKit.RadioInput.Group, {
1920
+ value: state.resourceType,
1921
+ onChange: e => {
1922
+ actions.setResourceType(e.target.value);
1923
+ },
1924
+ direction: "stack",
1925
+ directionProps: {
1926
+ scale: 's'
1927
+ },
1928
+ children: _mapInstanceProperty__default["default"](resourceTypes).call(resourceTypes, resourceType => jsxRuntime.jsx(uiKit.RadioInput.Option, {
1929
+ value: resourceType,
1930
+ children: jsxRuntime.jsx(uiKit.Text.Body, {
1931
+ intlMessage: resourceTypeToDisplayName(resourceType)
1932
+ })
1933
+ }, resourceType))
1934
+ });
1935
+ };
1936
+
1937
+ var messages = reactIntl.defineMessages({
1938
+ fileUploadInstructions: {
1939
+ id: 'ImportResourcesModal.fileUploadInstructions',
1940
+ description: 'Label for the modal category description',
1941
+ 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>.'
1942
+ }
1943
+ });
1944
+
1945
+ 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; }
1946
+ 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; }
1947
+ const Instructions = () => {
1948
+ const intl = reactIntl.useIntl();
1949
+ const _useImportResourcesCo = useImportResourcesContext(),
1950
+ state = _useImportResourcesCo.state;
1951
+ const templateLink = operations.RESOURCE_TYPE_TEMPLATE_DOWNLOAD_LINKS[state.resourceType];
1952
+ const documentationLink = operations.RESOURCE_TYPE_DOCUMENTATION_LINKS[state.resourceType];
1953
+ return jsxRuntime.jsx(uiKit.Text.Body, {
1954
+ intlMessage: _objectSpread$1(_objectSpread$1({}, messages.fileUploadInstructions), {}, {
1955
+ values: {
1956
+ fileSize: intl.formatNumber(operations.MAX_FILE_SIZE_MB),
1957
+ rowLimit: intl.formatNumber(operations.MAX_ROW_COUNT),
1958
+ csvTemplateLink: msg => jsxRuntime.jsx(uiKit.Link, {
1959
+ tone: "secondary",
1960
+ isExternal: true,
1961
+ to: templateLink,
1962
+ children: msg
1963
+ }, "csvTemplateLink"),
1964
+ documentationLink: msg => jsxRuntime.jsx(uiKit.Link, {
1965
+ tone: "secondary",
1966
+ isExternal: true,
1967
+ to: documentationLink,
1968
+ children: msg
1969
+ }, "documentationLink")
1970
+ }
1971
+ })
1972
+ });
1973
+ };
1974
+
1975
+ const getChunkImport = locale => {
1976
+ const intlLocale = i18n.mapLocaleToIntlLocale(locale);
1977
+ switch (intlLocale) {
1978
+ case 'de':
1979
+ return Promise.resolve().then(function () { return require('./de-3cd0305d.cjs.prod.js'); });
1980
+ case 'es':
1981
+ return Promise.resolve().then(function () { return require('./es-030fcde4.cjs.prod.js'); });
1982
+ case 'fr-FR':
1983
+ return Promise.resolve().then(function () { return require('./fr-FR-c66b401e.cjs.prod.js'); });
1984
+ case 'ja':
1985
+ return Promise.resolve().then(function () { return require('./ja-37632763.cjs.prod.js'); });
1986
+ case 'pt-BR':
1987
+ return Promise.resolve().then(function () { return require('./pt-BR-36893abd.cjs.prod.js'); });
1988
+ default:
1989
+ return Promise.resolve().then(function () { return require('./en-7d070d59.cjs.prod.js'); });
1990
+ }
1991
+ };
1992
+ const loadMessages = async locale => {
1993
+ try {
1994
+ const chunkImport = await getChunkImport(locale);
1995
+ return i18n.parseChunkImport(chunkImport);
1996
+ } catch (error) {
1997
+ // eslint-disable-next-line no-console
1998
+ console.warn(`Something went wrong while loading the import-resources-modal messages for ${locale}`, error);
1999
+ sentry.reportErrorToSentry(new Error(`Something went wrong while loading the import-resources-modal messages for ${locale}`), {
2000
+ extra: error
2001
+ });
2002
+ return {};
2003
+ }
2004
+ };
2005
+
2006
+ const useAsyncIntlMessages = (locale, loader) => {
2007
+ const _useState = React.useState({
2008
+ isLoading: true,
2009
+ messages: undefined,
2010
+ error: undefined
2011
+ }),
2012
+ _useState2 = _slicedToArray(_useState, 2),
2013
+ state = _useState2[0],
2014
+ setState = _useState2[1];
2015
+ React.useEffect(() => {
2016
+ let _isUnmounting = false;
2017
+ async function load() {
2018
+ try {
2019
+ if (!_isUnmounting) {
2020
+ const messages = await loader(locale);
2021
+ setState({
2022
+ isLoading: false,
2023
+ messages
2024
+ });
2025
+ }
2026
+ } catch (error) {
2027
+ setState({
2028
+ isLoading: false,
2029
+ error
2030
+ });
2031
+ }
2032
+ }
2033
+ if (locale) load();
2034
+ return () => {
2035
+ _isUnmounting = true;
2036
+ };
2037
+ }, [locale, loader]);
2038
+ return state;
2039
+ };
2040
+
2041
+ 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; }
2042
+ function _objectSpread(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(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(Object(t))).call(_context3, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
2043
+ const ImportResourcesModal = props => {
2044
+ var _context;
2045
+ const _useApplicationContex = applicationShellConnectors.useApplicationContext(context => ({
2046
+ locale: context.user && context.user.locale
2047
+ })),
2048
+ locale = _useApplicationContex.locale;
2049
+ const messages = useAsyncIntlMessages(locale, loadMessages);
2050
+ if (!props.isOpen || messages.isLoading) return null;
2051
+ if (!props.resourceTypes?.length) {
2052
+ console.error('No resource types provided for import resources modal');
2053
+ return null;
2054
+ }
2055
+ if (!_everyInstanceProperty__default["default"](_context = props.resourceTypes).call(_context, operations.isResourceType)) {
2056
+ console.error('Invalid resource types provided for import resources modal');
2057
+ return null;
2058
+ }
2059
+ return jsxRuntime.jsx(reactIntl.IntlProvider, {
2060
+ locale: locale,
2061
+ messages: messages.messages,
2062
+ children: jsxRuntime.jsx(ImportResourcesProvider, _objectSpread(_objectSpread({}, props), {}, {
2063
+ children: jsxRuntime.jsx(CurrentStep, {})
2064
+ }))
2065
+ });
2066
+ };
2067
+ ImportResourcesModal.displayName = 'ImportResourcesModal';
2068
+
2069
+ exports["default"] = ImportResourcesModal;
2070
+ exports.useImportPermission = useImportPermission;