diff --git a/app/javascript/dashboard/components/widgets/WootWriter/Editor.vue b/app/javascript/dashboard/components/widgets/WootWriter/Editor.vue index a00a3bf5a..bd47074ce 100644 --- a/app/javascript/dashboard/components/widgets/WootWriter/Editor.vue +++ b/app/javascript/dashboard/components/widgets/WootWriter/Editor.vue @@ -65,6 +65,7 @@ export default { placeholder: { type: String, default: '' }, isPrivate: { type: Boolean, default: false }, enableSuggestions: { type: Boolean, default: true }, + updateSelectionWith: { type: String, default: '' }, }, data() { return { @@ -162,6 +163,25 @@ export default { isPrivate() { this.reloadState(); }, + + updateSelectionWith(newValue, oldValue) { + if (!this.editorView) { + return null; + } + if (newValue !== oldValue) { + if (this.updateSelectionWith !== '') { + const node = this.editorView.state.schema.text( + this.updateSelectionWith + ); + const tr = this.editorView.state.tr.replaceSelectionWith(node); + this.editorView.focus(); + this.state = this.editorView.state.apply(tr); + this.emitOnChange(); + this.$emit('clear-selection'); + } + } + return null; + }, }, created() { this.state = createState(this.value, this.placeholder, this.plugins); diff --git a/app/javascript/dashboard/components/widgets/conversation/ReplyBox.vue b/app/javascript/dashboard/components/widgets/conversation/ReplyBox.vue index e7c825752..fdbb2fbdd 100644 --- a/app/javascript/dashboard/components/widgets/conversation/ReplyBox.vue +++ b/app/javascript/dashboard/components/widgets/conversation/ReplyBox.vue @@ -60,6 +60,7 @@ class="input" :is-private="isOnPrivateNote" :placeholder="messagePlaceHolder" + :update-selection-with="updateEditorSelectionWith" :min-height="4" @typing-off="onTypingOff" @typing-on="onTypingOn" @@ -67,6 +68,7 @@ @blur="onBlur" @toggle-user-mention="toggleUserMention" @toggle-canned-menu="toggleCannedMenu" + @clear-selection="clearEditorSelection" />
@@ -215,6 +217,7 @@ export default { ccEmails: '', doAutoSaveDraft: () => {}, showWhatsAppTemplatesModal: false, + updateEditorSelectionWith: '', }; }, computed: { @@ -707,8 +710,26 @@ export default { } this.$nextTick(() => this.$refs.messageInput.focus()); }, + clearEditorSelection() { + this.updateEditorSelectionWith = ''; + }, + insertEmoji(emoji, selectionStart, selectionEnd) { + const { message } = this; + const newMessage = + message.slice(0, selectionStart) + + emoji + + message.slice(selectionEnd, message.length); + this.message = newMessage; + }, emojiOnClick(emoji) { - this.message = `${this.message}${emoji} `; + if (this.showRichContentEditor) { + this.updateEditorSelectionWith = emoji; + this.onFocus(); + } + if (!this.showRichContentEditor) { + const { selectionStart, selectionEnd } = this.$refs.messageInput.$el; + this.insertEmoji(emoji, selectionStart, selectionEnd); + } }, clearMessage() { this.message = '';