@atlaskit/editor-plugin-synced-block
Version:
SyncedBlock plugin for @atlaskit/editor-core
151 lines (149 loc) • 8.07 kB
JavaScript
;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
var _typeof = require("@babel/runtime/helpers/typeof");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.Flag = void 0;
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _react = _interopRequireDefault(require("react"));
var _reactIntlNext = require("react-intl-next");
var _hooks = require("@atlaskit/editor-common/hooks");
var _messages = require("@atlaskit/editor-common/messages");
var _syncBlock = require("@atlaskit/editor-common/sync-block");
var _editorPluginConnectivity = require("@atlaskit/editor-plugin-connectivity");
var _flag = _interopRequireWildcard(require("@atlaskit/flag"));
var _statusSuccess = _interopRequireDefault(require("@atlaskit/icon/core/status-success"));
var _statusWarning = _interopRequireDefault(require("@atlaskit/icon/core/status-warning"));
var _main = require("../pm-plugins/main");
var _types = require("../types");
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(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 t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
var flagMap = (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, _types.FLAG_ID.CANNOT_DELETE_WHEN_OFFLINE, {
title: _messages.syncBlockMessages.failToDeleteTitle,
description: _messages.syncBlockMessages.failToDeleteWhenOfflineDescription,
type: 'error'
}), _types.FLAG_ID.CANNOT_EDIT_WHEN_OFFLINE, {
title: _messages.syncBlockMessages.failToEditTitle,
description: _messages.syncBlockMessages.failToEditWhenOfflineDescription,
type: 'error'
}), _types.FLAG_ID.CANNOT_CREATE_WHEN_OFFLINE, {
title: _messages.syncBlockMessages.failToCreateTitle,
description: _messages.syncBlockMessages.failToCreateWhenOfflineDescription,
type: 'error'
}), _types.FLAG_ID.FAIL_TO_DELETE, {
title: _messages.syncBlockMessages.cannotDeleteTitle,
description: _messages.syncBlockMessages.cannotDeleteDescription,
type: 'error'
}), _types.FLAG_ID.SYNC_BLOCK_COPIED, {
title: _messages.syncBlockMessages.syncBlockCopiedTitle,
type: 'info'
}), _types.FLAG_ID.UNPUBLISHED_SYNC_BLOCK_PASTED, {
title: _messages.syncBlockMessages.unpublishedSyncBlockPastedTitle,
description: _messages.syncBlockMessages.unpublishedSyncBlockPastedDescription,
type: 'info'
}), _types.FLAG_ID.CANNOT_CREATE_SYNC_BLOCK, {
title: _messages.syncBlockMessages.cannotCreateSyncBlockTitle,
description: _messages.syncBlockMessages.CannotCreateSyncBlockDescription,
type: 'error'
}), _types.FLAG_ID.EXTENSION_IN_SYNC_BLOCK, {
title: _messages.syncBlockMessages.extensionInSyncBlockTitle,
description: _messages.syncBlockMessages.extensionInSyncBlockDescription,
type: 'error'
}), _types.FLAG_ID.INLINE_EXTENSION_IN_SYNC_BLOCK, {
title: _messages.syncBlockMessages.inlineExtensionInSyncBlockTitle,
description: _messages.syncBlockMessages.inlineExtensionInSyncBlockDescription,
type: 'error'
}), _types.FLAG_ID.DUPLICATE_SOURCE_SYNC_BLOCK, {
title: _messages.syncBlockMessages.duplicateSourceSyncBlockTitle,
description: _messages.syncBlockMessages.duplicateSourceSyncBlockDescription,
type: 'error'
});
var Flag = exports.Flag = function Flag(_ref) {
var api = _ref.api;
var _useSharedPluginState = (0, _hooks.useSharedPluginStateWithSelector)(api, ['syncedBlock', 'connectivity'], function (states) {
var _states$syncedBlockSt, _states$connectivityS;
return {
activeFlag: (_states$syncedBlockSt = states.syncedBlockState) === null || _states$syncedBlockSt === void 0 ? void 0 : _states$syncedBlockSt.activeFlag,
mode: (_states$connectivityS = states.connectivityState) === null || _states$connectivityS === void 0 ? void 0 : _states$connectivityS.mode
};
}),
activeFlag = _useSharedPluginState.activeFlag,
mode = _useSharedPluginState.mode;
var _useIntl = (0, _reactIntlNext.useIntl)(),
formatMessage = _useIntl.formatMessage;
if (!activeFlag) {
return;
}
var _flagMap$activeFlag$i = flagMap[activeFlag.id],
title = _flagMap$activeFlag$i.title,
description = _flagMap$activeFlag$i.description,
action = _flagMap$activeFlag$i.action,
type = _flagMap$activeFlag$i.type;
var onRetry = activeFlag.onRetry,
onDismissedCallback = activeFlag.onDismissed;
// Retry button often involves network request, hence we dismiss the flag in offline mode to avoid retry
if ((0, _editorPluginConnectivity.isOfflineMode)(mode) && !!onRetry) {
api === null || api === void 0 || api.core.actions.execute(function (_ref2) {
var tr = _ref2.tr;
tr.setMeta(_main.syncedBlockPluginKey, {
activeFlag: false
});
return tr;
});
return;
}
var onDismissed = function onDismissed() {
api === null || api === void 0 || api.core.actions.execute(function (_ref3) {
var tr = _ref3.tr;
onDismissedCallback === null || onDismissedCallback === void 0 || onDismissedCallback(tr);
var oldMeta = tr.getMeta(_main.syncedBlockPluginKey);
tr.setMeta(_main.syncedBlockPluginKey, _objectSpread(_objectSpread({}, oldMeta), {}, {
activeFlag: false
}));
return tr;
});
api === null || api === void 0 || api.core.actions.focus();
};
var typeToActions = function typeToActions() {
if (type === 'error') {
if (onRetry) {
return [{
content: formatMessage(_messages.syncBlockMessages.deleteRetryButton),
onClick: onRetry
}];
}
} else if (type === 'info' && action) {
return [{
content: formatMessage(action),
href: _syncBlock.SYNCED_BLOCKS_DOCUMENTATION_URL,
target: '_blank',
rel: 'noopener noreferrer'
}];
}
return undefined;
};
var FlagComponent = type === 'info' ? _flag.AutoDismissFlag : _flag.default;
return /*#__PURE__*/_react.default.createElement(_flag.FlagGroup, null, /*#__PURE__*/_react.default.createElement(FlagComponent, {
onDismissed: onDismissed,
title: formatMessage(title),
description: description ? formatMessage(description) : undefined,
id: activeFlag.id,
testId: activeFlag.id,
icon: typeToIcon(type),
actions: typeToActions()
}));
};
var typeToIcon = function typeToIcon(type) {
if (type === 'error') {
return /*#__PURE__*/_react.default.createElement(_statusWarning.default, {
label: "",
color: "var(--ds-icon-warning, #E06C00)"
});
}
return /*#__PURE__*/_react.default.createElement(_statusSuccess.default, {
label: "",
color: "var(--ds-icon-success, #6A9A23)"
});
};