botframework-webchat-component
Version:
React component of botframework-webchat
117 lines (87 loc) • 13.3 kB
JavaScript
;
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.connectSendStatus = exports.default = void 0;
var _botframeworkWebchatCore = require("botframework-webchat-core");
var _botframeworkWebchatApi = require("botframework-webchat-api");
var _propTypes = _interopRequireDefault(require("prop-types"));
var _react = _interopRequireWildcard(require("react"));
var _connectToWebChat = _interopRequireDefault(require("../../../connectToWebChat"));
var _ScreenReaderText = _interopRequireDefault(require("../../../ScreenReaderText"));
var _SendFailedRetry = _interopRequireDefault(require("./SendFailedRetry"));
var _useFocus = _interopRequireDefault(require("../../../hooks/useFocus"));
var _useStyleSet3 = _interopRequireDefault(require("../../../hooks/useStyleSet"));
function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
function _iterableToArrayLimit(arr, i) { if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
var useLocalizer = _botframeworkWebchatApi.hooks.useLocalizer,
usePostActivity = _botframeworkWebchatApi.hooks.usePostActivity;
var _Constants$ActivityCl = _botframeworkWebchatCore.Constants.ActivityClientState,
SEND_FAILED = _Constants$ActivityCl.SEND_FAILED,
SENDING = _Constants$ActivityCl.SENDING;
var connectSendStatus = function connectSendStatus() {
for (var _len = arguments.length, selectors = new Array(_len), _key = 0; _key < _len; _key++) {
selectors[_key] = arguments[_key];
}
return _connectToWebChat.default.apply(void 0, [function (_ref, _ref2) {
var focusSendBox = _ref.focusSendBox,
language = _ref.language,
postActivity = _ref.postActivity;
var activity = _ref2.activity;
return {
language: language,
retrySend: function retrySend(evt) {
evt.preventDefault();
postActivity(activity); // After clicking on "retry", the button will be removed from the DOM and focus will be lost (back to document.body)
// This ensures that focus will stay within Web Chat
focusSendBox();
}
};
}].concat(selectors));
};
exports.connectSendStatus = connectSendStatus;
var SendStatus = function SendStatus(_ref3) {
var activity = _ref3.activity,
sendState = _ref3.sendState;
var _useStyleSet = (0, _useStyleSet3.default)(),
_useStyleSet2 = _slicedToArray(_useStyleSet, 1),
sendStatusStyleSet = _useStyleSet2[0].sendStatus;
var focus = (0, _useFocus.default)();
var localize = useLocalizer();
var postActivity = usePostActivity();
var sendingText = localize('ACTIVITY_STATUS_SEND_STATUS_ALT_SENDING');
var label = localize('ACTIVITY_STATUS_SEND_STATUS_ALT', sendingText);
var handleRetryClick = (0, _react.useCallback)(function () {
postActivity(activity); // After clicking on "retry", the button will be gone and focus will be lost (back to document.body)
// We want to make sure the user stay inside Web Chat
focus('sendBoxWithoutKeyboard');
}, [activity, focus, postActivity]);
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_ScreenReaderText.default, {
text: label
}), /*#__PURE__*/_react.default.createElement("span", {
"aria-hidden": true,
className: sendStatusStyleSet
}, sendState === SENDING ? sendingText : sendState === SEND_FAILED ? /*#__PURE__*/_react.default.createElement(_SendFailedRetry.default, {
onRetryClick: handleRetryClick
}) : false));
};
SendStatus.propTypes = {
activity: _propTypes.default.shape({
channelData: _propTypes.default.shape({
clientTimestamp: _propTypes.default.string,
state: _propTypes.default.string
})
}).isRequired,
sendState: _propTypes.default.oneOf([SENDING, SEND_FAILED]).isRequired
};
var _default = SendStatus;
exports.default = _default;
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9NaWRkbGV3YXJlL0FjdGl2aXR5U3RhdHVzL1NlbmRTdGF0dXMvU2VuZFN0YXR1cy5qcyJdLCJuYW1lcyI6WyJ1c2VMb2NhbGl6ZXIiLCJob29rcyIsInVzZVBvc3RBY3Rpdml0eSIsIkNvbnN0YW50cyIsIkFjdGl2aXR5Q2xpZW50U3RhdGUiLCJTRU5EX0ZBSUxFRCIsIlNFTkRJTkciLCJjb25uZWN0U2VuZFN0YXR1cyIsInNlbGVjdG9ycyIsImNvbm5lY3RUb1dlYkNoYXQiLCJmb2N1c1NlbmRCb3giLCJsYW5ndWFnZSIsInBvc3RBY3Rpdml0eSIsImFjdGl2aXR5IiwicmV0cnlTZW5kIiwiZXZ0IiwicHJldmVudERlZmF1bHQiLCJTZW5kU3RhdHVzIiwic2VuZFN0YXRlIiwic2VuZFN0YXR1c1N0eWxlU2V0Iiwic2VuZFN0YXR1cyIsImZvY3VzIiwibG9jYWxpemUiLCJzZW5kaW5nVGV4dCIsImxhYmVsIiwiaGFuZGxlUmV0cnlDbGljayIsInByb3BUeXBlcyIsIlByb3BUeXBlcyIsInNoYXBlIiwiY2hhbm5lbERhdGEiLCJjbGllbnRUaW1lc3RhbXAiLCJzdHJpbmciLCJzdGF0ZSIsImlzUmVxdWlyZWQiLCJvbmVPZiJdLCJtYXBwaW5ncyI6Ijs7Ozs7Ozs7O0FBQUE7O0FBQ0E7O0FBQ0E7O0FBQ0E7O0FBRUE7O0FBQ0E7O0FBQ0E7O0FBQ0E7O0FBQ0E7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O0lBRVFBLFksR0FBa0NDLDZCLENBQWxDRCxZO0lBQWNFLGUsR0FBb0JELDZCLENBQXBCQyxlOzRCQUlsQkMsa0MsQ0FERkMsbUI7SUFBdUJDLFcseUJBQUFBLFc7SUFBYUMsTyx5QkFBQUEsTzs7QUFHdEMsSUFBTUMsaUJBQWlCLEdBQUcsU0FBcEJBLGlCQUFvQjtBQUFBLG9DQUFJQyxTQUFKO0FBQUlBLElBQUFBLFNBQUo7QUFBQTs7QUFBQSxTQUN4QkMseUNBQ0U7QUFBQSxRQUFHQyxZQUFILFFBQUdBLFlBQUg7QUFBQSxRQUFpQkMsUUFBakIsUUFBaUJBLFFBQWpCO0FBQUEsUUFBMkJDLFlBQTNCLFFBQTJCQSxZQUEzQjtBQUFBLFFBQTZDQyxRQUE3QyxTQUE2Q0EsUUFBN0M7QUFBQSxXQUE2RDtBQUMzREYsTUFBQUEsUUFBUSxFQUFSQSxRQUQyRDtBQUUzREcsTUFBQUEsU0FBUyxFQUFFLG1CQUFBQyxHQUFHLEVBQUk7QUFDaEJBLFFBQUFBLEdBQUcsQ0FBQ0MsY0FBSjtBQUVBSixRQUFBQSxZQUFZLENBQUNDLFFBQUQsQ0FBWixDQUhnQixDQUtoQjtBQUNBOztBQUNBSCxRQUFBQSxZQUFZO0FBQ2I7QUFWMEQsS0FBN0Q7QUFBQSxHQURGLFNBYUtGLFNBYkwsRUFEd0I7QUFBQSxDQUExQjs7OztBQWlCQSxJQUFNUyxVQUFVLEdBQUcsU0FBYkEsVUFBYSxRQUE2QjtBQUFBLE1BQTFCSixRQUEwQixTQUExQkEsUUFBMEI7QUFBQSxNQUFoQkssU0FBZ0IsU0FBaEJBLFNBQWdCOztBQUFBLHFCQUNELDRCQURDO0FBQUE7QUFBQSxNQUN6QkMsa0JBRHlCLG9CQUNyQ0MsVUFEcUM7O0FBRTlDLE1BQU1DLEtBQUssR0FBRyx3QkFBZDtBQUNBLE1BQU1DLFFBQVEsR0FBR3RCLFlBQVksRUFBN0I7QUFDQSxNQUFNWSxZQUFZLEdBQUdWLGVBQWUsRUFBcEM7QUFFQSxNQUFNcUIsV0FBVyxHQUFHRCxRQUFRLENBQUMseUNBQUQsQ0FBNUI7QUFFQSxNQUFNRSxLQUFLLEdBQUdGLFFBQVEsQ0FBQyxpQ0FBRCxFQUFvQ0MsV0FBcEMsQ0FBdEI7QUFFQSxNQUFNRSxnQkFBZ0IsR0FBRyx3QkFBWSxZQUFNO0FBQ3pDYixJQUFBQSxZQUFZLENBQUNDLFFBQUQsQ0FBWixDQUR5QyxDQUd6QztBQUNBOztBQUNBUSxJQUFBQSxLQUFLLENBQUMsd0JBQUQsQ0FBTDtBQUNELEdBTndCLEVBTXRCLENBQUNSLFFBQUQsRUFBV1EsS0FBWCxFQUFrQlQsWUFBbEIsQ0FOc0IsQ0FBekI7QUFRQSxzQkFDRSw2QkFBQyxjQUFELENBQU8sUUFBUCxxQkFDRSw2QkFBQyx5QkFBRDtBQUFrQixJQUFBLElBQUksRUFBRVk7QUFBeEIsSUFERixlQUVFO0FBQU0sbUJBQWEsSUFBbkI7QUFBeUIsSUFBQSxTQUFTLEVBQUVMO0FBQXBDLEtBQ0dELFNBQVMsS0FBS1osT0FBZCxHQUNDaUIsV0FERCxHQUVHTCxTQUFTLEtBQUtiLFdBQWQsZ0JBQ0YsNkJBQUMsd0JBQUQ7QUFBaUIsSUFBQSxZQUFZLEVBQUVvQjtBQUEvQixJQURFLEdBR0YsS0FOSixDQUZGLENBREY7QUFjRCxDQWhDRDs7QUFrQ0FSLFVBQVUsQ0FBQ1MsU0FBWCxHQUF1QjtBQUNyQmIsRUFBQUEsUUFBUSxFQUFFYyxtQkFBVUMsS0FBVixDQUFnQjtBQUN4QkMsSUFBQUEsV0FBVyxFQUFFRixtQkFBVUMsS0FBVixDQUFnQjtBQUMzQkUsTUFBQUEsZUFBZSxFQUFFSCxtQkFBVUksTUFEQTtBQUUzQkMsTUFBQUEsS0FBSyxFQUFFTCxtQkFBVUk7QUFGVSxLQUFoQjtBQURXLEdBQWhCLEVBS1BFLFVBTmtCO0FBT3JCZixFQUFBQSxTQUFTLEVBQUVTLG1CQUFVTyxLQUFWLENBQWdCLENBQUM1QixPQUFELEVBQVVELFdBQVYsQ0FBaEIsRUFBd0M0QjtBQVA5QixDQUF2QjtlQVVlaEIsVSIsInNvdXJjZVJvb3QiOiJjb21wb25lbnQ6Ly8vIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29uc3RhbnRzIH0gZnJvbSAnYm90ZnJhbWV3b3JrLXdlYmNoYXQtY29yZSc7XG5pbXBvcnQgeyBob29rcyB9IGZyb20gJ2JvdGZyYW1ld29yay13ZWJjaGF0LWFwaSc7XG5pbXBvcnQgUHJvcFR5cGVzIGZyb20gJ3Byb3AtdHlwZXMnO1xuaW1wb3J0IFJlYWN0LCB7IHVzZUNhbGxiYWNrIH0gZnJvbSAncmVhY3QnO1xuXG5pbXBvcnQgY29ubmVjdFRvV2ViQ2hhdCBmcm9tICcuLi8uLi8uLi9jb25uZWN0VG9XZWJDaGF0JztcbmltcG9ydCBTY3JlZW5SZWFkZXJUZXh0IGZyb20gJy4uLy4uLy4uL1NjcmVlblJlYWRlclRleHQnO1xuaW1wb3J0IFNlbmRGYWlsZWRSZXRyeSBmcm9tICcuL1NlbmRGYWlsZWRSZXRyeSc7XG5pbXBvcnQgdXNlRm9jdXMgZnJvbSAnLi4vLi4vLi4vaG9va3MvdXNlRm9jdXMnO1xuaW1wb3J0IHVzZVN0eWxlU2V0IGZyb20gJy4uLy4uLy4uL2hvb2tzL3VzZVN0eWxlU2V0JztcblxuY29uc3QgeyB1c2VMb2NhbGl6ZXIsIHVzZVBvc3RBY3Rpdml0eSB9ID0gaG9va3M7XG5cbmNvbnN0IHtcbiAgQWN0aXZpdHlDbGllbnRTdGF0ZTogeyBTRU5EX0ZBSUxFRCwgU0VORElORyB9XG59ID0gQ29uc3RhbnRzO1xuXG5jb25zdCBjb25uZWN0U2VuZFN0YXR1cyA9ICguLi5zZWxlY3RvcnMpID0+XG4gIGNvbm5lY3RUb1dlYkNoYXQoXG4gICAgKHsgZm9jdXNTZW5kQm94LCBsYW5ndWFnZSwgcG9zdEFjdGl2aXR5IH0sIHsgYWN0aXZpdHkgfSkgPT4gKHtcbiAgICAgIGxhbmd1YWdlLFxuICAgICAgcmV0cnlTZW5kOiBldnQgPT4ge1xuICAgICAgICBldnQucHJldmVudERlZmF1bHQoKTtcblxuICAgICAgICBwb3N0QWN0aXZpdHkoYWN0aXZpdHkpO1xuXG4gICAgICAgIC8vIEFmdGVyIGNsaWNraW5nIG9uIFwicmV0cnlcIiwgdGhlIGJ1dHRvbiB3aWxsIGJlIHJlbW92ZWQgZnJvbSB0aGUgRE9NIGFuZCBmb2N1cyB3aWxsIGJlIGxvc3QgKGJhY2sgdG8gZG9jdW1lbnQuYm9keSlcbiAgICAgICAgLy8gVGhpcyBlbnN1cmVzIHRoYXQgZm9jdXMgd2lsbCBzdGF5IHdpdGhpbiBXZWIgQ2hhdFxuICAgICAgICBmb2N1c1NlbmRCb3goKTtcbiAgICAgIH1cbiAgICB9KSxcbiAgICAuLi5zZWxlY3RvcnNcbiAgKTtcblxuY29uc3QgU2VuZFN0YXR1cyA9ICh7IGFjdGl2aXR5LCBzZW5kU3RhdGUgfSkgPT4ge1xuICBjb25zdCBbeyBzZW5kU3RhdHVzOiBzZW5kU3RhdHVzU3R5bGVTZXQgfV0gPSB1c2VTdHlsZVNldCgpO1xuICBjb25zdCBmb2N1cyA9IHVzZUZvY3VzKCk7XG4gIGNvbnN0IGxvY2FsaXplID0gdXNlTG9jYWxpemVyKCk7XG4gIGNvbnN0IHBvc3RBY3Rpdml0eSA9IHVzZVBvc3RBY3Rpdml0eSgpO1xuXG4gIGNvbnN0IHNlbmRpbmdUZXh0ID0gbG9jYWxpemUoJ0FDVElWSVRZX1NUQVRVU19TRU5EX1NUQVRVU19BTFRfU0VORElORycpO1xuXG4gIGNvbnN0IGxhYmVsID0gbG9jYWxpemUoJ0FDVElWSVRZX1NUQVRVU19TRU5EX1NUQVRVU19BTFQnLCBzZW5kaW5nVGV4dCk7XG5cbiAgY29uc3QgaGFuZGxlUmV0cnlDbGljayA9IHVzZUNhbGxiYWNrKCgpID0+IHtcbiAgICBwb3N0QWN0aXZpdHkoYWN0aXZpdHkpO1xuXG4gICAgLy8gQWZ0ZXIgY2xpY2tpbmcgb24gXCJyZXRyeVwiLCB0aGUgYnV0dG9uIHdpbGwgYmUgZ29uZSBhbmQgZm9jdXMgd2lsbCBiZSBsb3N0IChiYWNrIHRvIGRvY3VtZW50LmJvZHkpXG4gICAgLy8gV2Ugd2FudCB0byBtYWtlIHN1cmUgdGhlIHVzZXIgc3RheSBpbnNpZGUgV2ViIENoYXRcbiAgICBmb2N1cygnc2VuZEJveFdpdGhvdXRLZXlib2FyZCcpO1xuICB9LCBbYWN0aXZpdHksIGZvY3VzLCBwb3N0QWN0aXZpdHldKTtcblxuICByZXR1cm4gKFxuICAgIDxSZWFjdC5GcmFnbWVudD5cbiAgICAgIDxTY3JlZW5SZWFkZXJUZXh0IHRleHQ9e2xhYmVsfSAvPlxuICAgICAgPHNwYW4gYXJpYS1oaWRkZW49e3RydWV9IGNsYXNzTmFtZT17c2VuZFN0YXR1c1N0eWxlU2V0fT5cbiAgICAgICAge3NlbmRTdGF0ZSA9PT0gU0VORElORyA/IChcbiAgICAgICAgICBzZW5kaW5nVGV4dFxuICAgICAgICApIDogc2VuZFN0YXRlID09PSBTRU5EX0ZBSUxFRCA/IChcbiAgICAgICAgICA8U2VuZEZhaWxlZFJldHJ5IG9uUmV0cnlDbGljaz17aGFuZGxlUmV0cnlDbGlja30gLz5cbiAgICAgICAgKSA6IChcbiAgICAgICAgICBmYWxzZVxuICAgICAgICApfVxuICAgICAgPC9zcGFuPlxuICAgIDwvUmVhY3QuRnJhZ21lbnQ+XG4gICk7XG59O1xuXG5TZW5kU3RhdHVzLnByb3BUeXBlcyA9IHtcbiAgYWN0aXZpdHk6IFByb3BUeXBlcy5zaGFwZSh7XG4gICAgY2hhbm5lbERhdGE6IFByb3BUeXBlcy5zaGFwZSh7XG4gICAgICBjbGllbnRUaW1lc3RhbXA6IFByb3BUeXBlcy5zdHJpbmcsXG4gICAgICBzdGF0ZTogUHJvcFR5cGVzLnN0cmluZ1xuICAgIH0pXG4gIH0pLmlzUmVxdWlyZWQsXG4gIHNlbmRTdGF0ZTogUHJvcFR5cGVzLm9uZU9mKFtTRU5ESU5HLCBTRU5EX0ZBSUxFRF0pLmlzUmVxdWlyZWRcbn07XG5cbmV4cG9ydCBkZWZhdWx0IFNlbmRTdGF0dXM7XG5cbmV4cG9ydCB7IGNvbm5lY3RTZW5kU3RhdHVzIH07XG4iXX0=