feat: Disable attachments and emoji picker in the web widget (#1102)

Signed-off-by: Pranav Raj Sreepuram <pranavrajs@gmail.com>

app/javascript/widget/components/ChatInputWrap.vue

@@ -18,6 +18,7 @@
         :on-click="emojiOnClick"
       />
       <i
+        v-if="hasEmojiPickerEnabled"
         class="emoji-toggle icon ion-happy-outline"
         :class="{ active: showEmojiPicker }"
         @click="toggleEmojiPicker()"
@@ -39,6 +40,7 @@ import ChatSendButton from 'widget/components/ChatSendButton.vue';
 import ChatAttachmentButton from 'widget/components/ChatAttachment.vue';
 import ResizableTextArea from 'shared/components/ResizableTextArea';
 import EmojiInput from 'dashboard/components/widgets/emoji/EmojiInput';
+import configMixin from '../mixins/configMixin';
 
 export default {
   name: 'ChatInputWrap',
@@ -48,7 +50,7 @@ export default {
     EmojiInput,
     ResizableTextArea,
   },
-  mixins: [clickaway],
+  mixins: [clickaway, configMixin],
   props: {
     onSendMessage: {
       type: Function,
@@ -72,7 +74,7 @@ export default {
       widgetColor: 'appConfig/getWidgetColor',
     }),
     showAttachment() {
-      return this.userInput.length === 0;
+      return this.hasAttachmentsEnabled && this.userInput.length === 0;
     },
     showSendButton() {
       return this.userInput.length > 0;

app/javascript/widget/mixins/configMixin.js

@@ -15,5 +15,11 @@ export default {
     channelConfig() {
       return window.chatwootWebChannel;
     },
+    hasEmojiPickerEnabled() {
+      return this.channelConfig.enabledFeatures.includes('emoji_picker');
+    },
+    hasAttachmentsEnabled() {
+      return this.channelConfig.enabledFeatures.includes('attachments');
+    },
   },
 };

app/javascript/widget/mixins/specs/configMixin.spec.js

@@ -6,6 +6,7 @@ global.chatwootWebChannel = {
   hideInputForBotConversations: true,
   avatarUrl: 'https://test.url',
   hasAConnectedAgentBot: 'AgentBot',
+  enabledFeatures: ['emoji_picker', 'attachments'],
 };
 
 global.chatwootWidgetDefaults = {
@@ -22,6 +23,8 @@ describe('configMixin', () => {
     const Constructor = Vue.extend(Component);
     const vm = new Constructor().$mount();
     const wrapper = createWrapper(vm);
+    expect(wrapper.vm.hasEmojiPickerEnabled).toBe(true);
+    expect(wrapper.vm.hasAttachmentsEnabled).toBe(true);
     expect(wrapper.vm.hideInputForBotConversations).toBe(true);
     expect(wrapper.vm.hasAConnectedAgentBot).toBe(true);
     expect(wrapper.vm.useInboxAvatarForBot).toBe(true);
@@ -30,6 +33,7 @@ describe('configMixin', () => {
       hideInputForBotConversations: true,
       avatarUrl: 'https://test.url',
       hasAConnectedAgentBot: 'AgentBot',
+      enabledFeatures: ['emoji_picker', 'attachments'],
     });
   });
 });