@commercetools-frontend/actions-global
Version:
Global redux actions for a MC application
197 lines (179 loc) • 8.83 kB
JavaScript
import history from '@commercetools-frontend/browser-history';
import { NOTIFICATION_DOMAINS, NOTIFICATION_KINDS_SIDE, DOMAINS, STATUS_CODES, LOGOUT_REASONS, HIDE_ALL_PAGE_NOTIFICATIONS } from '@commercetools-frontend/constants';
import { reportErrorToSentry } from '@commercetools-frontend/sentry';
import _Array$isArray from '@babel/runtime-corejs3/core-js-stable/array/is-array';
import _defineProperty from '@babel/runtime-corejs3/helpers/esm/defineProperty';
import _includesInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/includes';
import _Object$values from '@babel/runtime-corejs3/core-js-stable/object/values';
import _Object$keys from '@babel/runtime-corejs3/core-js-stable/object/keys';
import _Object$getOwnPropertySymbols from '@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols';
import _filterInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/filter';
import _Object$getOwnPropertyDescriptor from '@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor';
import _forEachInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/for-each';
import _Object$getOwnPropertyDescriptors from '@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors';
import _Object$defineProperties from '@babel/runtime-corejs3/core-js-stable/object/define-properties';
import _Object$defineProperty from '@babel/runtime-corejs3/core-js-stable/object/define-property';
import isNumber from 'lodash/isNumber';
import { addNotification } from '@commercetools-frontend/notifications';
import { useCallback } from 'react';
import { useDispatch } from 'react-redux';
// NOTE: This string will be replaced on build time with the package version.
var version = "24.2.0";
function ownKeys$1(e, r) { var t = _Object$keys(e); if (_Object$getOwnPropertySymbols) { var o = _Object$getOwnPropertySymbols(e); r && (o = _filterInstanceProperty(o).call(o, function (r) { return _Object$getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread$1(e) { for (var r = 1; r < arguments.length; r++) { var _context2, _context3; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context2 = ownKeys$1(Object(t), !0)).call(_context2, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context3 = ownKeys$1(Object(t))).call(_context3, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
function showNotification(notification) {
let meta = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
if (process.env.NODE_ENV !== 'production') if (notification.domain) {
var _context;
if (!_includesInstanceProperty(_context = _Object$values(NOTIFICATION_DOMAINS)).call(_context, notification.domain))
// eslint-disable-next-line no-console
console.warn(`Unknown notification domain "${notification.domain}"`, notification);
}
// eslint-disable-next-line no-console
else console.warn('Notification is missing domain', notification);
let dismissAfter = meta.dismissAfter;
if (!isNumber(dismissAfter)) dismissAfter = notification.kind === NOTIFICATION_KINDS_SIDE.success ? 5000 : 0;
return addNotification(notification, _objectSpread$1(_objectSpread$1({}, meta), {}, {
dismissAfter
}));
}
function showApiErrorNotification(_ref) {
let errors = _ref.errors;
return showNotification({
id: 0,
domain: DOMAINS.PAGE,
kind: 'api-error',
values: {
// NOTE: Some sources or errors (e.g. GraphQL) return an array or object.
// The cast into an array happens here so that consumers can pass both types.
errors: _Array$isArray(errors) ? errors : [errors]
}
}, {
dismissAfter: 0
});
}
function showUnexpectedErrorNotification() {
let _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
errorId = _ref.errorId;
return showNotification({
id: 0,
domain: DOMAINS.PAGE,
kind: 'unexpected-error',
values: {
errorId
}
}, {
dismissAfter: 0
});
}
function isApiError(error) {
return error.body !== undefined;
}
function handleActionError(error) {
return dispatch => {
// On production we send the errors to Sentry.
// eslint-disable-next-line no-console
if (window.app.env !== 'production') console.error(error, error instanceof Error && error.stack);
if (!isApiError(error)) {
const errorId = reportErrorToSentry(error);
return dispatch(showUnexpectedErrorNotification({
errorId
}));
}
// When unauthorized, log the user out.
if (error.statusCode === STATUS_CODES.UNAUTHORIZED) {
history.push(`/logout?reason=${LOGOUT_REASONS.UNAUTHORIZED}`);
}
// We need to do the return, because if not we see an error notification
// The error is handled with the handleUnavailableResource HoC to show the PageNotFound component
// when the api returns 404
if (error.statusCode === STATUS_CODES.NOT_FOUND) return null;
return dispatch(showApiErrorNotification({
errors: error.body.errors || [
// Pass a fallback error so that our error components can handle it
{
message: error.body.message
}]
}));
};
}
function hideAllPageNotifications() {
return {
type: HIDE_ALL_PAGE_NOTIFICATIONS
};
}
function ownKeys(e, r) { var t = _Object$keys(e); if (_Object$getOwnPropertySymbols) { var o = _Object$getOwnPropertySymbols(e); r && (o = _filterInstanceProperty(o).call(o, function (r) { return _Object$getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context = ownKeys(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context2 = ownKeys(Object(t))).call(_context2, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
/**
* Dispatch a notification.
*
* @example
* const showSuccessNotification = useShowNotification();
* showSuccessNotification({
* domain: NOTIFICATION_DOMAINS.SIDE,
* kind: NOTIFICATION_KINDS_SIDE.success,
* text: "All good!",
* });
*/
/**
* Dispatch a notification.
*
* @deprecated: Avoid passing the notification options here.
* Instead define them in the notification function itself.
*
* @example
* Bad:
* const showSuccessNotification = useShowNotification({
* domain: NOTIFICATION_DOMAINS.SIDE,
* kind: NOTIFICATION_KINDS_SIDE.success,
* });
* showSuccessNotification({
* text: "All good!",
* });
*
* Good:
* const showSuccessNotification = useShowNotification();
* showSuccessNotification({
* domain: NOTIFICATION_DOMAINS.SIDE,
* kind: NOTIFICATION_KINDS_SIDE.success,
* text: "All good!",
* });
*/
function useShowNotification(notificationFragment) {
const dispatch = useDispatch();
return useCallback((content, meta) => {
const notification = showNotification(_objectSpread(_objectSpread({}, notificationFragment), content), meta);
return dispatch(notification);
}, [dispatch, notificationFragment]);
}
/**
* Dispatch an API error notification.
*
* @example
* const showApiErrorNotification = useShowApiErrorNotification();
* showApiErrorNotification({ errors });
*/
function useShowApiErrorNotification() {
const dispatch = useDispatch();
return useCallback(options => dispatch(showApiErrorNotification(options)), [dispatch]);
}
/**
* Dispatch an unexpected error notification.
*
* @example
* const showUnexpectedErrorNotification = useShowUnexpectedErrorNotification();
* showUnexpectedErrorNotification({ errors });
*/
function useShowUnexpectedErrorNotification() {
const dispatch = useDispatch();
return useCallback(options => dispatch(showUnexpectedErrorNotification(options)), [dispatch]);
}
function useHideAllPageNotifications() {
const dispatch = useDispatch();
return useCallback(() => dispatch(hideAllPageNotifications()), [dispatch]);
}
function useOnActionError() {
const dispatch = useDispatch();
return useCallback(error => dispatch(handleActionError(error)), [dispatch]);
}
export { handleActionError, hideAllPageNotifications, showApiErrorNotification, showNotification, showUnexpectedErrorNotification, useHideAllPageNotifications, useOnActionError, useShowApiErrorNotification, useShowNotification, useShowUnexpectedErrorNotification, version };