@reltio/components 1.4.1819 → 1.4.1821

package/cjs/CollaborationItem/components/SendMessageArea/SendMessageArea.js

@@ -0,0 +1,164 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SendMessageArea = void 0;
+var react_1 = __importStar(require("react"));
+var ui_i18n_1 = __importDefault(require("ui-i18n"));
+var classnames_1 = __importDefault(require("classnames"));
+var ramda_1 = require("ramda");
+var Box_1 = __importDefault(require("@mui/material/Box"));
+var Button_1 = __importDefault(require("@mui/material/Button"));
+var MdmModuleContext_1 = require("../../../contexts/MdmModuleContext");
+var CollaborationContext_1 = require("../../../contexts/CollaborationContext");
+var helpers_1 = require("../../helpers");
+var TextFieldWithMentions_1 = require("../TextFieldWithMentions");
+var Avatar_1 = require("../Avatar");
+var styles_1 = require("./styles");
+var getPlaceholder = function (status) {
+    switch (status) {
+        case 'open':
+            return ui_i18n_1.default.text('Reply...');
+        case 'resolved':
+            return ui_i18n_1.default.text('Adding a comment will re-open this');
+        default:
+            return '';
+    }
+};
+var getButtonText = function (status, isEditingComment, isEditingReply) {
+    if (isEditingComment || isEditingReply) {
+        return ui_i18n_1.default.text('Edit');
+    }
+    if (status === 'open' || status === 'resolved') {
+        return ui_i18n_1.default.text('Reply');
+    }
+    return ui_i18n_1.default.text('Comment');
+};
+var getDefaultCommentState = function (_a) {
+    var comment = _a.comment, reply = _a.reply, isEditingComment = _a.isEditingComment, isEditingReply = _a.isEditingReply;
+    var commentOrReply = isEditingComment ? comment : isEditingReply ? reply : null;
+    var _b = commentOrReply || {}, _c = _b.content, plainTextValue = _c === void 0 ? '' : _c, _d = _b.namedUsers, mentions = _d === void 0 ? [] : _d;
+    return {
+        value: (0, helpers_1.transformPlainTextValueToValueWithMentions)(plainTextValue, mentions),
+        plainTextValue: plainTextValue,
+        mentions: mentions
+    };
+};
+var SendMessageArea = function (_a) {
+    var inputRef = _a.inputRef, className = _a.className, uri = _a.uri, relatedObjectUris = _a.relatedObjectUris, objectType = _a.objectType, popperRef = _a.popperRef, comment = _a.comment, reply = _a.reply, isEditingComment = _a.isEditingComment, isEditingReply = _a.isEditingReply, onCancel = _a.onCancel;
+    var isEditing = isEditingComment || isEditingReply;
+    var styles = (0, styles_1.useStyles)({ isEditing: isEditing });
+    var _b = (0, react_1.useState)(false), focused = _b[0], setFocused = _b[1];
+    var _c = (0, react_1.useContext)(CollaborationContext_1.CollaborationContext), createReply = _c.createReply, createComment = _c.createComment, sending = _c.sending, editComment = _c.editComment, editReply = _c.editReply, getCommentState = _c.getCommentState, updateCommentState = _c.updateCommentState, clearCommentState = _c.clearCommentState;
+    var username = (0, MdmModuleContext_1.useMdmUsername)();
+    var commentUri = (0, helpers_1.createCommentUri)({ comment: comment, reply: reply, isEditingComment: isEditingComment, isEditingReply: isEditingReply });
+    var defaultCommentState = getDefaultCommentState({ comment: comment, reply: reply, isEditingComment: isEditingComment, isEditingReply: isEditingReply });
+    var _d = getCommentState(uri, commentUri), _e = _d.value, value = _e === void 0 ? defaultCommentState.value : _e, _f = _d.plainTextValue, plainTextValue = _f === void 0 ? defaultCommentState.plainTextValue : _f, _g = _d.mentions, mentions = _g === void 0 ? defaultCommentState.mentions : _g;
+    var hasValue = value.trim() !== '';
+    var shouldShowButtons = focused || hasValue;
+    var status = comment === null || comment === void 0 ? void 0 : comment.status;
+    var clearValue = function () {
+        onCancel === null || onCancel === void 0 ? void 0 : onCancel();
+        clearCommentState(uri, commentUri);
+    };
+    var handleChange = function (value, plainTextValue, mentions) {
+        return updateCommentState(uri, commentUri, { value: value, plainTextValue: plainTextValue, mentions: mentions });
+    };
+    var handleCancel = function () { return clearValue(); };
+    var handleFocus = function () { return setFocused(true); };
+    var handleBlur = function () { return setFocused(false); };
+    var handleSubmit = function (e) {
+        e.preventDefault();
+        var request = (0, ramda_1.cond)([
+            [
+                (0, ramda_1.always)(!comment),
+                function () {
+                    return createComment({
+                        content: plainTextValue,
+                        namedUsers: mentions,
+                        objectType: objectType,
+                        uri: uri,
+                        relatedObjectUris: relatedObjectUris
+                    });
+                }
+            ],
+            [
+                (0, ramda_1.always)(isEditingComment),
+                function () {
+                    return editComment({
+                        content: plainTextValue,
+                        namedUsers: mentions,
+                        commentId: comment.commentId,
+                        objectType: objectType,
+                        replies: comment.replies,
+                        relatedObjectUris: relatedObjectUris,
+                        uri: uri
+                    });
+                }
+            ],
+            [
+                (0, ramda_1.always)(isEditingReply),
+                function () {
+                    return editReply({
+                        content: plainTextValue,
+                        namedUsers: mentions,
+                        commentId: comment.commentId,
+                        replyId: reply.replyId
+                    });
+                }
+            ],
+            [
+                ramda_1.T,
+                function () {
+                    return createReply({
+                        content: plainTextValue,
+                        namedUsers: mentions,
+                        commentId: comment.commentId,
+                        action: comment.status === 'open' ? 'none' : 'reopen',
+                        uri: uri
+                    });
+                }
+            ]
+        ]);
+        return request().then(clearValue).catch(console.log); //eslint-disable-line no-console
+    };
+    (0, react_1.useEffect)(function () {
+        if (popperRef) {
+            popperRef.current.forceUpdate();
+        }
+    }, [popperRef, shouldShowButtons]);
+    var buttonSize = isEditing ? 'small' : 'medium';
+    return (react_1.default.createElement(Box_1.default, { className: (0, classnames_1.default)(styles.root, className) },
+        react_1.default.createElement("form", { onSubmit: handleSubmit, className: styles.form },
+            react_1.default.createElement(Box_1.default, { className: styles.main },
+                !isEditing && react_1.default.createElement(Avatar_1.Avatar, { classes: { root: styles.avatar } }, username),
+                react_1.default.createElement(TextFieldWithMentions_1.TextFieldWithMentions, { className: styles.textField, disabled: sending, onChange: handleChange, inputRef: inputRef, value: value, onFocus: handleFocus, onBlur: handleBlur, placeholder: getPlaceholder(status) })),
+            shouldShowButtons && (react_1.default.createElement(Box_1.default, { className: styles.buttons },
+                react_1.default.createElement(Button_1.default, { className: styles.button, variant: "contained", color: "primary", disabled: !hasValue || sending, type: "submit", size: buttonSize }, getButtonText(status, isEditingComment, isEditingReply)),
+                react_1.default.createElement(Button_1.default, { disabled: sending, onClick: handleCancel, className: styles.button, variant: "outlined", color: "primary", size: buttonSize }, ui_i18n_1.default.text('Cancel')))))));
+};
+exports.SendMessageArea = SendMessageArea;

