feat: Allow users to select Cmd+Enter as a hotkey (#4401)

Co-authored-by: Pranav Raj S <pranav@chatwoot.com>

app/javascript/dashboard/mixins/specs/uiSettings.spec.js

@@ -2,6 +2,7 @@ import { shallowMount, createLocalVue } from '@vue/test-utils';
 import uiSettingsMixin, {
   DEFAULT_CONVERSATION_SIDEBAR_ITEMS_ORDER,
   DEFAULT_CONTACT_SIDEBAR_ITEMS_ORDER,
+  isEditorHotKeyEnabled,
 } from '../uiSettings';
 import Vuex from 'vuex';
 const localVue = createLocalVue();
@@ -137,3 +138,26 @@ describe('uiSettingsMixin', () => {
     });
   });
 });
+
+describe('isEditorHotKeyEnabled', () => {
+  it('returns true if hot key is not configured and enter to send flag is true', () => {
+    expect(
+      isEditorHotKeyEnabled({ enter_to_send_enabled: true }, 'enter')
+    ).toEqual(true);
+    expect(
+      isEditorHotKeyEnabled({ enter_to_send_enabled: true }, 'cmd_enter')
+    ).toEqual(false);
+
+    expect(isEditorHotKeyEnabled({}, 'cmd_enter')).toEqual(true);
+    expect(isEditorHotKeyEnabled({}, 'enter')).toEqual(false);
+  });
+
+  it('returns correct value if hot key is configured', () => {
+    expect(
+      isEditorHotKeyEnabled({ editor_message_key: 'enter' }, 'enter')
+    ).toEqual(true);
+    expect(
+      isEditorHotKeyEnabled({ editor_message_key: 'cmd_enter' }, 'enter')
+    ).toEqual(false);
+  });
+});

app/javascript/dashboard/mixins/uiSettings.js

@@ -10,11 +10,24 @@ export const DEFAULT_CONTACT_SIDEBAR_ITEMS_ORDER = [
   { name: 'contact_labels' },
   { name: 'previous_conversation' },
 ];
+
+export const isEditorHotKeyEnabled = (uiSettings, key) => {
+  const {
+    editor_message_key: editorMessageKey,
+    enter_to_send_enabled: enterToSendEnabled,
+  } = uiSettings || {};
+  if (!editorMessageKey) {
+    if (enterToSendEnabled) {
+      return key === 'enter';
+    }
+    return key === 'cmd_enter';
+  }
+  return editorMessageKey === key;
+};
+
 export default {
   computed: {
-    ...mapGetters({
-      uiSettings: 'getUISettings',
-    }),
+    ...mapGetters({ uiSettings: 'getUISettings' }),
     conversationSidebarItemsOrder() {
       const { conversation_sidebar_items_order: itemsOrder } = this.uiSettings;
       return itemsOrder || DEFAULT_CONVERSATION_SIDEBAR_ITEMS_ORDER;