diff --git a/app/javascript/dashboard/components/widgets/WootWriter/Editor.vue b/app/javascript/dashboard/components/widgets/WootWriter/Editor.vue index bd47074ce..f0d245420 100644 --- a/app/javascript/dashboard/components/widgets/WootWriter/Editor.vue +++ b/app/javascript/dashboard/components/widgets/WootWriter/Editor.vue @@ -39,10 +39,14 @@ const TYPING_INDICATOR_IDLE_TIME = 4000; import '@chatwoot/prosemirror-schema/src/woot-editor.css'; import { + hasPressedEnterAndNotCmdOrShift, + hasPressedCommandAndEnter, hasPressedAltAndPKey, hasPressedAltAndLKey, } from 'shared/helpers/KeyboardHelpers'; import eventListenerMixins from 'shared/mixins/eventListenerMixins'; +import uiSettingsMixin from 'dashboard/mixins/uiSettings'; +import { isEditorHotKeyEnabled } from 'dashboard/mixins/uiSettings'; const createState = (content, placeholder, plugins = []) => { return EditorState.create({ @@ -58,13 +62,14 @@ const createState = (content, placeholder, plugins = []) => { export default { name: 'WootMessageEditor', components: { TagAgents, CannedResponse }, - mixins: [eventListenerMixins], + mixins: [eventListenerMixins, uiSettingsMixin], props: { value: { type: String, default: '' }, editorId: { type: String, default: '' }, placeholder: { type: String, default: '' }, isPrivate: { type: Boolean, default: false }, enableSuggestions: { type: Boolean, default: true }, + overrideLineBreaks: { type: Boolean, default: false }, updateSelectionWith: { type: String, default: '' }, }, data() { @@ -208,6 +213,9 @@ export default { keyup: () => { this.onKeyup(); }, + keydown: (view, event) => { + this.onKeydown(event); + }, focus: () => { this.onFocus(); }, @@ -223,6 +231,12 @@ export default { }, }); }, + isEnterToSendEnabled() { + return isEditorHotKeyEnabled(this.uiSettings, 'enter'); + }, + isCmdPlusEnterToSendEnabled() { + return isEditorHotKeyEnabled(this.uiSettings, 'cmd_enter'); + }, handleKeyEvents(e) { if (hasPressedAltAndPKey(e)) { this.focusEditorInputField(); @@ -304,6 +318,24 @@ export default { clearTimeout(this.idleTimer); } }, + handleLineBreakWhenEnterToSendEnabled(event) { + if ( + hasPressedEnterAndNotCmdOrShift(event) && + this.isEnterToSendEnabled() && + !this.overrideLineBreaks + ) { + event.preventDefault(); + } + }, + handleLineBreakWhenCmdAndEnterToSendEnabled(event) { + if ( + hasPressedCommandAndEnter(event) && + this.isCmdPlusEnterToSendEnabled() && + !this.overrideLineBreaks + ) { + event.preventDefault(); + } + }, onKeyup() { if (!this.idleTimer) { this.$emit('typing-on'); @@ -314,6 +346,14 @@ export default { TYPING_INDICATOR_IDLE_TIME ); }, + onKeydown(event) { + if (this.isEnterToSendEnabled()) { + this.handleLineBreakWhenEnterToSendEnabled(event); + } + if (this.isCmdPlusEnterToSendEnabled()) { + this.handleLineBreakWhenCmdAndEnterToSendEnabled(event); + } + }, onBlur() { this.turnOffIdleTimer(); this.resetTyping(); diff --git a/app/javascript/dashboard/components/widgets/conversation/ReplyBox.vue b/app/javascript/dashboard/components/widgets/conversation/ReplyBox.vue index e8326fed0..13319aeda 100644 --- a/app/javascript/dashboard/components/widgets/conversation/ReplyBox.vue +++ b/app/javascript/dashboard/components/widgets/conversation/ReplyBox.vue @@ -590,6 +590,7 @@ export default { e.preventDefault(); } else if (keyCode === 'enter' && this.isAValidEvent('enter')) { this.onSendReply(); + e.preventDefault(); } else if ( ['meta+enter', 'ctrl+enter'].includes(keyCode) && this.isAValidEvent('cmd_enter') diff --git a/app/javascript/dashboard/routes/dashboard/helpcenter/components/ArticleEditor.vue b/app/javascript/dashboard/routes/dashboard/helpcenter/components/ArticleEditor.vue index 228118243..856ce6a38 100644 --- a/app/javascript/dashboard/routes/dashboard/helpcenter/components/ArticleEditor.vue +++ b/app/javascript/dashboard/routes/dashboard/helpcenter/components/ArticleEditor.vue @@ -15,6 +15,7 @@ class="article-content" :placeholder="$t('HELP_CENTER.EDIT_ARTICLE.CONTENT_PLACEHOLDER')" :is-format-mode="true" + :override-line-breaks="true" @focus="onFocus" @blur="onBlur" @input="onContentInput" diff --git a/app/javascript/shared/helpers/KeyboardHelpers.js b/app/javascript/shared/helpers/KeyboardHelpers.js index f23658953..5ef9d9f6a 100644 --- a/app/javascript/shared/helpers/KeyboardHelpers.js +++ b/app/javascript/shared/helpers/KeyboardHelpers.js @@ -14,6 +14,10 @@ export const hasPressedCommand = e => { return e.metaKey; }; +export const hasPressedEnterAndNotCmdOrShift = e => { + return isEnter(e) && !hasPressedCommand(e) && !hasPressedShift(e); +}; + export const hasPressedCommandAndEnter = e => { return e.metaKey && e.keyCode === 13; };