feat: Add an option to disable endConversation button (#4352)

app/controllers/api/v1/widget/conversations_controller.rb

@@ -45,7 +45,10 @@ class Api::V1::Widget::ConversationsController < Api::V1::Widget::BaseController
   end
 
   def toggle_status
-    head :not_found && return if conversation.nil?
+    return head :not_found if conversation.nil?
+
+    return head :forbidden unless @web_widget.end_conversation?
+
     unless conversation.resolved?
       conversation.status = :resolved
       conversation.save

app/javascript/dashboard/i18n/locale/en/inboxMgmt.json

@@ -395,7 +395,8 @@
     "FEATURES": {
       "LABEL": "Features",
       "DISPLAY_FILE_PICKER": "Display file picker on the widget",
-      "DISPLAY_EMOJI_PICKER": "Display emoji picker on the widget"
+      "DISPLAY_EMOJI_PICKER": "Display emoji picker on the widget",
+      "ALLOW_END_CONVERSATION": "Allow users to end conversation from the widget"
     },
     "SETTINGS_POPUP": {
       "MESSENGER_HEADING": "Messenger Script",

app/javascript/dashboard/routes/dashboard/settings/inbox/Settings.vue

@@ -285,6 +285,17 @@
             {{ $t('INBOX_MGMT.FEATURES.DISPLAY_EMOJI_PICKER') }}
           </label>
         </div>
+        <div v-if="isAWebWidgetInbox" class="settings-item settings-item">
+          <input
+            v-model="selectedFeatureFlags"
+            type="checkbox"
+            value="end_conversation"
+            @input="handleFeatureFlag"
+          />
+          <label for="end_conversation">
+            {{ $t('INBOX_MGMT.FEATURES.ALLOW_END_CONVERSATION') }}
+          </label>
+        </div>
 
         <woot-submit-button
           v-if="isAPIInbox"

app/javascript/widget/components/HeaderActions.vue

@@ -1,7 +1,7 @@
 <template>
   <div v-if="showHeaderActions" class="actions flex items-center">
     <button
-      v-if="conversationStatus === 'open'"
+      v-if="conversationStatus === 'open' && hasEndConversationEnabled"
       class="button transparent compact"
       :title="$t('END_CONVERSATION')"
       @click="resolveConversation"
@@ -43,12 +43,13 @@ import { mapGetters } from 'vuex';
 import { IFrameHelper, RNHelper } from 'widget/helpers/utils';
 import { popoutChatWindow } from '../helpers/popoutHelper';
 import FluentIcon from 'shared/components/FluentIcon/Index.vue';
-import darkModeMixin from 'widget/mixins/darkModeMixin.js';
+import darkModeMixin from 'widget/mixins/darkModeMixin';
+import configMixin from 'widget/mixins/configMixin';
 
 export default {
   name: 'HeaderActions',
   components: { FluentIcon },
-  mixins: [darkModeMixin],
+  mixins: [configMixin, darkModeMixin],
   props: {
     showPopoutButton: {
       type: Boolean,

app/javascript/widget/mixins/configMixin.js

@@ -18,6 +18,9 @@ export default {
     hasAttachmentsEnabled() {
       return this.channelConfig.enabledFeatures.includes('attachments');
     },
+    hasEndConversationEnabled() {
+      return this.channelConfig.enabledFeatures.includes('end_conversation');
+    },
     preChatFormEnabled() {
       return window.chatwootWebChannel.preChatFormEnabled;
     },

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

@@ -5,7 +5,7 @@ import Vue from 'vue';
 global.chatwootWebChannel = {
   avatarUrl: 'https://test.url',
   hasAConnectedAgentBot: 'AgentBot',
-  enabledFeatures: ['emoji_picker', 'attachments'],
+  enabledFeatures: ['emoji_picker', 'attachments', 'end_conversation'],
   preChatFormOptions: { require_email: false, pre_chat_message: '' },
 };
 
@@ -24,6 +24,7 @@ describe('configMixin', () => {
     const vm = new Constructor().$mount();
     const wrapper = createWrapper(vm);
     expect(wrapper.vm.hasEmojiPickerEnabled).toBe(true);
+    expect(wrapper.vm.hasEndConversationEnabled).toBe(true);
     expect(wrapper.vm.hasAttachmentsEnabled).toBe(true);
     expect(wrapper.vm.hasAConnectedAgentBot).toBe(true);
     expect(wrapper.vm.useInboxAvatarForBot).toBe(true);
@@ -31,7 +32,7 @@ describe('configMixin', () => {
     expect(wrapper.vm.channelConfig).toEqual({
       avatarUrl: 'https://test.url',
       hasAConnectedAgentBot: 'AgentBot',
-      enabledFeatures: ['emoji_picker', 'attachments'],
+      enabledFeatures: ['emoji_picker', 'attachments', 'end_conversation'],
       preChatFormOptions: {
         pre_chat_message: '',
         require_email: false,

app/models/channel/web_widget.rb

@@ -4,7 +4,7 @@
 #
 #  id                    :integer          not null, primary key
 #  continuity_via_email  :boolean          default(TRUE), not null
-#  feature_flags         :integer          default(3), not null
+#  feature_flags         :integer          default(7), not null
 #  hmac_mandatory        :boolean          default(FALSE)
 #  hmac_token            :string
 #  pre_chat_form_enabled :boolean          default(FALSE)
@@ -43,6 +43,7 @@ class Channel::WebWidget < ApplicationRecord
 
   has_flags 1 => :attachments,
             2 => :emoji_picker,
+            3 => :end_conversation,
             :column => 'feature_flags',
             :check_for_column => false