@commercetools-frontend-extensions/delete-resources-modal 1.1.11 → 1.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -29,6 +29,7 @@ var _possibleConstructorReturn = require('@babel/runtime-corejs3/helpers/possibl
|
|
|
29
29
|
var _getPrototypeOf = require('@babel/runtime-corejs3/helpers/getPrototypeOf');
|
|
30
30
|
var _inherits = require('@babel/runtime-corejs3/helpers/inherits');
|
|
31
31
|
var _wrapNativeSuper = require('@babel/runtime-corejs3/helpers/wrapNativeSuper');
|
|
32
|
+
var applicationShell = require('@commercetools-frontend/application-shell');
|
|
32
33
|
var sentry = require('@commercetools-frontend/sentry');
|
|
33
34
|
var _sliceInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/slice');
|
|
34
35
|
require('@emotion/react');
|
|
@@ -48,55 +49,79 @@ var React__default = /*#__PURE__*/_interopDefault(React);
|
|
|
48
49
|
var _Reflect$construct__default = /*#__PURE__*/_interopDefault(_Reflect$construct);
|
|
49
50
|
var _sliceInstanceProperty__default = /*#__PURE__*/_interopDefault(_sliceInstanceProperty);
|
|
50
51
|
|
|
51
|
-
function ownKeys$
|
|
52
|
-
function _objectSpread$
|
|
52
|
+
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; }
|
|
53
|
+
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; }
|
|
53
54
|
function reducer(state, action) {
|
|
54
|
-
if (action.type === 'setCurrentStep') return _objectSpread$
|
|
55
|
+
if (action.type === 'setCurrentStep') return _objectSpread$7(_objectSpread$7({}, state), {}, {
|
|
55
56
|
currentStep: action.currentStep,
|
|
56
57
|
progress: 0
|
|
57
58
|
});
|
|
58
|
-
if (action.type === 'setContainerKey') return _objectSpread$
|
|
59
|
+
if (action.type === 'setContainerKey') return _objectSpread$7(_objectSpread$7({}, state), {}, {
|
|
59
60
|
containerKey: action.containerKey
|
|
60
61
|
});
|
|
61
|
-
if (action.type === 'cancelImport') return _objectSpread$
|
|
62
|
+
if (action.type === 'cancelImport') return _objectSpread$7(_objectSpread$7({}, state), {}, {
|
|
62
63
|
currentStep: 'upload',
|
|
63
64
|
containerKey: undefined,
|
|
64
65
|
droppedFile: undefined,
|
|
65
66
|
dropAreaState: 'ready-for-drop',
|
|
66
|
-
progress: 0
|
|
67
|
+
progress: 0,
|
|
68
|
+
jobId: undefined,
|
|
69
|
+
totalResourceCount: undefined,
|
|
70
|
+
validationProcessed: undefined,
|
|
71
|
+
isValidating: false
|
|
67
72
|
});
|
|
68
|
-
if (action.type === 'uploadNewFile') return _objectSpread$
|
|
73
|
+
if (action.type === 'uploadNewFile') return _objectSpread$7(_objectSpread$7({}, state), {}, {
|
|
69
74
|
currentStep: 'upload',
|
|
70
75
|
containerKey: undefined,
|
|
71
76
|
droppedFile: undefined,
|
|
72
77
|
dropAreaState: 'ready-for-drop',
|
|
73
|
-
progress: 0
|
|
78
|
+
progress: 0,
|
|
79
|
+
jobId: undefined,
|
|
80
|
+
totalResourceCount: undefined,
|
|
81
|
+
validationProcessed: undefined,
|
|
82
|
+
isValidating: false
|
|
74
83
|
});
|
|
75
84
|
if (action.type === 'setDroppedFile') {
|
|
76
|
-
return _objectSpread$
|
|
85
|
+
return _objectSpread$7(_objectSpread$7({}, state), {}, {
|
|
77
86
|
droppedFile: action.droppedFile
|
|
78
87
|
});
|
|
79
88
|
}
|
|
80
89
|
if (action.type === 'setAbortController') {
|
|
81
|
-
return _objectSpread$
|
|
90
|
+
return _objectSpread$7(_objectSpread$7({}, state), {}, {
|
|
82
91
|
abortController: action.abortController
|
|
83
92
|
});
|
|
84
93
|
}
|
|
85
94
|
if (action.type === 'setProgress') {
|
|
86
|
-
return _objectSpread$
|
|
95
|
+
return _objectSpread$7(_objectSpread$7({}, state), {}, {
|
|
87
96
|
progress: action.progress
|
|
88
97
|
});
|
|
89
98
|
}
|
|
90
99
|
if (action.type === 'setUploadFileResponse') {
|
|
91
|
-
return _objectSpread$
|
|
100
|
+
return _objectSpread$7(_objectSpread$7({}, state), {}, {
|
|
92
101
|
uploadFileResponse: action.uploadFileResponse
|
|
93
102
|
});
|
|
94
103
|
}
|
|
95
104
|
if (action.type === 'setFileUploadErrors') {
|
|
96
|
-
return _objectSpread$
|
|
105
|
+
return _objectSpread$7(_objectSpread$7({}, state), {}, {
|
|
97
106
|
fileUploadErrors: action.fileUploadErrors
|
|
98
107
|
});
|
|
99
108
|
}
|
|
109
|
+
if (action.type === 'setJobId') {
|
|
110
|
+
return _objectSpread$7(_objectSpread$7({}, state), {}, {
|
|
111
|
+
jobId: action.jobId
|
|
112
|
+
});
|
|
113
|
+
}
|
|
114
|
+
if (action.type === 'setTotalResourceCount') {
|
|
115
|
+
return _objectSpread$7(_objectSpread$7({}, state), {}, {
|
|
116
|
+
totalResourceCount: action.totalResourceCount
|
|
117
|
+
});
|
|
118
|
+
}
|
|
119
|
+
if (action.type === 'setValidationProgress') {
|
|
120
|
+
return _objectSpread$7(_objectSpread$7({}, state), {}, {
|
|
121
|
+
validationProcessed: action.processed,
|
|
122
|
+
isValidating: action.isValidating
|
|
123
|
+
});
|
|
124
|
+
}
|
|
100
125
|
throw new Error(getUnknownActionError(action));
|
|
101
126
|
}
|
|
102
127
|
function getUnknownActionError(actionType) {
|
|
@@ -138,12 +163,22 @@ const initialActions = {
|
|
|
138
163
|
},
|
|
139
164
|
setProgress(_progress) {
|
|
140
165
|
/**/
|
|
166
|
+
},
|
|
167
|
+
setJobId(_jobId) {
|
|
168
|
+
/**/
|
|
169
|
+
},
|
|
170
|
+
setTotalResourceCount(_totalResourceCount) {
|
|
171
|
+
/**/
|
|
172
|
+
},
|
|
173
|
+
setValidationProgress(_params) {
|
|
174
|
+
/**/
|
|
141
175
|
}
|
|
142
176
|
};
|
|
143
177
|
|
|
144
178
|
const DeleteResourcesContext = /*#__PURE__*/React__default["default"].createContext({
|
|
145
179
|
state: initialState,
|
|
146
180
|
actions: initialActions,
|
|
181
|
+
resourceType: 'product',
|
|
147
182
|
onClose: () => {}
|
|
148
183
|
});
|
|
149
184
|
const DeleteResourcesProvider = props => {
|
|
@@ -193,6 +228,37 @@ const DeleteResourcesProvider = props => {
|
|
|
193
228
|
uploadFileResponse
|
|
194
229
|
});
|
|
195
230
|
};
|
|
231
|
+
const setJobId = jobId => dispatch({
|
|
232
|
+
type: 'setJobId',
|
|
233
|
+
jobId
|
|
234
|
+
});
|
|
235
|
+
const setTotalResourceCount = totalResourceCount => dispatch({
|
|
236
|
+
type: 'setTotalResourceCount',
|
|
237
|
+
totalResourceCount
|
|
238
|
+
});
|
|
239
|
+
const setValidationProgress = _ref => {
|
|
240
|
+
let processed = _ref.processed,
|
|
241
|
+
isValidating = _ref.isValidating;
|
|
242
|
+
return dispatch({
|
|
243
|
+
type: 'setValidationProgress',
|
|
244
|
+
processed,
|
|
245
|
+
isValidating
|
|
246
|
+
});
|
|
247
|
+
};
|
|
248
|
+
const actions = {
|
|
249
|
+
setCurrentStep,
|
|
250
|
+
cancelImport,
|
|
251
|
+
uploadNewFile,
|
|
252
|
+
setDroppedFile,
|
|
253
|
+
setUploadFileResponse,
|
|
254
|
+
setFileUploadErrors,
|
|
255
|
+
setContainerKey,
|
|
256
|
+
setAbortController,
|
|
257
|
+
setProgress,
|
|
258
|
+
setJobId,
|
|
259
|
+
setTotalResourceCount,
|
|
260
|
+
setValidationProgress
|
|
261
|
+
};
|
|
196
262
|
const handleClose = function () {
|
|
197
263
|
let options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
|
198
264
|
if (state.abortController) state.abortController.abort();
|
|
@@ -208,17 +274,7 @@ const DeleteResourcesProvider = props => {
|
|
|
208
274
|
resourceType: props.resourceType,
|
|
209
275
|
state,
|
|
210
276
|
onClose: handleClose,
|
|
211
|
-
actions
|
|
212
|
-
setCurrentStep,
|
|
213
|
-
cancelImport,
|
|
214
|
-
uploadNewFile,
|
|
215
|
-
setDroppedFile,
|
|
216
|
-
setUploadFileResponse,
|
|
217
|
-
setFileUploadErrors,
|
|
218
|
-
setContainerKey,
|
|
219
|
-
setAbortController,
|
|
220
|
-
setProgress
|
|
221
|
-
}
|
|
277
|
+
actions
|
|
222
278
|
},
|
|
223
279
|
children: props.children
|
|
224
280
|
});
|
|
@@ -270,7 +326,7 @@ function getDropAreaState(flags) {
|
|
|
270
326
|
return 'ready-for-drop';
|
|
271
327
|
}
|
|
272
328
|
|
|
273
|
-
var messages$
|
|
329
|
+
var messages$5 = reactIntl.defineMessages({
|
|
274
330
|
dragAndDropCSV: {
|
|
275
331
|
id: 'DeleteResourcesModal.dragAndDropCSV',
|
|
276
332
|
description: 'The message telling the user to drag and drop CSV file in the file drop area',
|
|
@@ -363,7 +419,7 @@ const useDeleteResourcesContext = () => {
|
|
|
363
419
|
return context;
|
|
364
420
|
};
|
|
365
421
|
|
|
366
|
-
var messages$
|
|
422
|
+
var messages$4 = reactIntl.defineMessages({
|
|
367
423
|
fileSizeExceededTitle: {
|
|
368
424
|
id: 'DeleteResourcesModal.sizeExceededTitle',
|
|
369
425
|
defaultMessage: 'File size exceeded'
|
|
@@ -419,6 +475,22 @@ var messages$3 = reactIntl.defineMessages({
|
|
|
419
475
|
}
|
|
420
476
|
});
|
|
421
477
|
|
|
478
|
+
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; }
|
|
479
|
+
function _objectSpread$6(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context = ownKeys$6(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context2 = ownKeys$6(Object(t))).call(_context2, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
|
|
480
|
+
const FILE_IMPORT_JOB_FLOW = 'fileImportJobFlow';
|
|
481
|
+
const DEFAULT_SHORT_LIVED_FLAGS = {
|
|
482
|
+
[FILE_IMPORT_JOB_FLOW]: false
|
|
483
|
+
};
|
|
484
|
+
const DEFAULT_LONG_LIVED_FLAGS = {};
|
|
485
|
+
_objectSpread$6(_objectSpread$6({}, DEFAULT_SHORT_LIVED_FLAGS), DEFAULT_LONG_LIVED_FLAGS);
|
|
486
|
+
|
|
487
|
+
const DOCUMENTATION_LINKS = {
|
|
488
|
+
product: 'https://docs.commercetools.com/merchant-center/product-list#bulk-delete-via-csv-import'
|
|
489
|
+
};
|
|
490
|
+
const TEMPLATE_DOWNLOAD_LINKS = {
|
|
491
|
+
product: 'https://docs.commercetools.com/merchant-center/downloads/product_delete_import_template.csv'
|
|
492
|
+
};
|
|
493
|
+
|
|
422
494
|
const useUpload = () => {
|
|
423
495
|
const intl = reactIntl.useIntl();
|
|
424
496
|
const _useApplicationContex = applicationShellConnectors.useApplicationContext(context => ({
|
|
@@ -430,38 +502,37 @@ const useUpload = () => {
|
|
|
430
502
|
state = _useDeleteResourcesCo.state,
|
|
431
503
|
actions = _useDeleteResourcesCo.actions;
|
|
432
504
|
const showNotification = actionsGlobal.useShowNotification();
|
|
433
|
-
const
|
|
434
|
-
|
|
505
|
+
const isFileImportJobFlowEnabled = applicationShell.useFeatureToggle(FILE_IMPORT_JOB_FLOW);
|
|
506
|
+
const _useFileUpload = operations.useFileUpload({
|
|
507
|
+
projectKey: projectKey,
|
|
508
|
+
useJobBasedFlow: isFileImportJobFlowEnabled
|
|
435
509
|
}),
|
|
436
|
-
upload =
|
|
437
|
-
React__default["default"].useEffect(() => {
|
|
438
|
-
return () => {
|
|
439
|
-
if (state.abortController) state.abortController.abort();
|
|
440
|
-
};
|
|
441
|
-
}, [state.abortController]);
|
|
510
|
+
upload = _useFileUpload.upload;
|
|
442
511
|
const isFileValid = async file => {
|
|
443
512
|
const errors = [];
|
|
513
|
+
const maxFileSizeMB = isFileImportJobFlowEnabled ? operations.IMPORT_MAX_FILE_SIZE_MB : operations.IMPORT_LEGACY_MAX_FILE_SIZE_MB;
|
|
514
|
+
const maxItemCount = isFileImportJobFlowEnabled ? operations.IMPORT_MAX_ITEM_COUNT : operations.IMPORT_LEGACY_MAX_ROW_COUNT;
|
|
444
515
|
const rowCount = await operations.getRowCount(file);
|
|
445
516
|
if (rowCount < 1) errors.push({
|
|
446
|
-
title: intl.formatMessage(messages$
|
|
447
|
-
description: intl.formatMessage(messages$
|
|
517
|
+
title: intl.formatMessage(messages$4.dropAreaNotEnoughRowsTitle),
|
|
518
|
+
description: intl.formatMessage(messages$4.dropAreaNotEnoughRowsDescription)
|
|
448
519
|
});
|
|
449
|
-
if (file.size > operations.toBytes(
|
|
450
|
-
title: intl.formatMessage(messages$
|
|
451
|
-
description: intl.formatMessage(messages$
|
|
452
|
-
fileSizeLimit: intl.formatNumber(
|
|
520
|
+
if (file.size > operations.toBytes(maxFileSizeMB)) errors.push({
|
|
521
|
+
title: intl.formatMessage(messages$4.fileSizeExceededTitle),
|
|
522
|
+
description: intl.formatMessage(messages$4.fileSizeExceededDescription, {
|
|
523
|
+
fileSizeLimit: intl.formatNumber(maxFileSizeMB)
|
|
453
524
|
})
|
|
454
525
|
});
|
|
455
526
|
if (!(await operations.hasSingleKeyColumn(file))) {
|
|
456
527
|
errors.push({
|
|
457
|
-
title: intl.formatMessage(messages$
|
|
458
|
-
description: intl.formatMessage(messages$
|
|
528
|
+
title: intl.formatMessage(messages$4.csvFormatErrorTitle),
|
|
529
|
+
description: intl.formatMessage(messages$4.csvFormatErrorDescription)
|
|
459
530
|
});
|
|
460
531
|
}
|
|
461
|
-
if (rowCount >
|
|
462
|
-
title: intl.formatMessage(messages$
|
|
463
|
-
description: intl.formatMessage(messages$
|
|
464
|
-
rowLimit: intl.formatNumber(
|
|
532
|
+
if (rowCount > maxItemCount) errors.push({
|
|
533
|
+
title: intl.formatMessage(messages$4.rowLimitExceededTitle),
|
|
534
|
+
description: intl.formatMessage(messages$4.rowLimitExceededDescription, {
|
|
535
|
+
rowLimit: intl.formatNumber(maxItemCount)
|
|
465
536
|
})
|
|
466
537
|
});
|
|
467
538
|
if (errors.length > 0) {
|
|
@@ -469,6 +540,10 @@ const useUpload = () => {
|
|
|
469
540
|
actions.setCurrentStep('upload-error');
|
|
470
541
|
return false;
|
|
471
542
|
}
|
|
543
|
+
if (isFileImportJobFlowEnabled) {
|
|
544
|
+
const resourceCount = await operations.countUniqueResourcesInCsv(file);
|
|
545
|
+
actions.setTotalResourceCount(resourceCount);
|
|
546
|
+
}
|
|
472
547
|
return true;
|
|
473
548
|
};
|
|
474
549
|
const handleUploadError = error => {
|
|
@@ -477,18 +552,25 @@ const useUpload = () => {
|
|
|
477
552
|
return;
|
|
478
553
|
}
|
|
479
554
|
if (error instanceof operations.HttpError) {
|
|
555
|
+
actions.setValidationProgress({
|
|
556
|
+
processed: 0,
|
|
557
|
+
isValidating: false
|
|
558
|
+
});
|
|
480
559
|
if (error.errorData?.code === 'MISSING_KEY_ERROR') {
|
|
481
560
|
actions.setFileUploadErrors([{
|
|
482
|
-
title: intl.formatMessage(messages$
|
|
483
|
-
description: intl.formatMessage(messages$
|
|
561
|
+
title: intl.formatMessage(messages$4.missingRequiredField),
|
|
562
|
+
description: intl.formatMessage(messages$4.missingKeyError)
|
|
484
563
|
}]);
|
|
485
564
|
actions.setCurrentStep('upload-error');
|
|
565
|
+
} else if (error.errorData?.invalid > 0) {
|
|
566
|
+
actions.setUploadFileResponse(error.errorData);
|
|
567
|
+
actions.setCurrentStep('upload-error');
|
|
486
568
|
} else {
|
|
487
569
|
actions.cancelImport();
|
|
488
570
|
showNotification({
|
|
489
571
|
kind: 'error',
|
|
490
572
|
domain: constants.DOMAINS.PAGE,
|
|
491
|
-
text: intl.formatMessage(messages$
|
|
573
|
+
text: intl.formatMessage(messages$4.unexpectedError)
|
|
492
574
|
});
|
|
493
575
|
}
|
|
494
576
|
} else {
|
|
@@ -510,25 +592,51 @@ const useUpload = () => {
|
|
|
510
592
|
if (!state.droppedFile) return;
|
|
511
593
|
const canUpload = await isFileValid(state.droppedFile);
|
|
512
594
|
if (!canUpload) return;
|
|
595
|
+
const abortController = new AbortController();
|
|
596
|
+
actions.setAbortController(abortController);
|
|
513
597
|
actions.setCurrentStep('uploading');
|
|
514
|
-
|
|
515
|
-
|
|
516
|
-
|
|
517
|
-
|
|
518
|
-
|
|
519
|
-
|
|
520
|
-
|
|
521
|
-
|
|
522
|
-
|
|
523
|
-
|
|
524
|
-
|
|
525
|
-
}
|
|
526
|
-
|
|
527
|
-
|
|
528
|
-
|
|
529
|
-
|
|
530
|
-
|
|
531
|
-
|
|
598
|
+
await upload({
|
|
599
|
+
file: state.droppedFile,
|
|
600
|
+
resourceType,
|
|
601
|
+
settings: {
|
|
602
|
+
format: 'CSV'
|
|
603
|
+
},
|
|
604
|
+
abortSignal: abortController.signal,
|
|
605
|
+
onSuccess: result => {
|
|
606
|
+
actions.setValidationProgress({
|
|
607
|
+
processed: 0,
|
|
608
|
+
isValidating: false
|
|
609
|
+
});
|
|
610
|
+
actions.setContainerKey(result.containerKey);
|
|
611
|
+
if (result.jobId) {
|
|
612
|
+
actions.setJobId(result.jobId);
|
|
613
|
+
}
|
|
614
|
+
const fileUploadResponse = {
|
|
615
|
+
results: result.summary.results,
|
|
616
|
+
invalid: result.summary.invalid,
|
|
617
|
+
valid: result.summary.valid,
|
|
618
|
+
fileName: state.droppedFile?.name || '',
|
|
619
|
+
itemsCount: result.summary.total,
|
|
620
|
+
rowsCount: result.summary.total,
|
|
621
|
+
columnsCount: result.summary.fieldsCount,
|
|
622
|
+
fields: result.summary.fields,
|
|
623
|
+
ignoredFields: result.summary.ignoredFields
|
|
624
|
+
};
|
|
625
|
+
actions.setUploadFileResponse(fileUploadResponse);
|
|
626
|
+
actions.setCurrentStep('upload-preview');
|
|
627
|
+
},
|
|
628
|
+
onProgress: progress => {
|
|
629
|
+
actions.setProgress(progress);
|
|
630
|
+
},
|
|
631
|
+
onValidationProgress: job => {
|
|
632
|
+
const processed = job.summary?.total ?? 0;
|
|
633
|
+
actions.setValidationProgress({
|
|
634
|
+
processed,
|
|
635
|
+
isValidating: true
|
|
636
|
+
});
|
|
637
|
+
},
|
|
638
|
+
onError: handleUploadError
|
|
639
|
+
});
|
|
532
640
|
};
|
|
533
641
|
return {
|
|
534
642
|
handleUploadAndValidation
|
|
@@ -549,9 +657,9 @@ const FileDropArea = () => {
|
|
|
549
657
|
}, [actions]);
|
|
550
658
|
const handleDropRejected = React__default["default"].useCallback(errorType => {
|
|
551
659
|
const errorMessageMap = {
|
|
552
|
-
'too-many-files': messages$
|
|
553
|
-
'invalid-type': messages$
|
|
554
|
-
generic: messages$
|
|
660
|
+
'too-many-files': messages$5.tooManyFilesError,
|
|
661
|
+
'invalid-type': messages$5.fileFormatNotSupported,
|
|
662
|
+
generic: messages$5.genericError
|
|
555
663
|
};
|
|
556
664
|
showNotification({
|
|
557
665
|
kind: 'error',
|
|
@@ -575,10 +683,10 @@ const FileDropArea = () => {
|
|
|
575
683
|
isFileDropped: Boolean(state.droppedFile),
|
|
576
684
|
fileName: state.droppedFile?.name,
|
|
577
685
|
messages: {
|
|
578
|
-
dragAndDropCSV: intl.formatMessage(messages$
|
|
579
|
-
or: intl.formatMessage(messages$
|
|
580
|
-
browseButton: intl.formatMessage(messages$
|
|
581
|
-
chooseFile: intl.formatMessage(messages$
|
|
686
|
+
dragAndDropCSV: intl.formatMessage(messages$5.dragAndDropCSV),
|
|
687
|
+
or: intl.formatMessage(messages$5.or),
|
|
688
|
+
browseButton: intl.formatMessage(messages$5.browseButton),
|
|
689
|
+
chooseFile: intl.formatMessage(messages$5.chooseFile)
|
|
582
690
|
}
|
|
583
691
|
})
|
|
584
692
|
});
|
|
@@ -727,7 +835,7 @@ var sharedMessages = reactIntl.defineMessages({
|
|
|
727
835
|
}
|
|
728
836
|
});
|
|
729
837
|
|
|
730
|
-
var messages$
|
|
838
|
+
var messages$3 = reactIntl.defineMessages({
|
|
731
839
|
fileUploadInstruction: {
|
|
732
840
|
id: 'DeleteResourcesModal.fileUploadInstruction',
|
|
733
841
|
description: 'Instructions for uploading a CSV file with resource keys to delete',
|
|
@@ -745,13 +853,6 @@ var messages$2 = reactIntl.defineMessages({
|
|
|
745
853
|
}
|
|
746
854
|
});
|
|
747
855
|
|
|
748
|
-
const DOCUMENTATION_LINKS = {
|
|
749
|
-
product: 'https://docs.commercetools.com/merchant-center/product-list#bulk-delete-via-csv-import'
|
|
750
|
-
};
|
|
751
|
-
const TEMPLATE_DOWNLOAD_LINKS = {
|
|
752
|
-
product: 'https://docs.commercetools.com/merchant-center/downloads/product_delete_import_template.csv'
|
|
753
|
-
};
|
|
754
|
-
|
|
755
856
|
function resourceTypeToMessage(resourceType) {
|
|
756
857
|
const resourceTypeMap = {
|
|
757
858
|
category: sharedMessages.category,
|
|
@@ -809,23 +910,26 @@ const Instructions = () => {
|
|
|
809
910
|
const intl = reactIntl.useIntl();
|
|
810
911
|
const _useDeleteResourcesCo = useDeleteResourcesContext(),
|
|
811
912
|
resourceType = _useDeleteResourcesCo.resourceType;
|
|
913
|
+
const isFileImportJobFlowEnabled = applicationShell.useFeatureToggle(FILE_IMPORT_JOB_FLOW);
|
|
812
914
|
const documentTemplateLink = TEMPLATE_DOWNLOAD_LINKS[resourceType];
|
|
813
915
|
const documentationLink = DOCUMENTATION_LINKS[resourceType];
|
|
916
|
+
const maxFileSizeMB = isFileImportJobFlowEnabled ? operations.IMPORT_MAX_FILE_SIZE_MB : operations.IMPORT_LEGACY_MAX_FILE_SIZE_MB;
|
|
917
|
+
const maxItemCount = isFileImportJobFlowEnabled ? operations.IMPORT_MAX_ITEM_COUNT : operations.IMPORT_LEGACY_MAX_ROW_COUNT;
|
|
814
918
|
return jsxRuntime.jsxs(uiKit.Spacings.Stack, {
|
|
815
919
|
scale: "m",
|
|
816
920
|
children: [jsxRuntime.jsxs(uiKit.Text.Body, {
|
|
817
|
-
children: [intl.formatMessage(messages$
|
|
921
|
+
children: [intl.formatMessage(messages$3.fileUploadInstruction, {
|
|
818
922
|
resourceType: intl.formatMessage(resourceTypeToMessage(resourceType))
|
|
819
|
-
}), ' ', intl.formatMessage(messages$
|
|
923
|
+
}), ' ', intl.formatMessage(messages$3.unpublishNote, {
|
|
820
924
|
b: msg => jsxRuntime.jsx("b", {
|
|
821
925
|
children: msg
|
|
822
926
|
}, "bold")
|
|
823
927
|
})]
|
|
824
928
|
}), jsxRuntime.jsx(uiKit.Text.Body, {
|
|
825
|
-
intlMessage: _objectSpread$5(_objectSpread$5({}, messages$
|
|
929
|
+
intlMessage: _objectSpread$5(_objectSpread$5({}, messages$3.fileUploadInstructionForMaxFileSize), {}, {
|
|
826
930
|
values: {
|
|
827
|
-
maxFileSize: intl.formatNumber(
|
|
828
|
-
maxRowCount: intl.formatNumber(
|
|
931
|
+
maxFileSize: intl.formatNumber(maxFileSizeMB),
|
|
932
|
+
maxRowCount: intl.formatNumber(maxItemCount),
|
|
829
933
|
csvTemplateLink: msg => jsxRuntime.jsx(uiKit.Link, {
|
|
830
934
|
tone: "secondary",
|
|
831
935
|
isExternal: true,
|
|
@@ -855,7 +959,7 @@ const Upload = () => {
|
|
|
855
959
|
size: 16,
|
|
856
960
|
isOpen: true,
|
|
857
961
|
title: intl.formatMessage(sharedMessages.deleteModalTitle),
|
|
858
|
-
labelPrimary: intl.formatMessage(messages$
|
|
962
|
+
labelPrimary: intl.formatMessage(messages$5.uploadAndPreview),
|
|
859
963
|
onPrimaryButtonClick: handleUploadAndValidation,
|
|
860
964
|
isPrimaryButtonDisabled: !Boolean(state.droppedFile),
|
|
861
965
|
onSecondaryButtonClick: () => onClose({
|
|
@@ -873,19 +977,34 @@ const Upload = () => {
|
|
|
873
977
|
});
|
|
874
978
|
};
|
|
875
979
|
|
|
980
|
+
var messages$2 = reactIntl.defineMessages({
|
|
981
|
+
validatingResources: {
|
|
982
|
+
id: 'DeleteResourcesModal.Uploading.validatingResources',
|
|
983
|
+
defaultMessage: 'Validating {processed} / {total} {resourceType}'
|
|
984
|
+
}
|
|
985
|
+
});
|
|
986
|
+
|
|
876
987
|
const Uploading = () => {
|
|
877
988
|
const intl = reactIntl.useIntl();
|
|
878
989
|
const _useDeleteResourcesCo = useDeleteResourcesContext(),
|
|
990
|
+
resourceType = _useDeleteResourcesCo.resourceType,
|
|
879
991
|
state = _useDeleteResourcesCo.state,
|
|
880
992
|
actions = _useDeleteResourcesCo.actions,
|
|
881
993
|
onClose = _useDeleteResourcesCo.onClose;
|
|
882
994
|
if (!state.droppedFile?.name) return null;
|
|
995
|
+
const showValidationProgress = state.isValidating && state.totalResourceCount && (state.validationProcessed ?? 0) > 0;
|
|
996
|
+
const statusMessage = showValidationProgress ? intl.formatMessage(messages$2.validatingResources, {
|
|
997
|
+
processed: intl.formatNumber(state.validationProcessed ?? 0),
|
|
998
|
+
total: intl.formatNumber(state.totalResourceCount ?? 0),
|
|
999
|
+
resourceType: intl.formatMessage(resourceTypeToPluralMessage(resourceType))
|
|
1000
|
+
}) : undefined;
|
|
883
1001
|
return jsxRuntime.jsx(operations.UploadingModal, {
|
|
884
1002
|
isOpen: true,
|
|
885
1003
|
title: intl.formatMessage(sharedMessages.deleteModalTitle),
|
|
886
1004
|
fileName: state.droppedFile.name,
|
|
887
1005
|
fileSize: state.droppedFile.size,
|
|
888
1006
|
progress: state.progress,
|
|
1007
|
+
statusMessage: statusMessage,
|
|
889
1008
|
cancelLabel: intl.formatMessage(sharedMessages.cancel),
|
|
890
1009
|
onCancel: () => {
|
|
891
1010
|
actions.setCurrentStep('upload');
|
|
@@ -978,7 +1097,7 @@ const UploadErrorsModal = () => {
|
|
|
978
1097
|
state = _useDeleteResourcesCo.state,
|
|
979
1098
|
actions = _useDeleteResourcesCo.actions,
|
|
980
1099
|
onClose = _useDeleteResourcesCo.onClose;
|
|
981
|
-
const errorsCount = state.fileUploadErrors
|
|
1100
|
+
const errorsCount = state.fileUploadErrors?.length ?? 0;
|
|
982
1101
|
return jsxRuntime.jsx(applicationComponents.InfoDialog, {
|
|
983
1102
|
size: 16,
|
|
984
1103
|
isOpen: true,
|
|
@@ -998,7 +1117,7 @@ const UploadErrorsModal = () => {
|
|
|
998
1117
|
})
|
|
999
1118
|
})
|
|
1000
1119
|
}), jsxRuntime.jsx(UploadErrorTable, {
|
|
1001
|
-
rows: operations.mapFileUploadErrorsToUploadFileErrorRows(state.fileUploadErrors)
|
|
1120
|
+
rows: operations.mapFileUploadErrorsToUploadFileErrorRows(state.fileUploadErrors ?? [])
|
|
1002
1121
|
}), jsxRuntime.jsxs(uiKit.Spacings.Inline, {
|
|
1003
1122
|
scale: "m",
|
|
1004
1123
|
justifyContent: "flex-end",
|
|
@@ -1133,12 +1252,22 @@ const DeleteResourcesConfirmationModal = () => {
|
|
|
1133
1252
|
}, {
|
|
1134
1253
|
dismissAfter: 5000
|
|
1135
1254
|
});
|
|
1136
|
-
|
|
1137
|
-
|
|
1138
|
-
|
|
1139
|
-
|
|
1140
|
-
|
|
1141
|
-
|
|
1255
|
+
if (state.jobId) {
|
|
1256
|
+
await operations.processFileImportJob({
|
|
1257
|
+
projectKey,
|
|
1258
|
+
importContainerKey: state.containerKey,
|
|
1259
|
+
jobId: state.jobId,
|
|
1260
|
+
resourceType,
|
|
1261
|
+
action: 'delete'
|
|
1262
|
+
});
|
|
1263
|
+
} else {
|
|
1264
|
+
await operations.processUploadedFile({
|
|
1265
|
+
projectKey,
|
|
1266
|
+
importContainerKey: state.containerKey,
|
|
1267
|
+
resourceType,
|
|
1268
|
+
action: 'delete'
|
|
1269
|
+
});
|
|
1270
|
+
}
|
|
1142
1271
|
showNotification({
|
|
1143
1272
|
kind: 'info',
|
|
1144
1273
|
domain: constants.DOMAINS.SIDE,
|
|
@@ -1179,7 +1308,7 @@ const DeleteResourcesConfirmationModal = () => {
|
|
|
1179
1308
|
projectName: projectName,
|
|
1180
1309
|
resourceTypePlural: intl.formatMessage(resourceTypeToPluralMessage(resourceType)),
|
|
1181
1310
|
resourceType: intl.formatMessage(resourceTypeToMessage(resourceType)),
|
|
1182
|
-
count: intl.formatNumber(state.uploadFileResponse?.rowsCount),
|
|
1311
|
+
count: intl.formatNumber(state.uploadFileResponse?.rowsCount ?? 0),
|
|
1183
1312
|
b: getBold$1
|
|
1184
1313
|
}
|
|
1185
1314
|
})
|
|
@@ -1268,7 +1397,7 @@ function UploadPreviewModal() {
|
|
|
1268
1397
|
values: {
|
|
1269
1398
|
resourceType: intl.formatMessage(resourceTypeToMessage(resourceType)),
|
|
1270
1399
|
resourceTypePlural: intl.formatMessage(resourceTypeToPluralMessage(resourceType)),
|
|
1271
|
-
count: intl.formatNumber(state.uploadFileResponse?.rowsCount),
|
|
1400
|
+
count: intl.formatNumber(state.uploadFileResponse?.rowsCount ?? 0),
|
|
1272
1401
|
b: getBold
|
|
1273
1402
|
}
|
|
1274
1403
|
})
|