package/cjs/CollaborationItem/components/SendMessageArea/SendMessageArea.test.d.ts

@@ -0,0 +1 @@
+export {};

package/cjs/CollaborationItem/components/SendMessageArea/SendMessageArea.test.js

@@ -0,0 +1,477 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = __importDefault(require("react"));
+var enzyme_1 = require("enzyme");
+var test_utils_1 = require("react-dom/test-utils");
+var MdmModuleContext_1 = require("../../../contexts/MdmModuleContext");
+var CollaborationContext_1 = require("../../../contexts/CollaborationContext");
+var TextFieldWithMentions_1 = require("../TextFieldWithMentions");
+var Avatar_1 = require("../Avatar");
+var SendMessageArea_1 = require("./SendMessageArea");
+var createProps = function (comment, extraProps) {
+    if (extraProps === void 0) { extraProps = {}; }
+    return __assign(__assign({ comment: comment, inputRef: react_1.default.createRef() }, extraProps), { objectType: 'objectType', uri: 'uri', relatedObjectUris: ['entities/13JKIKAz'], className: 'root' });
+};
+var createReply = jest.fn().mockReturnValue(new Promise(function (res) { return res(); }));
+var createComment = jest.fn().mockReturnValue(new Promise(function (res) { return res(); }));
+var editCommentWithResolve = jest.fn().mockReturnValue(new Promise(function (res) { return res(); }));
+var editReply = jest.fn().mockReturnValue(new Promise(function (res) { return res(); }));
+var defaultGetCommentState = jest.fn().mockImplementation(function () { return ({}); });
+var clearCommentState = jest.fn();
+var updateCommentState = jest.fn();
+var createCommentObject = function (_a) {
+    var _b = _a === void 0 ? {} : _a, status = _b.status;
+    return {
+        commentId: 'commentId',
+        status: status
+    };
+};
+var collaborationContextValue;
+var mockCollaborationContext = function (_a) {
+    var _b = _a === void 0 ? {} : _a, _c = _b.sending, sending = _c === void 0 ? false : _c, _d = _b.editComment, editComment = _d === void 0 ? editCommentWithResolve : _d, _e = _b.getCommentState, getCommentState = _e === void 0 ? defaultGetCommentState : _e;
+    collaborationContextValue = {
+        createReply: createReply,
+        createComment: createComment,
+        editComment: editComment,
+        editReply: editReply,
+        getCommentState: getCommentState,
+        clearCommentState: clearCommentState,
+        updateCommentState: updateCommentState,
+        sending: sending
+    };
+};
+var user = {
+    username: 'egor.ivanov'
+};
+var setUp = function (props) {
+    return (0, enzyme_1.mount)(react_1.default.createElement(CollaborationContext_1.CollaborationContext.Provider, { value: collaborationContextValue },
+        react_1.default.createElement(MdmModuleContext_1.MdmModuleProvider, { values: { user: user } },
+            react_1.default.createElement(SendMessageArea_1.SendMessageArea, __assign({}, props)))));
+};
+describe('SendMessageArea tests', function () {
+    afterEach(function () {
+        jest.clearAllMocks();
+    });
+    it('should render avatar correctly', function () {
+        mockCollaborationContext();
+        var component = setUp(createProps(createCommentObject({ status: 'open' })));
+        expect(component.find(Avatar_1.Avatar)).toHaveLength(1);
+        expect(component.find(Avatar_1.Avatar).prop('children')).toBe('egor.ivanov');
+    });
+    it('should render input correctly if status is "open"', function () {
+        mockCollaborationContext();
+        var component = setUp(createProps(createCommentObject({ status: 'open' })));
+        expect(component.find(TextFieldWithMentions_1.TextFieldWithMentions)).toHaveLength(1);
+        expect(component.find(TextFieldWithMentions_1.TextFieldWithMentions).prop('placeholder')).toBe('Reply...');
+    });
+    it('should render input correctly if status is "resolved"', function () {
+        mockCollaborationContext();
+        var component = setUp(createProps(createCommentObject({ status: 'resolved' })));
+        expect(component.find(TextFieldWithMentions_1.TextFieldWithMentions)).toHaveLength(1);
+        expect(component.find(TextFieldWithMentions_1.TextFieldWithMentions).prop('placeholder')).toBe('Adding a comment will re-open this');
+    });
+    it('should render input correctly if status is undefined', function () {
+        mockCollaborationContext();
+        var component = setUp(createProps());
+        expect(component.find(TextFieldWithMentions_1.TextFieldWithMentions)).toHaveLength(1);
+        expect(component.find(TextFieldWithMentions_1.TextFieldWithMentions).prop('placeholder')).toBe('');
+    });
+    it('should render Reply button correctly if status is "open"', function () {
+        mockCollaborationContext();
+        var component = setUp(createProps(createCommentObject({ status: 'open' })));
+        component.find(TextFieldWithMentions_1.TextFieldWithMentions).find('textarea').simulate('focus');
+        var buttons = component.find('.buttons').last();
+        expect(buttons.childAt(0).text()).toBe('Reply');
+    });
+    it('should render Reply button correctly if status is "resolved"', function () {
+        mockCollaborationContext();
+        var component = setUp(createProps(createCommentObject({ status: 'resolved' })));
+        component.find(TextFieldWithMentions_1.TextFieldWithMentions).find('textarea').simulate('focus');
+        var buttons = component.find('.buttons').last();
+        expect(buttons.childAt(0).text()).toBe('Reply');
+    });
+    it('should render Comment button correctly if comment is undefined', function () {
+        mockCollaborationContext();
+        var component = setUp(createProps());
+        component.find(TextFieldWithMentions_1.TextFieldWithMentions).find('textarea').simulate('focus');
+        var buttons = component.find('.buttons').last();
+        expect(buttons.childAt(0).text()).toBe('Comment');
+    });
+    it('should render buttons if value is not empty string', function () {
+        var getCommentState = jest.fn().mockImplementation(function () { return ({
+            value: 'value',
+            plainTextValue: 'value',
+            mentions: []
+        }); });
+        mockCollaborationContext({ getCommentState: getCommentState });
+        var component = setUp(createProps(createCommentObject({ status: 'open' })));
+        expect(component.find('.buttons').length).toBeTruthy();
+    });
+    it('should render buttons if input is focused', function () {
+        mockCollaborationContext();
+        var component = setUp(createProps(createCommentObject({ status: 'open' })));
+        expect(component.find('.buttons')).toHaveLength(0);
+        component.find(TextFieldWithMentions_1.TextFieldWithMentions).find('textarea').simulate('focus');
+        expect(component.find('.buttons').length).toBeTruthy();
+        component.find(TextFieldWithMentions_1.TextFieldWithMentions).find('textarea').simulate('blur');
+        expect(component.find('.buttons')).toHaveLength(0);
+    });
+    it('should disable Reply or Comment button if value is empty', function () {
+        var getCommentState = jest.fn().mockImplementation(function () { return ({
+            value: 'value',
+            plainTextValue: 'value',
+            mentions: []
+        }); });
+        mockCollaborationContext({ getCommentState: getCommentState });
+        var component = setUp(createProps(createCommentObject({ status: 'open' })));
+        component.find(TextFieldWithMentions_1.TextFieldWithMentions).find('textarea').simulate('focus');
+        var buttons = component.find('.buttons').last();
+        expect(buttons.childAt(0).prop('disabled')).toBe(false);
+    });
+    it('should disable Cancel button if loading is "true"', function () {
+        mockCollaborationContext({ sending: true });
+        var component = setUp(createProps(createCommentObject({ status: 'open' })));
+        component.find(TextFieldWithMentions_1.TextFieldWithMentions).find('textarea').simulate('focus');
+        var buttons = component.find('.buttons').last();
+        expect(buttons.childAt(1).prop('disabled')).toBe(true);
+    });
+    it('should disable Reply or Comment button if loading is "true"', function () {
+        mockCollaborationContext({ sending: true });
+        var component = setUp(createProps(createCommentObject({ status: 'open' })));
+        component.find(TextFieldWithMentions_1.TextFieldWithMentions).find('textarea').simulate('focus');
+        var buttons = component.find('.buttons').last();
+        expect(buttons.childAt(0).prop('disabled')).toBe(true);
+    });
+    it('should pass correct default value to TextFieldWithMentions if isEditingComment equals true', function () {
+        mockCollaborationContext();
+        var comment = {
+            content: 'Hello +denis',
+            namedUsers: ['denis'],
+            commentId: 'commentId',
+            status: 'open'
+        };
+        var component = setUp(createProps(comment, { isEditingComment: true }));
+        expect(component.find(TextFieldWithMentions_1.TextFieldWithMentions).prop('value')).toBe('Hello @[denis](denis)');
+    });
+    it('should pass correct default value to TextFieldWithMentions if isEditingReply equals true', function () {
+        mockCollaborationContext();
+        var reply = {
+            content: 'Hello +ainsteisha',
+            namedUsers: ['ainsteisha'],
+            replyId: 'replyId'
+        };
+        var component = setUp(createProps(createCommentObject(), { isEditingReply: true, reply: reply }));
+        expect(component.find(TextFieldWithMentions_1.TextFieldWithMentions).prop('value')).toBe('Hello @[ainsteisha](ainsteisha)');
+    });
+    it('should pass correct default value to TextFieldWithMentions if isEditingReply and isEditingComment equals false', function () {
+        mockCollaborationContext();
+        var component = setUp(createProps(createCommentObject()));
+        expect(component.find(TextFieldWithMentions_1.TextFieldWithMentions).prop('value')).toBe('');
+    });
+    it('handleChange handler should work correctly', function () {
+        mockCollaborationContext();
+        var component = setUp(createProps());
+        var onChange = component.find(TextFieldWithMentions_1.TextFieldWithMentions).prop('onChange');
+        var value = 'Hello @[+vyacheslav](vyacheslav)';
+        var plainTextValue = 'Hello +vyacheslav';
+        var mentions = ['vyacheslav'];
+        (0, test_utils_1.act)(function () {
+            onChange === null || onChange === void 0 ? void 0 : onChange(value, plainTextValue, mentions);
+        });
+        expect(updateCommentState).toHaveBeenCalledWith('uri', 'comment/new', { value: value, plainTextValue: plainTextValue, mentions: mentions });
+    });
+    it('handleSubmit handler should work correctly if comment exists and last status is "open"', function () { return __awaiter(void 0, void 0, void 0, function () {
+        var getCommentState, component, buttons, preventDefault;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    getCommentState = jest.fn().mockImplementation(function () { return ({
+                        value: 'Hello @[+vyacheslav](vyacheslav)',
+                        plainTextValue: 'Hello +vyacheslav',
+                        mentions: ['vyacheslav']
+                    }); });
+                    mockCollaborationContext({ getCommentState: getCommentState });
+                    component = setUp(createProps(createCommentObject({ status: 'open' })));
+                    buttons = component.find('.buttons').last();
+                    buttons.childAt(0).find('button').simulate('click');
+                    preventDefault = jest.fn();
+                    component.find('.form').simulate('submit', { preventDefault: preventDefault });
+                    expect(preventDefault).toHaveBeenCalled();
+                    expect(createReply).toHaveBeenCalledWith({
+                        content: 'Hello +vyacheslav',
+                        namedUsers: ['vyacheslav'],
+                        commentId: 'commentId',
+                        action: 'none',
+                        uri: 'uri'
+                    });
+                    return [4 /*yield*/, (0, test_utils_1.act)(function () { return __awaiter(void 0, void 0, void 0, function () {
+                            return __generator(this, function (_a) {
+                                component.update();
+                                return [2 /*return*/];
+                            });
+                        }); })];
+                case 1:
+                    _a.sent();
+                    expect(clearCommentState).toHaveBeenCalledWith('uri', 'comment/commentId/reply/new');
+                    return [2 /*return*/];
+            }
+        });
+    }); });
+    it('handleSubmit handler should work correctly if comment exists and last status is "resolved"', function () { return __awaiter(void 0, void 0, void 0, function () {
+        var getCommentState, component, buttons, preventDefault;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    getCommentState = jest.fn().mockImplementation(function () { return ({
+                        value: 'Hello @[+vyacheslav](vyacheslav)',
+                        plainTextValue: 'Hello +vyacheslav',
+                        mentions: ['vyacheslav']
+                    }); });
+                    mockCollaborationContext({ getCommentState: getCommentState });
+                    component = setUp(createProps(createCommentObject({ status: 'resolved' })));
+                    buttons = component.find('.buttons').last();
+                    buttons.childAt(0).find('button').simulate('click');
+                    preventDefault = jest.fn();
+                    component.find('.form').simulate('submit', { preventDefault: preventDefault });
+                    expect(preventDefault).toHaveBeenCalled();
+                    expect(createReply).toHaveBeenCalledWith({
+                        content: 'Hello +vyacheslav',
+                        namedUsers: ['vyacheslav'],
+                        commentId: 'commentId',
+                        action: 'reopen',
+                        uri: 'uri'
+                    });
+                    return [4 /*yield*/, (0, test_utils_1.act)(function () { return __awaiter(void 0, void 0, void 0, function () {
+                            return __generator(this, function (_a) {
+                                component.update();
+                                return [2 /*return*/];
+                            });
+                        }); })];
+                case 1:
+                    _a.sent();
+                    expect(clearCommentState).toHaveBeenCalledWith('uri', 'comment/commentId/reply/new');
+                    return [2 /*return*/];
+            }
+        });
+    }); });
+    it('handleSubmit handler should work correctly if comment does not exist', function () { return __awaiter(void 0, void 0, void 0, function () {
+        var getCommentState, component, buttons, preventDefault;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    getCommentState = jest.fn().mockImplementation(function () { return ({
+                        value: 'Hello @[+vyacheslav](vyacheslav)',
+                        plainTextValue: 'Hello +vyacheslav',
+                        mentions: ['vyacheslav']
+                    }); });
+                    mockCollaborationContext({ getCommentState: getCommentState });
+                    component = setUp(createProps());
+                    buttons = component.find('.buttons').last();
+                    buttons.childAt(0).find('button').simulate('click');
+                    preventDefault = jest.fn();
+                    component.find('.form').simulate('submit', { preventDefault: preventDefault });
+                    expect(preventDefault).toHaveBeenCalled();
+                    expect(createComment).toHaveBeenCalledWith({
+                        content: 'Hello +vyacheslav',
+                        namedUsers: ['vyacheslav'],
+                        objectType: 'objectType',
+                        uri: 'uri',
+                        relatedObjectUris: ['entities/13JKIKAz']
+                    });
+                    return [4 /*yield*/, (0, test_utils_1.act)(function () { return __awaiter(void 0, void 0, void 0, function () {
+                            return __generator(this, function (_a) {
+                                component.update();
+                                return [2 /*return*/];
+                            });
+                        }); })];
+                case 1:
+                    _a.sent();
+                    expect(clearCommentState).toHaveBeenCalledWith('uri', 'comment/new');
+                    return [2 /*return*/];
+            }
+        });
+    }); });
+    it('should render Edit button if isEditingComment prop is true', function () {
+        mockCollaborationContext();
+        var component = setUp(createProps(createCommentObject({ status: 'resolved' }), { isEditingComment: true }));
+        component.find(TextFieldWithMentions_1.TextFieldWithMentions).find('textarea').simulate('focus');
+        var buttons = component.find('.buttons').last();
+        expect(buttons.childAt(0).text()).toBe('Edit');
+    });
+    it('submitting should work correctly if comment is editing', function () { return __awaiter(void 0, void 0, void 0, function () {
+        var onCancel, comment, component, buttons, preventDefault;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    mockCollaborationContext();
+                    onCancel = jest.fn();
+                    comment = {
+                        content: 'Hello +denis',
+                        namedUsers: ['denis'],
+                        commentId: 'commentId',
+                        status: 'open'
+                    };
+                    component = setUp(createProps(comment, { isEditingComment: true, onCancel: onCancel }));
+                    buttons = component.find('.buttons').last();
+                    buttons.childAt(0).find('button').simulate('click');
+                    preventDefault = jest.fn();
+                    component.find('.form').simulate('submit', { preventDefault: preventDefault });
+                    expect(preventDefault).toHaveBeenCalled();
+                    expect(editCommentWithResolve).toHaveBeenCalledWith({
+                        content: 'Hello +denis',
+                        namedUsers: ['denis'],
+                        commentId: 'commentId',
+                        uri: 'uri',
+                        relatedObjectUris: ['entities/13JKIKAz'],
+                        replies: undefined,
+                        objectType: 'objectType'
+                    });
+                    return [4 /*yield*/, (0, test_utils_1.act)(function () { return __awaiter(void 0, void 0, void 0, function () {
+                            return __generator(this, function (_a) {
+                                component.update();
+                                return [2 /*return*/];
+                            });
+                        }); })];
+                case 1:
+                    _a.sent();
+                    expect(clearCommentState).toHaveBeenCalledWith('uri', 'comment/commentId');
+                    expect(onCancel).toHaveBeenCalledTimes(1);
+                    return [2 /*return*/];
+            }
+        });
+    }); });
+    it('submitting should work correctly if reply is editing', function () { return __awaiter(void 0, void 0, void 0, function () {
+        var onCancel, reply, component, buttons, preventDefault;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    mockCollaborationContext();
+                    onCancel = jest.fn();
+                    reply = {
+                        content: 'Hello +ainsteisha',
+                        namedUsers: ['ainsteisha'],
+                        replyId: 'replyId'
+                    };
+                    component = setUp(createProps(createCommentObject({ status: 'open' }), {
+                        isEditingReply: true,
+                        onCancel: onCancel,
+                        reply: reply
+                    }));
+                    buttons = component.find('.buttons').last();
+                    buttons.childAt(0).find('button').simulate('click');
+                    preventDefault = jest.fn();
+                    component.find('.form').simulate('submit', { preventDefault: preventDefault });
+                    expect(preventDefault).toHaveBeenCalled();
+                    expect(editReply).toHaveBeenCalledWith({
+                        content: reply.content,
+                        namedUsers: reply.namedUsers,
+                        commentId: 'commentId',
+                        replyId: reply.replyId
+                    });
+                    return [4 /*yield*/, (0, test_utils_1.act)(function () { return __awaiter(void 0, void 0, void 0, function () {
+                            return __generator(this, function (_a) {
+                                component.update();
+                                return [2 /*return*/];
+                            });
+                        }); })];
+                case 1:
+                    _a.sent();
+                    expect(clearCommentState).toHaveBeenCalledWith('uri', 'comment/commentId/reply/replyId');
+                    expect(onCancel).toHaveBeenCalledTimes(1);
+                    return [2 /*return*/];
+            }
+        });
+    }); });
+    it('if received error after send request, do not need to clear text input', function () { return __awaiter(void 0, void 0, void 0, function () {
+        var editCommentWithReject, getCommentState, onCancel, component, buttons, preventDefault;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    editCommentWithReject = jest.fn().mockRejectedValue('error');
+                    getCommentState = jest.fn().mockImplementation(function () { return ({
+                        value: 'Hello @[+vyacheslav](vyacheslav)',
+                        plainTextValue: 'Hello +vyacheslav',
+                        mentions: ['vyacheslav']
+                    }); });
+                    mockCollaborationContext({ sending: false, editComment: editCommentWithReject, getCommentState: getCommentState });
+                    onCancel = jest.fn();
+                    component = setUp(createProps(createCommentObject({ status: 'open' }), { isEditingComment: true, onCancel: onCancel }));
+                    buttons = component.find('.buttons').last();
+                    buttons.childAt(0).find('button').simulate('click');
+                    preventDefault = jest.fn();
+                    component.find('.form').simulate('submit', { preventDefault: preventDefault });
+                    expect(preventDefault).toHaveBeenCalled();
+                    return [4 /*yield*/, (0, test_utils_1.act)(function () { return __awaiter(void 0, void 0, void 0, function () {
+                            return __generator(this, function (_a) {
+                                component.update();
+                                return [2 /*return*/];
+                            });
+                        }); })];
+                case 1:
+                    _a.sent();
+                    expect(clearCommentState).not.toHaveBeenCalled();
+                    expect(onCancel).toHaveBeenCalledTimes(0);
+                    return [2 /*return*/];
+            }
+        });
+    }); });
+    it('should call onCancel if click cancel button', function () {
+        mockCollaborationContext();
+        var onCancel = jest.fn();
+        var component = setUp(createProps(createCommentObject({ status: 'open' }), { isEditingComment: true, onCancel: onCancel }));
+        component.find(TextFieldWithMentions_1.TextFieldWithMentions).find('textarea').simulate('focus');
+        var buttons = component.find('.buttons').last();
+        buttons.childAt(1).find('button').simulate('click');
+        expect(onCancel).toHaveBeenCalledTimes(1);
+    });
+});

package/cjs/CollaborationItem/components/SendMessageArea/index.d.ts

@@ -0,0 +1 @@
+export { SendMessageArea } from './SendMessageArea';

package/cjs/CollaborationItem/components/SendMessageArea/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SendMessageArea = void 0;
+var SendMessageArea_1 = require("./SendMessageArea");
+Object.defineProperty(exports, "SendMessageArea", { enumerable: true, get: function () { return SendMessageArea_1.SendMessageArea; } });