@commercetools-frontend/react-notifications 22.2.0 → 22.3.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.
- package/dist/commercetools-frontend-react-notifications.cjs.dev.js +45 -139
- package/dist/commercetools-frontend-react-notifications.cjs.prod.js +36 -130
- package/dist/commercetools-frontend-react-notifications.esm.js +45 -139
- package/dist/declarations/src/components/map-notification-to-component/map-notification-to-component.d.ts +1 -1
- package/dist/declarations/src/components/notification/notification.d.ts +1 -1
- package/dist/declarations/src/components/notification/notification.styles.d.ts +5 -4
- package/dist/declarations/src/components/notification-kinds/api-error/api-error.d.ts +1 -1
- package/dist/declarations/src/components/notification-kinds/api-error-message/api-error-message.d.ts +6 -2
- package/dist/declarations/src/components/notification-kinds/generic/generic.d.ts +1 -1
- package/dist/declarations/src/components/notification-kinds/unexpected-error/unexpected-error.d.ts +1 -1
- package/dist/declarations/src/components/notifications-list/notifications-list.d.ts +1 -1
- package/dist/declarations/src/components/notifications-list/notifications-list.styles.d.ts +1 -1
- package/package.json +25 -12
|
@@ -64,20 +64,18 @@ var _sliceInstanceProperty__default = /*#__PURE__*/_interopDefault(_sliceInstanc
|
|
|
64
64
|
var isNumber__default = /*#__PURE__*/_interopDefault(isNumber);
|
|
65
65
|
|
|
66
66
|
// NOTE: This string will be replaced on build time with the package version.
|
|
67
|
-
var version = "22.
|
|
67
|
+
var version = "22.3.0";
|
|
68
68
|
|
|
69
69
|
const Context = /*#__PURE__*/react.createContext(() => null);
|
|
70
|
-
|
|
71
70
|
function NotificationProviderForCustomComponent(props) {
|
|
72
71
|
return jsxRuntime.jsx(Context.Provider, {
|
|
73
72
|
value: props.mapNotificationToComponent,
|
|
74
73
|
children: props.children
|
|
75
74
|
});
|
|
76
75
|
}
|
|
77
|
-
|
|
78
76
|
NotificationProviderForCustomComponent.propTypes = {};
|
|
79
77
|
NotificationProviderForCustomComponent.displayName = 'NotificationProviderForCustomComponent';
|
|
80
|
-
const useCustomNotificationComponent = () => react.useContext(Context);
|
|
78
|
+
const useCustomNotificationComponent = () => react.useContext(Context);
|
|
81
79
|
|
|
82
80
|
function filterDataAttributes(obj) {
|
|
83
81
|
return omitBy__default["default"](obj, (_value, key) => !_startsWithInstanceProperty__default["default"](key).call(key, 'data-'));
|
|
@@ -92,92 +90,70 @@ var messages = reactIntl.defineMessages({
|
|
|
92
90
|
});
|
|
93
91
|
|
|
94
92
|
var _templateObject, _templateObject2;
|
|
95
|
-
|
|
96
93
|
const getColorByType = value => {
|
|
97
94
|
switch (value) {
|
|
98
95
|
case constants.NOTIFICATION_KINDS_SIDE.success:
|
|
99
96
|
return designSystem.designTokens.colorPrimary;
|
|
100
|
-
|
|
101
97
|
case constants.NOTIFICATION_KINDS_SIDE.info:
|
|
102
98
|
return designSystem.designTokens.colorInfo;
|
|
103
|
-
|
|
104
99
|
case constants.NOTIFICATION_KINDS_SIDE.error:
|
|
105
100
|
return designSystem.designTokens.colorError;
|
|
106
|
-
|
|
107
101
|
case constants.NOTIFICATION_KINDS_SIDE.warning:
|
|
108
102
|
return designSystem.designTokens.colorWarning;
|
|
109
|
-
|
|
110
103
|
default:
|
|
111
104
|
return 'transparent';
|
|
112
105
|
}
|
|
113
106
|
};
|
|
114
|
-
|
|
115
107
|
const getBorderColor = notificationKind => {
|
|
116
108
|
switch (notificationKind) {
|
|
117
109
|
case constants.NOTIFICATION_KINDS_SIDE.success:
|
|
118
110
|
return designSystem.designTokens.colorPrimary85;
|
|
119
|
-
|
|
120
111
|
case constants.NOTIFICATION_KINDS_SIDE.info:
|
|
121
112
|
return designSystem.designTokens.colorInfo85;
|
|
122
|
-
|
|
123
113
|
case constants.NOTIFICATION_KINDS_SIDE.error:
|
|
124
114
|
return designSystem.designTokens.colorError85;
|
|
125
|
-
|
|
126
115
|
case constants.NOTIFICATION_KINDS_SIDE.warning:
|
|
127
116
|
return designSystem.designTokens.colorWarning85;
|
|
128
|
-
|
|
129
117
|
default:
|
|
130
118
|
return 'transparent';
|
|
131
119
|
}
|
|
132
120
|
};
|
|
133
|
-
|
|
134
121
|
const showNotificationAnimation = react$1.keyframes(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n 0% {\n max-height: 0;\n padding-top: 0;\n padding-bottom: 0;\n overflow: hidden;\n }\n 100% {\n max-height: 200px;\n }\n"])));
|
|
135
122
|
const showNotificationSideAnimation = react$1.keyframes(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n 0% {\n transform: translateX(50px);\n }\n 100% {\n transform: translateX(0);\n }\n"])));
|
|
136
|
-
|
|
137
123
|
const getStylesForNotificationIcon = props => /*#__PURE__*/react$1.css("display:flex;align-items:center;justify-content:center;position:absolute;left:0;top:0;width:48px;height:100%;color:", designSystem.designTokens.colorSurface, ";border-radius:3px 0 0 3px;background:", getColorByType(props.type), ";" + ("" ), "" );
|
|
138
|
-
|
|
139
124
|
const getStylesForCloseIcon = props => /*#__PURE__*/react$1.css("display:flex;justify-content:center;", props.isNewTheme ? '& svg { width: 16px; height: 16px; }' : '', " ", props.isNewTheme && props.domain !== constants.NOTIFICATION_DOMAINS.SIDE ? '& svg { fill: ' + designSystem.designTokens.colorSurface + '; }' : '', ";" + ("" ), "" );
|
|
140
|
-
|
|
141
125
|
const getStylesForContent = props => {
|
|
142
126
|
const fontColor = props.domain === constants.NOTIFICATION_DOMAINS.SIDE ? designSystem.designTokens.colorSolid : designSystem.designTokens.colorSurface;
|
|
143
127
|
return /*#__PURE__*/react$1.css("flex-basis:100%;flex-grow:1;padding:0 ", props.isNewTheme ? designSystem.designTokens.spacingM : designSystem.designTokens.spacingS, ";margin:0;font-size:", props.domain === constants.NOTIFICATION_DOMAINS.SIDE ? props.isNewTheme ? '1rem' : '0.929rem' : 'inherit', ";color:", fontColor, ";p{color:", fontColor, ";}ul{padding:0;margin:0;list-style:none;}" + ("" ), "" );
|
|
144
128
|
};
|
|
145
|
-
|
|
146
129
|
const getStylesForNotification = props => {
|
|
147
130
|
const baseStyles = /*#__PURE__*/react$1.css("position:relative;display:flex;align-items:center;padding:", designSystem.designTokens.spacingM, ";color:", designSystem.designTokens.colorSurface, ";" + ("" ), "" );
|
|
148
131
|
const pageStyles = /*#__PURE__*/react$1.css(baseStyles, ";animation:", showNotificationAnimation, " 0.3s forwards;text-align:center;background-color:", props.fixed ? 'transparent' : getColorByType(props.type), ";>*+*{margin-left:", designSystem.designTokens.spacingS, ";}" + ("" ), "" );
|
|
149
|
-
|
|
150
132
|
switch (props.domain) {
|
|
151
133
|
case constants.NOTIFICATION_DOMAINS.GLOBAL:
|
|
152
134
|
return /*#__PURE__*/react$1.css(pageStyles, ";background-color:", getColorByType(props.type), ";" + ("" ), "" );
|
|
153
|
-
|
|
154
135
|
case constants.NOTIFICATION_DOMAINS.PAGE:
|
|
155
136
|
return pageStyles;
|
|
156
|
-
|
|
157
137
|
case constants.NOTIFICATION_DOMAINS.SIDE:
|
|
158
138
|
{
|
|
159
139
|
const sideStyles = /*#__PURE__*/react$1.css(baseStyles, ";animation:", showNotificationAnimation, " 0.3s forwards;padding:", designSystem.designTokens.spacingM, " ", designSystem.designTokens.spacingM, " ", designSystem.designTokens.spacingM, " 50px!important;text-align:left;background:", designSystem.designTokens.colorSurface, ";border:1px solid ", props.isNewTheme ? getBorderColor(props.type) : getColorByType(props.type), ";box-shadow:", props.isNewTheme ? '0px 2px 5px 0px rgba(0, 0, 0, 0.15)' : '0 1px 2px rgba(0, 0, 0, 0.24)', ";border-radius:", designSystem.designTokens.borderRadius6, ";word-break:break-word;hyphens:auto;" + ("" ), "" );
|
|
160
140
|
if (props.fixed) return sideStyles;
|
|
161
141
|
return /*#__PURE__*/react$1.css(sideStyles, ";animation:", showNotificationSideAnimation, " 0.3s forwards;position:relative;z-index:10000;margin-top:", designSystem.designTokens.spacingL, "!important;right:", designSystem.designTokens.spacingXl, ";float:right;clear:both;max-width:50%;" + ("" ), "" );
|
|
162
142
|
}
|
|
163
|
-
|
|
164
143
|
default:
|
|
165
144
|
return /*#__PURE__*/react$1.css("" , "" );
|
|
166
145
|
}
|
|
167
146
|
};
|
|
168
147
|
|
|
169
148
|
function ownKeys$4(object, enumerableOnly) { var keys = _Object$keys__default["default"](object); if (_Object$getOwnPropertySymbols__default["default"]) { var symbols = _Object$getOwnPropertySymbols__default["default"](object); enumerableOnly && (symbols = _filterInstanceProperty__default["default"](symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor__default["default"](object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
170
|
-
|
|
171
149
|
function _objectSpread$4(target) { for (var i = 1; i < arguments.length; i++) { var _context, _context2; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty__default["default"](_context = ownKeys$4(Object(source), !0)).call(_context, function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](target, _Object$getOwnPropertyDescriptors__default["default"](source)) : _forEachInstanceProperty__default["default"](_context2 = ownKeys$4(Object(source))).call(_context2, function (key) { _Object$defineProperty__default["default"](target, key, _Object$getOwnPropertyDescriptor__default["default"](source, key)); }); } return target; }
|
|
172
150
|
const sequentialId = utils.createSequentialId('notification-');
|
|
173
|
-
|
|
174
151
|
const NotificationIcon = props => {
|
|
175
152
|
if (props.type === constants.NOTIFICATION_KINDS_SIDE.error) {
|
|
176
153
|
return jsxRuntime.jsx(icons.ErrorIcon, {
|
|
177
154
|
color: props.color
|
|
178
155
|
});
|
|
179
156
|
}
|
|
180
|
-
|
|
181
157
|
if (props.type === constants.NOTIFICATION_KINDS_SIDE.info) {
|
|
182
158
|
return props.isNewTheme ? jsxRuntime.jsx(icons.InformationIcon, {
|
|
183
159
|
color: props.color
|
|
@@ -185,32 +161,26 @@ const NotificationIcon = props => {
|
|
|
185
161
|
color: props.color
|
|
186
162
|
});
|
|
187
163
|
}
|
|
188
|
-
|
|
189
164
|
if (props.type === constants.NOTIFICATION_KINDS_SIDE.warning) {
|
|
190
165
|
return jsxRuntime.jsx(icons.WarningIcon, {
|
|
191
166
|
color: props.color
|
|
192
167
|
});
|
|
193
168
|
}
|
|
194
|
-
|
|
195
169
|
return jsxRuntime.jsx(icons.CheckBoldIcon, {
|
|
196
170
|
color: props.color
|
|
197
171
|
});
|
|
198
172
|
};
|
|
199
|
-
|
|
200
173
|
NotificationIcon.propTypes = {};
|
|
201
174
|
NotificationIcon.displayName = 'NotificationIcon';
|
|
202
175
|
const defaultProps$1 = {
|
|
203
176
|
fixed: false
|
|
204
177
|
};
|
|
205
|
-
|
|
206
178
|
const Notification = props => {
|
|
207
179
|
const intl = reactIntl.useIntl();
|
|
208
180
|
const id = hooks.useFieldId(undefined, sequentialId);
|
|
209
|
-
|
|
210
181
|
const _useTheme = designSystem.useTheme(),
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
182
|
+
isNewTheme = _useTheme.isNewTheme,
|
|
183
|
+
themedValue = _useTheme.themedValue;
|
|
214
184
|
const Button = themedValue(IconButton__default["default"], SecondaryIconButton__default["default"]);
|
|
215
185
|
return jsxRuntime.jsxs("div", _objectSpread$4(_objectSpread$4({
|
|
216
186
|
role: "alertdialog",
|
|
@@ -245,7 +215,6 @@ const Notification = props => {
|
|
|
245
215
|
}) : null]
|
|
246
216
|
}));
|
|
247
217
|
};
|
|
248
|
-
|
|
249
218
|
Notification.propTypes = {};
|
|
250
219
|
Notification.displayName = 'Notification';
|
|
251
220
|
Notification.defaultProps = defaultProps$1;
|
|
@@ -392,10 +361,8 @@ var apiErrorMessages = reactIntl.defineMessages({
|
|
|
392
361
|
});
|
|
393
362
|
|
|
394
363
|
function ownKeys$3(object, enumerableOnly) { var keys = _Object$keys__default["default"](object); if (_Object$getOwnPropertySymbols__default["default"]) { var symbols = _Object$getOwnPropertySymbols__default["default"](object); enumerableOnly && (symbols = _filterInstanceProperty__default["default"](symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor__default["default"](object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
395
|
-
|
|
396
364
|
function _objectSpread$3(target) { for (var i = 1; i < arguments.length; i++) { var _context6, _context7; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty__default["default"](_context6 = ownKeys$3(Object(source), !0)).call(_context6, function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](target, _Object$getOwnPropertyDescriptors__default["default"](source)) : _forEachInstanceProperty__default["default"](_context7 = ownKeys$3(Object(source))).call(_context7, function (key) { _Object$defineProperty__default["default"](target, key, _Object$getOwnPropertyDescriptor__default["default"](source, key)); }); } return target; }
|
|
397
365
|
const regexInvalidOperationRequiredAttribute = /Required attribute '(.*)' cannot be removed/;
|
|
398
|
-
|
|
399
366
|
// The values passed to the Intl message must be a map of scalar values.
|
|
400
367
|
// Some of the message values are already mapped in the `getSpecialFormattedMessageByErrorCode`
|
|
401
368
|
// function. Here we map other possible error properties that can be
|
|
@@ -408,22 +375,19 @@ const mapErrorFieldsToMessageValues = error => {
|
|
|
408
375
|
referencedBy: error.referencedBy
|
|
409
376
|
};
|
|
410
377
|
return {};
|
|
411
|
-
};
|
|
412
|
-
|
|
378
|
+
};
|
|
413
379
|
|
|
380
|
+
// Type-guard validation for error code to be included in the message object keys.
|
|
414
381
|
const hasErrorCodeAMatchingMessage = errorCode => errorCode in apiErrorMessages;
|
|
415
|
-
|
|
416
382
|
const FormattedErrorMessage = props => {
|
|
417
383
|
var _props$error$extensio, _props$error$extensio2, _context2;
|
|
418
|
-
|
|
419
|
-
|
|
420
|
-
|
|
384
|
+
const intl = reactIntl.useIntl();
|
|
385
|
+
// Attempt to map the error by code
|
|
421
386
|
const extensionErrorCode = (_props$error$extensio = (_props$error$extensio2 = props.error.extensions) === null || _props$error$extensio2 === void 0 ? void 0 : _props$error$extensio2.code) !== null && _props$error$extensio !== void 0 ? _props$error$extensio : props.error.code;
|
|
422
387
|
const messageCode = extensionErrorCode && hasErrorCodeAMatchingMessage(extensionErrorCode) ? apiErrorMessages[extensionErrorCode] : undefined;
|
|
423
388
|
react.useEffect(() => {
|
|
424
389
|
if (!messageCode) {
|
|
425
390
|
var _context;
|
|
426
|
-
|
|
427
391
|
// This error is not mapped / translated yet,
|
|
428
392
|
// we log, report it to sentry and show the original error, unless `error.code` is `invalid_scope`
|
|
429
393
|
// which an error code emitted for expired project(s)
|
|
@@ -434,115 +398,99 @@ const FormattedErrorMessage = props => {
|
|
|
434
398
|
}
|
|
435
399
|
}
|
|
436
400
|
}, [extensionErrorCode, messageCode, props.error]);
|
|
437
|
-
|
|
438
401
|
if (messageCode) {
|
|
439
402
|
// The `error` object might contain extra fields for the specific `code`.
|
|
440
403
|
return jsxRuntime.jsx(jsxRuntime.Fragment, {
|
|
441
404
|
children: intl.formatMessage(messageCode, mapErrorFieldsToMessageValues(props.error))
|
|
442
405
|
});
|
|
443
406
|
}
|
|
444
|
-
|
|
445
407
|
return jsxRuntime.jsx(jsxRuntime.Fragment, {
|
|
446
408
|
children: _filterInstanceProperty__default["default"](_context2 = [props.error.message, props.error.detailedErrorMessage && "(".concat(props.error.detailedErrorMessage, ")")]).call(_context2, Boolean).join(' ')
|
|
447
409
|
});
|
|
448
410
|
};
|
|
449
|
-
|
|
450
411
|
FormattedErrorMessage.propTypes = {
|
|
451
412
|
error: _pt__default["default"].any.isRequired
|
|
452
413
|
};
|
|
453
414
|
FormattedErrorMessage.displayName = 'FormattedErrorMessage';
|
|
454
|
-
|
|
455
415
|
const ApiErrorMessage = props => {
|
|
456
|
-
const intl = reactIntl.useIntl();
|
|
416
|
+
const intl = reactIntl.useIntl();
|
|
457
417
|
|
|
418
|
+
// Attempt to map the error to a specific error message
|
|
458
419
|
const specialFormattedMessage = getSpecialFormattedMessageByErrorCode(props.error, intl);
|
|
459
|
-
|
|
460
420
|
if (specialFormattedMessage) {
|
|
461
421
|
return jsxRuntime.jsx(jsxRuntime.Fragment, {
|
|
462
422
|
children: specialFormattedMessage
|
|
463
423
|
});
|
|
464
424
|
}
|
|
465
|
-
|
|
466
425
|
return jsxRuntime.jsx(FormattedErrorMessage, _objectSpread$3({}, props));
|
|
467
426
|
};
|
|
468
|
-
|
|
469
427
|
ApiErrorMessage.propTypes = {};
|
|
470
428
|
ApiErrorMessage.displayName = 'ApiErrorMessage';
|
|
471
|
-
|
|
472
429
|
function getSpecialFormattedMessageByErrorCode(error, intl) {
|
|
473
430
|
var _error$extensions$cod, _error$extensions, _context3, _context4, _context5;
|
|
474
|
-
|
|
475
431
|
const extensionErrorCode = (_error$extensions$cod = (_error$extensions = error.extensions) === null || _error$extensions === void 0 ? void 0 : _error$extensions.code) !== null && _error$extensions$cod !== void 0 ? _error$extensions$cod : error.code;
|
|
476
|
-
|
|
477
432
|
if (error.errorByExtension) {
|
|
478
433
|
let extensionMessage;
|
|
479
|
-
|
|
480
434
|
if (error.localizedMessage) {
|
|
481
435
|
extensionMessage = error.localizedMessage[intl.locale];
|
|
482
436
|
}
|
|
483
|
-
|
|
484
437
|
return extensionMessage || error.message;
|
|
485
438
|
}
|
|
439
|
+
if (!extensionErrorCode || extensionErrorCode === 'InvalidInput') return intl.formatMessage(apiErrorMessages.General);
|
|
486
440
|
|
|
487
|
-
|
|
488
|
-
|
|
441
|
+
// TODO: this is a temporary solution until we have proper pages about 403
|
|
489
442
|
if (extensionErrorCode === 'insufficient_scope') return intl.formatMessage(apiErrorMessages.Forbidden);
|
|
490
|
-
|
|
491
443
|
if (extensionErrorCode === 'DuplicateField') {
|
|
492
|
-
|
|
444
|
+
var _error$extensions2, _error$extensions3;
|
|
445
|
+
const errorField = ((_error$extensions2 = error.extensions) === null || _error$extensions2 === void 0 ? void 0 : _error$extensions2.field) || error.field;
|
|
446
|
+
const errorDuplicateValue = ((_error$extensions3 = error.extensions) === null || _error$extensions3 === void 0 ? void 0 : _error$extensions3.duplicateValue) || error.duplicateValue;
|
|
447
|
+
if (errorField === 'slug') {
|
|
493
448
|
return intl.formatMessage(apiErrorMessages.DuplicateSlug, {
|
|
494
|
-
slugValue:
|
|
449
|
+
slugValue: errorDuplicateValue
|
|
495
450
|
});
|
|
496
451
|
} else {
|
|
497
452
|
return intl.formatMessage(apiErrorMessages.DuplicateField, {
|
|
498
|
-
field:
|
|
453
|
+
field: errorField
|
|
499
454
|
});
|
|
500
455
|
}
|
|
501
|
-
}
|
|
502
|
-
|
|
456
|
+
}
|
|
503
457
|
|
|
458
|
+
// Try to match the error with a custom error message
|
|
504
459
|
if (has__default["default"](error, 'invalidValue') && has__default["default"](error.invalidValue, 'overlappingPrices')) return intl.formatMessage(apiErrorMessages.OverlappingPrices);
|
|
505
|
-
|
|
506
460
|
if (extensionErrorCode === 'InvalidOperation' && _includesInstanceProperty__default["default"](_context3 = error.message).call(_context3, 'validFrom') && _includesInstanceProperty__default["default"](_context4 = error.message).call(_context4, 'validUntil')) {
|
|
507
461
|
return intl.formatMessage(apiErrorMessages.InvalidDateRange, {
|
|
508
462
|
field: 'validFrom'
|
|
509
463
|
});
|
|
510
464
|
}
|
|
511
|
-
|
|
512
465
|
if (extensionErrorCode === 'InvalidOperation' && _includesInstanceProperty__default["default"](_context5 = error.message).call(_context5, 'Duplicate tax rate for')) {
|
|
513
466
|
return intl.formatMessage(apiErrorMessages.TaxCategoryDuplicateCountry);
|
|
514
467
|
}
|
|
515
|
-
|
|
516
468
|
if (extensionErrorCode === 'InvalidOperation' && regexInvalidOperationRequiredAttribute.test(error.message)) {
|
|
517
469
|
const attrName = error.message.replace(regexInvalidOperationRequiredAttribute, '$1');
|
|
518
470
|
return intl.formatMessage(apiErrorMessages.RequiredField, {
|
|
519
471
|
field: attrName
|
|
520
472
|
});
|
|
521
|
-
}
|
|
473
|
+
}
|
|
474
|
+
|
|
475
|
+
// TODO: A concern has be raised that we can't accurately distinguish
|
|
522
476
|
// this error (invalid start / end dates with prices) from other price
|
|
523
477
|
// errors. We should investigate this further.
|
|
524
|
-
|
|
525
|
-
|
|
526
478
|
if (extensionErrorCode === 'InvalidField' && error.field === 'price' && has__default["default"](error, 'invalidValue') && has__default["default"](error.invalidValue, 'validFrom') && has__default["default"](error.invalidValue, 'validUntil')) return intl.formatMessage(apiErrorMessages.InvalidDateRange, {
|
|
527
479
|
field: error.field
|
|
528
480
|
});
|
|
529
|
-
|
|
530
481
|
if (extensionErrorCode === 'DuplicateAttributeValue' && error.attribute) {
|
|
531
482
|
return intl.formatMessage(apiErrorMessages.DuplicateAttributeValue, {
|
|
532
483
|
name: error.attribute.name
|
|
533
484
|
});
|
|
534
485
|
}
|
|
535
|
-
|
|
536
486
|
if (extensionErrorCode === 'MaxResourceLimitExceeded') {
|
|
537
487
|
return intl.formatMessage(apiErrorMessages.MaxResourceLimitExceeded);
|
|
538
488
|
}
|
|
539
|
-
|
|
540
489
|
return;
|
|
541
490
|
}
|
|
542
491
|
|
|
543
492
|
const ApiErrorNotification = props => {
|
|
544
493
|
var _context;
|
|
545
|
-
|
|
546
494
|
return jsxRuntime.jsx(Notification, {
|
|
547
495
|
type: "error",
|
|
548
496
|
domain: props.notification.domain,
|
|
@@ -550,10 +498,8 @@ const ApiErrorNotification = props => {
|
|
|
550
498
|
children: jsxRuntime.jsx("ul", {
|
|
551
499
|
children: _valuesInstanceProperty__default["default"](props.notification) && _mapInstanceProperty__default["default"](_context = _valuesInstanceProperty__default["default"](props.notification).errors).call(_context, (error, idx) => {
|
|
552
500
|
var _error$extensions$cod, _error$extensions;
|
|
553
|
-
|
|
554
501
|
const extensionErrorCode = (_error$extensions$cod = (_error$extensions = error.extensions) === null || _error$extensions === void 0 ? void 0 : _error$extensions.code) !== null && _error$extensions$cod !== void 0 ? _error$extensions$cod : error.code;
|
|
555
502
|
const shouldLogErrorToConsole = !extensionErrorCode && "production" === 'development';
|
|
556
|
-
|
|
557
503
|
if (shouldLogErrorToConsole) {
|
|
558
504
|
/**
|
|
559
505
|
* NOTE: This is an API error which usually contains
|
|
@@ -564,7 +510,6 @@ const ApiErrorNotification = props => {
|
|
|
564
510
|
// eslint-disable-next-line no-console
|
|
565
511
|
console.error('Unknown API error', error);
|
|
566
512
|
}
|
|
567
|
-
|
|
568
513
|
return jsxRuntime.jsx("li", {
|
|
569
514
|
children: jsxRuntime.jsx(ApiErrorMessage, {
|
|
570
515
|
error: error
|
|
@@ -574,7 +519,6 @@ const ApiErrorNotification = props => {
|
|
|
574
519
|
})
|
|
575
520
|
});
|
|
576
521
|
};
|
|
577
|
-
|
|
578
522
|
ApiErrorNotification.propTypes = {};
|
|
579
523
|
ApiErrorNotification.displayName = 'ApiErrorNotification';
|
|
580
524
|
|
|
@@ -584,14 +528,11 @@ const GenericNotification = props => jsxRuntime.jsx(Notification, {
|
|
|
584
528
|
onCloseClick: props.dismiss,
|
|
585
529
|
children: props.notification.text
|
|
586
530
|
});
|
|
587
|
-
|
|
588
531
|
GenericNotification.propTypes = {};
|
|
589
532
|
GenericNotification.displayName = 'GenericNotification';
|
|
590
533
|
|
|
591
534
|
function ownKeys$2(object, enumerableOnly) { var keys = _Object$keys__default["default"](object); if (_Object$getOwnPropertySymbols__default["default"]) { var symbols = _Object$getOwnPropertySymbols__default["default"](object); enumerableOnly && (symbols = _filterInstanceProperty__default["default"](symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor__default["default"](object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
592
|
-
|
|
593
535
|
function _objectSpread$2(target) { for (var i = 1; i < arguments.length; i++) { var _context, _context2; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty__default["default"](_context = ownKeys$2(Object(source), !0)).call(_context, function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](target, _Object$getOwnPropertyDescriptors__default["default"](source)) : _forEachInstanceProperty__default["default"](_context2 = ownKeys$2(Object(source))).call(_context2, function (key) { _Object$defineProperty__default["default"](target, key, _Object$getOwnPropertyDescriptor__default["default"](source, key)); }); } return target; }
|
|
594
|
-
|
|
595
536
|
const UnexpectedErrorNotification = props => jsxRuntime.jsx(Notification, {
|
|
596
537
|
type: "error",
|
|
597
538
|
domain: props.notification.domain,
|
|
@@ -604,23 +545,18 @@ const UnexpectedErrorNotification = props => jsxRuntime.jsx(Notification, {
|
|
|
604
545
|
})]
|
|
605
546
|
})
|
|
606
547
|
});
|
|
607
|
-
|
|
608
548
|
UnexpectedErrorNotification.propTypes = {};
|
|
609
549
|
UnexpectedErrorNotification.displayName = 'UnexpectedErrorNotification';
|
|
610
550
|
|
|
611
551
|
const getStyles = props => {
|
|
612
552
|
const baseStyles = /*#__PURE__*/react$1.css("color:", designSystem.customProperties.colorSurface, ";position:relative;width:100%;z-index:19999;" + ("" ), "" );
|
|
613
|
-
|
|
614
553
|
switch (props.domain) {
|
|
615
554
|
case constants.NOTIFICATION_DOMAINS.GLOBAL:
|
|
616
555
|
return /*#__PURE__*/react$1.css(baseStyles, ";text-align:center;width:100%!important;" + ("" ), "" );
|
|
617
|
-
|
|
618
556
|
case constants.NOTIFICATION_DOMAINS.PAGE:
|
|
619
557
|
return /*#__PURE__*/react$1.css(baseStyles, ";" + ("" ), "" );
|
|
620
|
-
|
|
621
558
|
case constants.NOTIFICATION_DOMAINS.SIDE:
|
|
622
559
|
return /*#__PURE__*/react$1.css(baseStyles, ";position:absolute;text-align:left;height:0;overflow:visible;" + ("" ), "" );
|
|
623
|
-
|
|
624
560
|
default:
|
|
625
561
|
return /*#__PURE__*/react$1.css("" , "" );
|
|
626
562
|
}
|
|
@@ -631,23 +567,20 @@ const getStyles = props => {
|
|
|
631
567
|
const selectNotifications = state => state.notifications;
|
|
632
568
|
const selectGlobalNotifications = reselect.createSelector(selectNotifications, notifications => {
|
|
633
569
|
var _context;
|
|
634
|
-
|
|
635
|
-
|
|
570
|
+
return _sliceInstanceProperty__default["default"](_context = _filterInstanceProperty__default["default"](notifications).call(notifications, notification => notification.domain === constants.NOTIFICATION_DOMAINS.GLOBAL)
|
|
571
|
+
// Return only 1 at a time
|
|
636
572
|
).call(_context, 0, 1);
|
|
637
573
|
});
|
|
638
574
|
const selectPageNotifications = reselect.createSelector(selectNotifications, notifications => _filterInstanceProperty__default["default"](notifications).call(notifications, notification => notification.domain === constants.NOTIFICATION_DOMAINS.PAGE));
|
|
639
575
|
const selectSideNotifications = reselect.createSelector(selectNotifications, notifications => _filterInstanceProperty__default["default"](notifications).call(notifications, notification => notification.domain === constants.NOTIFICATION_DOMAINS.SIDE));
|
|
640
576
|
|
|
641
577
|
const _excluded = ["values"],
|
|
642
|
-
|
|
643
|
-
|
|
644
|
-
|
|
645
|
-
|
|
646
|
-
|
|
578
|
+
_excluded2 = ["text"],
|
|
579
|
+
_excluded3 = ["values"],
|
|
580
|
+
_excluded4 = ["text"],
|
|
581
|
+
_excluded5 = ["text"];
|
|
647
582
|
function ownKeys$1(object, enumerableOnly) { var keys = _Object$keys__default["default"](object); if (_Object$getOwnPropertySymbols__default["default"]) { var symbols = _Object$getOwnPropertySymbols__default["default"](object); enumerableOnly && (symbols = _filterInstanceProperty__default["default"](symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor__default["default"](object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
648
|
-
|
|
649
583
|
function _objectSpread$1(target) { for (var i = 1; i < arguments.length; i++) { var _context, _context2; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty__default["default"](_context = ownKeys$1(Object(source), !0)).call(_context, function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](target, _Object$getOwnPropertyDescriptors__default["default"](source)) : _forEachInstanceProperty__default["default"](_context2 = ownKeys$1(Object(source))).call(_context2, function (key) { _Object$defineProperty__default["default"](target, key, _Object$getOwnPropertyDescriptor__default["default"](source, key)); }); } return target; }
|
|
650
|
-
|
|
651
584
|
const NotificationsListGlobal = props => {
|
|
652
585
|
const dispatch = reactRedux.useDispatch();
|
|
653
586
|
const mapCustomNotificationToComponent = useCustomNotificationComponent();
|
|
@@ -658,7 +591,6 @@ const NotificationsListGlobal = props => {
|
|
|
658
591
|
children: _mapInstanceProperty__default["default"](notifications$1).call(notifications$1, notification => {
|
|
659
592
|
// 1. Check if there is a custom notification component first
|
|
660
593
|
const CustomNotificationComponent = mapCustomNotificationToComponent(notification);
|
|
661
|
-
|
|
662
594
|
if (CustomNotificationComponent) {
|
|
663
595
|
return jsxRuntime.jsx(CustomNotificationComponent, {
|
|
664
596
|
notification: notification,
|
|
@@ -667,7 +599,6 @@ const NotificationsListGlobal = props => {
|
|
|
667
599
|
}
|
|
668
600
|
}, notification.id);
|
|
669
601
|
}
|
|
670
|
-
|
|
671
602
|
switch (notification.kind) {
|
|
672
603
|
case constants.NOTIFICATION_KINDS_GLOBAL.error:
|
|
673
604
|
case constants.NOTIFICATION_KINDS_GLOBAL.warning:
|
|
@@ -675,8 +606,7 @@ const NotificationsListGlobal = props => {
|
|
|
675
606
|
case constants.NOTIFICATION_KINDS_GLOBAL.success:
|
|
676
607
|
{
|
|
677
608
|
_valuesInstanceProperty__default["default"](notification);
|
|
678
|
-
|
|
679
|
-
|
|
609
|
+
const genericNotification = _objectWithoutProperties(notification, _excluded);
|
|
680
610
|
return jsxRuntime.jsx(GenericNotification, {
|
|
681
611
|
notification: genericNotification,
|
|
682
612
|
dismiss: () => {
|
|
@@ -684,12 +614,10 @@ const NotificationsListGlobal = props => {
|
|
|
684
614
|
}
|
|
685
615
|
}, notification.id);
|
|
686
616
|
}
|
|
687
|
-
|
|
688
617
|
case constants.NOTIFICATION_KINDS_GLOBAL['unexpected-error']:
|
|
689
618
|
{
|
|
690
619
|
notification.text;
|
|
691
|
-
|
|
692
|
-
|
|
620
|
+
const errorNotification = _objectWithoutProperties(notification, _excluded2);
|
|
693
621
|
return jsxRuntime.jsx(UnexpectedErrorNotification, {
|
|
694
622
|
notification: errorNotification,
|
|
695
623
|
dismiss: () => {
|
|
@@ -697,17 +625,14 @@ const NotificationsListGlobal = props => {
|
|
|
697
625
|
}
|
|
698
626
|
}, notification.id);
|
|
699
627
|
}
|
|
700
|
-
|
|
701
628
|
default:
|
|
702
629
|
{
|
|
703
|
-
|
|
704
630
|
return null;
|
|
705
631
|
}
|
|
706
632
|
}
|
|
707
633
|
})
|
|
708
634
|
});
|
|
709
635
|
};
|
|
710
|
-
|
|
711
636
|
const NotificationsListPage = props => {
|
|
712
637
|
const dispatch = reactRedux.useDispatch();
|
|
713
638
|
const mapCustomNotificationToComponent = useCustomNotificationComponent();
|
|
@@ -718,7 +643,6 @@ const NotificationsListPage = props => {
|
|
|
718
643
|
children: _mapInstanceProperty__default["default"](notifications$1).call(notifications$1, notification => {
|
|
719
644
|
// 1. Check if there is a custom notification component first
|
|
720
645
|
const CustomNotificationComponent = mapCustomNotificationToComponent(notification);
|
|
721
|
-
|
|
722
646
|
if (CustomNotificationComponent) {
|
|
723
647
|
return jsxRuntime.jsx(CustomNotificationComponent, {
|
|
724
648
|
notification: notification,
|
|
@@ -727,7 +651,6 @@ const NotificationsListPage = props => {
|
|
|
727
651
|
}
|
|
728
652
|
}, notification.id);
|
|
729
653
|
}
|
|
730
|
-
|
|
731
654
|
switch (notification.kind) {
|
|
732
655
|
case constants.NOTIFICATION_KINDS_PAGE.error:
|
|
733
656
|
case constants.NOTIFICATION_KINDS_PAGE.warning:
|
|
@@ -735,8 +658,7 @@ const NotificationsListPage = props => {
|
|
|
735
658
|
case constants.NOTIFICATION_KINDS_PAGE.success:
|
|
736
659
|
{
|
|
737
660
|
_valuesInstanceProperty__default["default"](notification);
|
|
738
|
-
|
|
739
|
-
|
|
661
|
+
const genericNotification = _objectWithoutProperties(notification, _excluded3);
|
|
740
662
|
return jsxRuntime.jsx(GenericNotification, {
|
|
741
663
|
notification: _objectSpread$1(_objectSpread$1({}, genericNotification), {}, {
|
|
742
664
|
kind: notification.kind
|
|
@@ -746,12 +668,10 @@ const NotificationsListPage = props => {
|
|
|
746
668
|
}
|
|
747
669
|
}, notification.id);
|
|
748
670
|
}
|
|
749
|
-
|
|
750
671
|
case constants.NOTIFICATION_KINDS_PAGE['api-error']:
|
|
751
672
|
{
|
|
752
673
|
notification.text;
|
|
753
|
-
|
|
754
|
-
|
|
674
|
+
const errorNotification = _objectWithoutProperties(notification, _excluded4);
|
|
755
675
|
return jsxRuntime.jsx(ApiErrorNotification, {
|
|
756
676
|
notification: errorNotification,
|
|
757
677
|
dismiss: () => {
|
|
@@ -759,12 +679,10 @@ const NotificationsListPage = props => {
|
|
|
759
679
|
}
|
|
760
680
|
}, notification.id);
|
|
761
681
|
}
|
|
762
|
-
|
|
763
682
|
case constants.NOTIFICATION_KINDS_PAGE['unexpected-error']:
|
|
764
683
|
{
|
|
765
684
|
notification.text;
|
|
766
|
-
|
|
767
|
-
|
|
685
|
+
const errorNotification = _objectWithoutProperties(notification, _excluded5);
|
|
768
686
|
return jsxRuntime.jsx(UnexpectedErrorNotification, {
|
|
769
687
|
notification: _objectSpread$1(_objectSpread$1({}, errorNotification), {}, {
|
|
770
688
|
values: _valuesInstanceProperty__default["default"](notification)
|
|
@@ -774,14 +692,12 @@ const NotificationsListPage = props => {
|
|
|
774
692
|
}
|
|
775
693
|
}, notification.id);
|
|
776
694
|
}
|
|
777
|
-
|
|
778
695
|
default:
|
|
779
696
|
return null;
|
|
780
697
|
}
|
|
781
698
|
})
|
|
782
699
|
});
|
|
783
700
|
};
|
|
784
|
-
|
|
785
701
|
const NotificationsListSide = props => {
|
|
786
702
|
const dispatch = reactRedux.useDispatch();
|
|
787
703
|
const mapCustomNotificationToComponent = useCustomNotificationComponent();
|
|
@@ -792,7 +708,6 @@ const NotificationsListSide = props => {
|
|
|
792
708
|
children: _mapInstanceProperty__default["default"](notifications$1).call(notifications$1, notification => {
|
|
793
709
|
// 1. Check if there is a custom notification component first
|
|
794
710
|
const CustomNotificationComponent = mapCustomNotificationToComponent(notification);
|
|
795
|
-
|
|
796
711
|
if (CustomNotificationComponent) {
|
|
797
712
|
return jsxRuntime.jsx(CustomNotificationComponent, {
|
|
798
713
|
notification: notification,
|
|
@@ -801,7 +716,6 @@ const NotificationsListSide = props => {
|
|
|
801
716
|
}
|
|
802
717
|
}, notification.id);
|
|
803
718
|
}
|
|
804
|
-
|
|
805
719
|
switch (notification.kind) {
|
|
806
720
|
case constants.NOTIFICATION_KINDS_SIDE.error:
|
|
807
721
|
case constants.NOTIFICATION_KINDS_SIDE.warning:
|
|
@@ -813,40 +727,32 @@ const NotificationsListSide = props => {
|
|
|
813
727
|
dispatch(notifications.removeNotification(notification.id));
|
|
814
728
|
}
|
|
815
729
|
}, notification.id);
|
|
816
|
-
|
|
817
730
|
default:
|
|
818
731
|
return null;
|
|
819
732
|
}
|
|
820
733
|
})
|
|
821
734
|
});
|
|
822
735
|
};
|
|
823
|
-
|
|
824
736
|
const NotificationsList = props => {
|
|
825
737
|
switch (props.domain) {
|
|
826
738
|
case constants.NOTIFICATION_DOMAINS.GLOBAL:
|
|
827
739
|
return jsxRuntime.jsx(NotificationsListGlobal, _objectSpread$1({}, props));
|
|
828
|
-
|
|
829
740
|
case constants.NOTIFICATION_DOMAINS.PAGE:
|
|
830
741
|
return jsxRuntime.jsx(NotificationsListPage, _objectSpread$1({}, props));
|
|
831
|
-
|
|
832
742
|
case constants.NOTIFICATION_DOMAINS.SIDE:
|
|
833
743
|
return jsxRuntime.jsx(NotificationsListSide, _objectSpread$1({}, props));
|
|
834
|
-
|
|
835
744
|
default:
|
|
836
745
|
return null;
|
|
837
746
|
}
|
|
838
747
|
};
|
|
839
|
-
|
|
840
748
|
NotificationsList.displayName = 'NotificationsList';
|
|
841
749
|
|
|
842
750
|
function ownKeys(object, enumerableOnly) { var keys = _Object$keys__default["default"](object); if (_Object$getOwnPropertySymbols__default["default"]) { var symbols = _Object$getOwnPropertySymbols__default["default"](object); enumerableOnly && (symbols = _filterInstanceProperty__default["default"](symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor__default["default"](object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
843
|
-
|
|
844
751
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var _context, _context2; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty__default["default"](_context = ownKeys(Object(source), !0)).call(_context, function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](target, _Object$getOwnPropertyDescriptors__default["default"](source)) : _forEachInstanceProperty__default["default"](_context2 = ownKeys(Object(source))).call(_context2, function (key) { _Object$defineProperty__default["default"](target, key, _Object$getOwnPropertyDescriptor__default["default"](source, key)); }); } return target; }
|
|
845
752
|
const defaultProps = {
|
|
846
753
|
domain: constants.NOTIFICATION_DOMAINS.SIDE,
|
|
847
754
|
kind: constants.NOTIFICATION_KINDS_SIDE.success
|
|
848
755
|
};
|
|
849
|
-
|
|
850
756
|
const Notifier = props => {
|
|
851
757
|
const showNotification = actionsGlobal.useShowNotification();
|
|
852
758
|
react.useEffect(() => {
|
|
@@ -860,12 +766,12 @@ const Notifier = props => {
|
|
|
860
766
|
return () => {
|
|
861
767
|
// Remove notification when component "unmounts"
|
|
862
768
|
notification.dismiss && notification.dismiss();
|
|
863
|
-
};
|
|
769
|
+
};
|
|
770
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
864
771
|
}, []); // We want to run this only once, when the component mounts the first time. Therefore we need to pass an empty array, even though the eslint rule shows a warning.
|
|
865
772
|
|
|
866
773
|
return null;
|
|
867
774
|
};
|
|
868
|
-
|
|
869
775
|
Notifier.propTypes = {
|
|
870
776
|
domain: _pt__default["default"].any.isRequired,
|
|
871
777
|
kind: _pt__default["default"].any.isRequired,
|