From a8001ccabc47f8945315bd781954806113b78e8f Mon Sep 17 00:00:00 2001
From: Sivin Varghese <64252451+iamsivin@users.noreply.github.com>
Date: Fri, 14 Mar 2025 05:14:46 +0530
Subject: [PATCH 1/9] fix: Translate "None" option in automation select
 (#11076)

# Pull Request Template

## Description

This PR includes a translation update for the "None" option in the
automation select for both agents and teams

## Type of change

- [x] Bug fix (non-breaking change which fixes an issue)



## Checklist:

- [x] My code follows the style guidelines of this project
- [x] I have performed a self-review of my code
- [x] I have commented on my code, particularly in hard-to-understand
areas
- [ ] I have made corresponding changes to the documentation
- [x] My changes generate no new warnings
- [x] I have added tests that prove my fix is effective or that my
feature works
- [x] New and existing unit tests pass locally with my changes
- [ ] Any dependent changes have been merged and published in downstream
modules
---
 .../composables/useAutomationValues.js        | 15 ++++++-
 .../dashboard/helper/automationHelper.js      | 15 ++-----
 .../helper/specs/automationHelper.spec.js     | 40 +++++++++++++++++++
 .../dashboard/i18n/locale/en/automation.json  |  3 +-
 4 files changed, 60 insertions(+), 13 deletions(-)

diff --git a/app/javascript/dashboard/composables/useAutomationValues.js b/app/javascript/dashboard/composables/useAutomationValues.js
index 88568fee5..4df46be8f 100644
--- a/app/javascript/dashboard/composables/useAutomationValues.js
+++ b/app/javascript/dashboard/composables/useAutomationValues.js
@@ -16,7 +16,6 @@ import {
 export default function useAutomationValues() {
   const getters = useStoreGetters();
   const { t } = useI18n();
-
   const agents = useMapGetter('agents/getAgents');
   const campaigns = useMapGetter('campaigns/getAllCampaigns');
   const contacts = useMapGetter('contacts/getContacts');
@@ -61,6 +60,19 @@ export default function useAutomationValues() {
     ];
   });
 
+  /**
+   * Adds a translated "None" option to the beginning of a list
+   * @param {Array} list - The list to add "None" to
+   * @returns {Array} A new array with "None" option at the beginning
+   */
+  const addNoneToList = list => [
+    {
+      id: 'nil',
+      name: t('AUTOMATION.NONE_OPTION') || 'None',
+    },
+    ...(list || []),
+  ];
+
   /**
    * Gets the condition dropdown values for a given type.
    * @param {string} type - The type of condition.
@@ -95,6 +107,7 @@ export default function useAutomationValues() {
       slaPolicies: slaPolicies.value,
       languages,
       type,
+      addNoneToListFn: addNoneToList,
     });
   };
 
diff --git a/app/javascript/dashboard/helper/automationHelper.js b/app/javascript/dashboard/helper/automationHelper.js
index 6ff941822..07186c122 100644
--- a/app/javascript/dashboard/helper/automationHelper.js
+++ b/app/javascript/dashboard/helper/automationHelper.js
@@ -87,6 +87,7 @@ export const generateCustomAttributeTypes = (customAttributes, type) => {
 };
 
 export const generateConditionOptions = (options, key = 'id') => {
+  if (!options || !Array.isArray(options)) return [];
   return options.map(i => {
     return {
       id: i[key],
@@ -95,25 +96,17 @@ export const generateConditionOptions = (options, key = 'id') => {
   });
 };
 
-// Add the "None" option to the agent list
-export const addNoneToList = agents => [
-  {
-    id: 'nil',
-    name: 'None',
-  },
-  ...(agents || []),
-];
-
 export const getActionOptions = ({
   agents,
   teams,
   labels,
   slaPolicies,
   type,
+  addNoneToListFn,
 }) => {
   const actionsMap = {
-    assign_agent: addNoneToList(agents),
-    assign_team: addNoneToList(teams),
+    assign_agent: addNoneToListFn ? addNoneToListFn(agents) : agents,
+    assign_team: addNoneToListFn ? addNoneToListFn(teams) : teams,
     send_email_to_team: teams,
     add_label: generateConditionOptions(labels, 'title'),
     remove_label: generateConditionOptions(labels, 'title'),
diff --git a/app/javascript/dashboard/helper/specs/automationHelper.spec.js b/app/javascript/dashboard/helper/specs/automationHelper.spec.js
index b55da1bad..10088963a 100644
--- a/app/javascript/dashboard/helper/specs/automationHelper.spec.js
+++ b/app/javascript/dashboard/helper/specs/automationHelper.spec.js
@@ -118,6 +118,46 @@ describe('getActionOptions', () => {
       expectedOptions
     );
   });
+
+  it('adds None option when addNoneToListFn is provided', () => {
+    const mockAddNoneToListFn = list => [
+      { id: 'nil', name: 'None' },
+      ...(list || []),
+    ];
+
+    const agents = [
+      { id: 1, name: 'Agent 1' },
+      { id: 2, name: 'Agent 2' },
+    ];
+
+    const expectedOptions = [
+      { id: 'nil', name: 'None' },
+      { id: 1, name: 'Agent 1' },
+      { id: 2, name: 'Agent 2' },
+    ];
+
+    expect(
+      helpers.getActionOptions({
+        agents,
+        type: 'assign_agent',
+        addNoneToListFn: mockAddNoneToListFn,
+      })
+    ).toEqual(expectedOptions);
+  });
+
+  it('does not add None option when addNoneToListFn is not provided', () => {
+    const agents = [
+      { id: 1, name: 'Agent 1' },
+      { id: 2, name: 'Agent 2' },
+    ];
+
+    expect(
+      helpers.getActionOptions({
+        agents,
+        type: 'assign_agent',
+      })
+    ).toEqual(agents);
+  });
 });
 
 describe('getConditionOptions', () => {
diff --git a/app/javascript/dashboard/i18n/locale/en/automation.json b/app/javascript/dashboard/i18n/locale/en/automation.json
index 483965f53..bb4946416 100644
--- a/app/javascript/dashboard/i18n/locale/en/automation.json
+++ b/app/javascript/dashboard/i18n/locale/en/automation.json
@@ -125,6 +125,7 @@
       "ACTION_PARAMETERS_REQUIRED": "Action parameters are required",
       "ATLEAST_ONE_CONDITION_REQUIRED": "At least one condition is required",
       "ATLEAST_ONE_ACTION_REQUIRED": "At least one action is required"
-    }
+    },
+    "NONE_OPTION": "None"
   }
 }

From 325dc4a741f28d2b0cbc478a97a736bca14a032e Mon Sep 17 00:00:00 2001
From: Pranav <pranav@chatwoot.com>
Date: Thu, 13 Mar 2025 17:46:48 -0700
Subject: [PATCH 2/9] fix: Move contact events to account stream rather than
 individual user stream (#11082)

---
 app/channels/room_channel.rb                 | 17 ++++++++++-------
 app/listeners/action_cable_listener.rb       | 20 ++++++++------------
 spec/channels/room_channel_spec.rb           |  9 +++++++++
 spec/listeners/action_cable_listener_spec.rb |  4 +---
 4 files changed, 28 insertions(+), 22 deletions(-)

diff --git a/app/channels/room_channel.rb b/app/channels/room_channel.rb
index 0680f1458..629078229 100644
--- a/app/channels/room_channel.rb
+++ b/app/channels/room_channel.rb
@@ -2,10 +2,9 @@ class RoomChannel < ApplicationCable::Channel
   def subscribed
     # TODO: should we only do ensure stream  if current account is present?
     # for now going ahead with guard clauses in update_subscription and broadcast_presence
-
-    ensure_stream
     current_user
     current_account
+    ensure_stream
     update_subscription
     broadcast_presence
   end
@@ -22,12 +21,12 @@ class RoomChannel < ApplicationCable::Channel
 
     data = { account_id: @current_account.id, users: ::OnlineStatusTracker.get_available_users(@current_account.id) }
     data[:contacts] = ::OnlineStatusTracker.get_available_contacts(@current_account.id) if @current_user.is_a? User
-    ActionCable.server.broadcast(@pubsub_token, { event: 'presence.update', data: data })
+    ActionCable.server.broadcast(pubsub_token, { event: 'presence.update', data: data })
   end
 
   def ensure_stream
-    @pubsub_token = params[:pubsub_token]
-    stream_from @pubsub_token
+    stream_from pubsub_token
+    stream_from "account_#{@current_account.id}" if @current_account.present? && @current_user.is_a?(User)
   end
 
   def update_subscription
@@ -36,11 +35,15 @@ class RoomChannel < ApplicationCable::Channel
     ::OnlineStatusTracker.update_presence(@current_account.id, @current_user.class.name, @current_user.id)
   end
 
+  def pubsub_token
+    @pubsub_token ||= params[:pubsub_token]
+  end
+
   def current_user
     @current_user ||= if params[:user_id].blank?
-                        ContactInbox.find_by!(pubsub_token: @pubsub_token).contact
+                        ContactInbox.find_by!(pubsub_token: pubsub_token).contact
                       else
-                        User.find_by!(pubsub_token: @pubsub_token, id: params[:user_id])
+                        User.find_by!(pubsub_token: pubsub_token, id: params[:user_id])
                       end
   end
 
diff --git a/app/listeners/action_cable_listener.rb b/app/listeners/action_cable_listener.rb
index 99a8fe2af..37dc939e7 100644
--- a/app/listeners/action_cable_listener.rb
+++ b/app/listeners/action_cable_listener.rb
@@ -137,30 +137,22 @@ class ActionCableListener < BaseListener
 
   def contact_created(event)
     contact, account = extract_contact_and_account(event)
-    tokens = user_tokens(account, account.agents)
-
-    broadcast(account, tokens, CONTACT_CREATED, contact.push_event_data)
+    broadcast(account, [account_token(account)], CONTACT_CREATED, contact.push_event_data)
   end
 
   def contact_updated(event)
     contact, account = extract_contact_and_account(event)
-    tokens = user_tokens(account, account.agents)
-
-    broadcast(account, tokens, CONTACT_UPDATED, contact.push_event_data)
+    broadcast(account, [account_token(account)], CONTACT_UPDATED, contact.push_event_data)
   end
 
   def contact_merged(event)
     contact, account = extract_contact_and_account(event)
-    tokens = event.data[:tokens]
-
-    broadcast(account, tokens, CONTACT_MERGED, contact.push_event_data)
+    broadcast(account, [account_token(account)], CONTACT_MERGED, contact.push_event_data)
   end
 
   def contact_deleted(event)
     contact, account = extract_contact_and_account(event)
-    tokens = user_tokens(account, account.agents)
-
-    broadcast(account, tokens, CONTACT_DELETED, contact.push_event_data)
+    broadcast(account, [account_token(account)], CONTACT_DELETED, contact.push_event_data)
   end
 
   def conversation_mentioned(event)
@@ -172,6 +164,10 @@ class ActionCableListener < BaseListener
 
   private
 
+  def account_token(account)
+    "account_#{account.id}"
+  end
+
   def typing_event_listener_tokens(account, conversation, user)
     current_user_token = user.is_a?(Contact) ? conversation.contact_inbox.pubsub_token : user.pubsub_token
     (user_tokens(account, conversation.inbox.members) + [conversation.contact_inbox.pubsub_token]) - [current_user_token]
diff --git a/spec/channels/room_channel_spec.rb b/spec/channels/room_channel_spec.rb
index 362a3d405..b39725f04 100644
--- a/spec/channels/room_channel_spec.rb
+++ b/spec/channels/room_channel_spec.rb
@@ -2,6 +2,8 @@ require 'rails_helper'
 
 RSpec.describe RoomChannel do
   let!(:contact_inbox) { create(:contact_inbox) }
+  let!(:account) { create(:account) }
+  let!(:user) { create(:user, account: account) }
 
   before do
     stub_connection
@@ -12,4 +14,11 @@ RSpec.describe RoomChannel do
     expect(subscription).to be_confirmed
     expect(subscription).to have_stream_for(contact_inbox.pubsub_token)
   end
+
+  it 'subscribes to a stream when pubsub_token is provided for user' do
+    subscribe(user_id: user.id, pubsub_token: user.pubsub_token, account_id: account.id)
+    expect(subscription).to be_confirmed
+    expect(subscription).to have_stream_for(user.pubsub_token)
+    expect(subscription).to have_stream_for("account_#{account.id}")
+  end
 end
diff --git a/spec/listeners/action_cable_listener_spec.rb b/spec/listeners/action_cable_listener_spec.rb
index b353f330d..55b74116c 100644
--- a/spec/listeners/action_cable_listener_spec.rb
+++ b/spec/listeners/action_cable_listener_spec.rb
@@ -121,9 +121,7 @@ describe ActionCableListener do
 
     it 'sends message to account admins, inbox agents' do
       expect(ActionCableBroadcastJob).to receive(:perform_later).with(
-        a_collection_containing_exactly(
-          agent.pubsub_token, admin.pubsub_token
-        ),
+        ["account_#{account.id}"],
         'contact.deleted',
         contact.push_event_data.merge(account_id: account.id)
       )

From ed970ee190802f9411c8123b7f1e9efbe5b8a4fe Mon Sep 17 00:00:00 2001
From: Sivin Varghese <64252451+iamsivin@users.noreply.github.com>
Date: Fri, 14 Mar 2025 14:28:14 +0530
Subject: [PATCH 3/9] chore: Update settings to match the new design (#11084)

---
 .../dashboard/i18n/locale/en/agentBots.json   |   4 +-
 .../i18n/locale/en/integrationApps.json       |   2 +-
 .../routes/dashboard/settings/Wrapper.vue     |   9 +
 .../dashboard/settings/agentBots/Index.vue    | 170 +++++++++---------
 .../settings/agentBots/agentBot.routes.js     |  21 ++-
 .../agentBots/components/AgentBotRow.vue      | 103 +++++------
 .../agentBots/components/AgentBotType.vue     |  51 +++---
 .../integrations/IntegrationHooks.vue         |  15 +-
 .../integrations/MultipleIntegrationHooks.vue |  58 ++++--
 .../integrations/integrations.routes.js       |   8 +
 10 files changed, 224 insertions(+), 217 deletions(-)

diff --git a/app/javascript/dashboard/i18n/locale/en/agentBots.json b/app/javascript/dashboard/i18n/locale/en/agentBots.json
index fb744b4a9..41b8fcb1b 100644
--- a/app/javascript/dashboard/i18n/locale/en/agentBots.json
+++ b/app/javascript/dashboard/i18n/locale/en/agentBots.json
@@ -2,8 +2,8 @@
   "AGENT_BOTS": {
     "HEADER": "Bots",
     "LOADING_EDITOR": "Loading editor...",
-    "HEADER_BTN_TXT": "Add bot configuration",
-    "SIDEBAR_TXT": "<p><b>Agent Bots</b> <p>Agent Bots are like the most fabulous members of your team. They can handle the small stuff, so you can focus on the stuff that matters. Give them a try.</p> <p> You can manage your bots from this page or create new ones using the 'Add bot configuraton' button.</p> <p> Open the <a href=\"https://www.chatwoot.com/hc/chatwoot-user-guide-cloud-version/articles/1677497472-how-to-use-agent-bots\" target=\"blank\">Agent bots handbook</a> in another tab for a helping hand.</p>",
+    "DESCRIPTION": "Agent Bots are like the most fabulous members of your team. They can handle the small stuff, so you can focus on the stuff that matters. Give them a try.You can manage your bots from this page or create new ones using the 'Configure new bot' button.",
+    "LEARN_MORE": "Learn about agent bots",
     "CSML_BOT_EDITOR": {
       "NAME": {
         "LABEL": "Bot name",
diff --git a/app/javascript/dashboard/i18n/locale/en/integrationApps.json b/app/javascript/dashboard/i18n/locale/en/integrationApps.json
index 9404e12c2..b91b434f7 100644
--- a/app/javascript/dashboard/i18n/locale/en/integrationApps.json
+++ b/app/javascript/dashboard/i18n/locale/en/integrationApps.json
@@ -56,7 +56,7 @@
       "BUTTON_TEXT": "Disconnect"
     },
     "SIDEBAR_DESCRIPTION": {
-      "DIALOGFLOW": "Dialogflow is a natural language understanding platform that makes it easy to design and integrate a conversational user interface into your mobile app, web application, device, bot, interactive voice response system, and so on. <br /> <br /> Dialogflow integration with {installationName} allows you to configure a Dialogflow bot with your inboxes which lets the bot handle the queries initially and hand them over to an agent when needed. Dialogflow can be used to qualifying the leads, reduce the workload of agents by providing frequently asked questions etc. <br /> <br /> To add Dialogflow, you need to create a Service Account in your Google project console and share the credentials. Please refer to the Dialogflow docs for more information."
+      "DIALOGFLOW": "Dialogflow is a natural language processing platform for building conversational interfaces. Integrating it with {installationName} lets bots handle queries first and transfer them to agents when needed. It helps qualify leads and reduce agent workload by answering FAQs. To add Dialogflow, create a Service Account in Google Console and share the credentials. Refer to the docs for details"
     }
   }
 }
diff --git a/app/javascript/dashboard/routes/dashboard/settings/Wrapper.vue b/app/javascript/dashboard/routes/dashboard/settings/Wrapper.vue
index f5ba2b4eb..59cf178ba 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/Wrapper.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/Wrapper.vue
@@ -19,12 +19,21 @@ const { t } = useI18n();
 const showNewButton = computed(
   () => props.newButtonRoutes.length && !props.showBackButton
 );
+
+const showSettingsHeader = computed(
+  () =>
+    props.headerTitle ||
+    props.icon ||
+    props.showBackButton ||
+    showNewButton.value
+);
 </script>
 
 <template>
   <div class="flex flex-1 flex-col m-0 bg-n-background overflow-auto">
     <div class="max-w-6xl mx-auto w-full flex flex-col flex-1">
       <SettingsHeader
+        v-if="showSettingsHeader"
         button-route="new"
         :icon="icon"
         :header-title="t(headerTitle)"
diff --git a/app/javascript/dashboard/routes/dashboard/settings/agentBots/Index.vue b/app/javascript/dashboard/routes/dashboard/settings/agentBots/Index.vue
index 028d06177..05c4d8d14 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/agentBots/Index.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/agentBots/Index.vue
@@ -1,59 +1,87 @@
-<script>
-import { mapGetters } from 'vuex';
+<script setup>
+import { ref, onMounted } from 'vue';
+import { useRouter } from 'vue-router';
+import { useMapGetter, useStore } from 'dashboard/composables/store';
 import { useAlert } from 'dashboard/composables';
-import { frontendURL } from '../../../../helper/URLHelper';
+import { useI18n } from 'vue-i18n';
+import { frontendURL } from 'dashboard/helper/URLHelper';
+
 import AgentBotRow from './components/AgentBotRow.vue';
 
-export default {
-  components: { AgentBotRow },
-  computed: {
-    ...mapGetters({
-      accountId: 'getCurrentAccountId',
-      agentBots: 'agentBots/getBots',
-      uiFlags: 'agentBots/getUIFlags',
-    }),
-    newAgentBotsURL() {
-      return frontendURL(
-        `accounts/${this.accountId}/settings/agent-bots/csml/new`
-      );
-    },
-  },
-  mounted() {
-    this.$store.dispatch('agentBots/get');
-  },
-  methods: {
-    async onDeleteAgentBot(bot) {
-      const ok = await this.$refs.confirmDialog.showConfirmation();
-      if (ok) {
-        try {
-          await this.$store.dispatch('agentBots/delete', bot.id);
-          useAlert(this.$t('AGENT_BOTS.DELETE.API.SUCCESS_MESSAGE'));
-        } catch (error) {
-          useAlert(this.$t('AGENT_BOTS.DELETE.API.ERROR_MESSAGE'));
-        }
-      }
-    },
-    onEditAgentBot(bot) {
-      this.$router.push(
-        frontendURL(
-          `accounts/${this.accountId}/settings/agent-bots/csml/${bot.id}`
-        )
-      );
-    },
-  },
+import SettingsLayout from '../SettingsLayout.vue';
+import BaseSettingsHeader from '../components/BaseSettingsHeader.vue';
+
+const router = useRouter();
+const store = useStore();
+const { t } = useI18n();
+
+const accountId = useMapGetter('getCurrentAccountId');
+const agentBots = useMapGetter('agentBots/getBots');
+const uiFlags = useMapGetter('agentBots/getUIFlags');
+
+const confirmDialog = ref(null);
+
+const onConfigureNewBot = () => {
+  router.push({
+    name: 'agent_bots_csml_new',
+  });
+};
+
+onMounted(() => {
+  store.dispatch('agentBots/get');
+});
+
+const onDeleteAgentBot = async bot => {
+  const ok = await confirmDialog.value.showConfirmation();
+
+  if (ok) {
+    try {
+      await store.dispatch('agentBots/delete', bot.id);
+      useAlert(t('AGENT_BOTS.DELETE.API.SUCCESS_MESSAGE'));
+    } catch (error) {
+      useAlert(t('AGENT_BOTS.DELETE.API.ERROR_MESSAGE'));
+    }
+  }
+};
+
+const onEditAgentBot = bot => {
+  router.push(
+    frontendURL(
+      `accounts/${accountId.value}/settings/agent-bots/csml/${bot.id}`
+    )
+  );
 };
 </script>
 
 <template>
-  <div class="flex-1 p-4 overflow-auto">
-    <div class="flex flex-row gap-4">
-      <div class="w-full lg:w-3/5">
-        <woot-loading-state
-          v-if="uiFlags.isFetching"
-          :message="$t('AGENT_BOTS.LIST.LOADING')"
-        />
-        <table v-else-if="agentBots.length" class="woot-table">
-          <tbody>
+  <SettingsLayout
+    :is-loading="uiFlags.isFetching"
+    :loading-message="$t('AGENT_BOTS.LIST.LOADING')"
+    :no-records-found="!agentBots.length"
+    :no-records-message="$t('AGENT_BOTS.LIST.404')"
+  >
+    <template #header>
+      <BaseSettingsHeader
+        :title="$t('AGENT_BOTS.HEADER')"
+        :description="$t('AGENT_BOTS.DESCRIPTION')"
+        :link-text="$t('AGENT_BOTS.LEARN_MORE')"
+        feature-name="agent_bots"
+      >
+        <template #actions>
+          <woot-button
+            class="rounded-md button nice"
+            icon="add-circle"
+            @click="onConfigureNewBot"
+          >
+            {{ $t('AGENT_BOTS.ADD.TITLE') }}
+          </woot-button>
+        </template>
+      </BaseSettingsHeader>
+    </template>
+    <template #body>
+      <div class="flex-1 overflow-auto">
+        <table class="divide-y divide-slate-75 dark:divide-slate-700">
+          <tbody class="divide-y divide-n-weak text-n-slate-11">
             <AgentBotRow
               v-for="(agentBot, index) in agentBots"
               :key="agentBot.id"
@@ -64,42 +92,12 @@ export default {
             />
           </tbody>
         </table>
-        <p v-else class="flex flex-col items-center justify-center h-full">
-          {{ $t('AGENT_BOTS.LIST.404') }}
-        </p>
+        <woot-confirm-modal
+          ref="confirmDialog"
+          :title="$t('AGENT_BOTS.DELETE.TITLE')"
+          :description="$t('AGENT_BOTS.DELETE.DESCRIPTION')"
+        />
       </div>
-
-      <div class="hidden w-1/3 lg:block">
-        <p v-dompurify-html="$t('AGENT_BOTS.SIDEBAR_TXT')" />
-      </div>
-    </div>
-    <woot-button
-      color-scheme="success"
-      class-names="button--fixed-top"
-      icon="add-circle"
-    >
-      <router-link :to="newAgentBotsURL" class="white-text">
-        {{ $t('AGENT_BOTS.ADD.TITLE') }}
-      </router-link>
-    </woot-button>
-    <woot-confirm-modal
-      ref="confirmDialog"
-      :title="$t('AGENT_BOTS.DELETE.TITLE')"
-      :description="$t('AGENT_BOTS.DELETE.DESCRIPTION')"
-    />
-  </div>
+    </template>
+  </SettingsLayout>
 </template>
-
-<style scoped>
-.bots-list {
-  list-style: none;
-}
-
-.nowrap {
-  white-space: nowrap;
-}
-
-.white-text {
-  color: white;
-}
-</style>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/agentBots/agentBot.routes.js b/app/javascript/dashboard/routes/dashboard/settings/agentBots/agentBot.routes.js
index b3942d0fe..d83335d7e 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/agentBots/agentBot.routes.js
+++ b/app/javascript/dashboard/routes/dashboard/settings/agentBots/agentBot.routes.js
@@ -4,6 +4,7 @@ import CsmlEditBot from './csml/Edit.vue';
 import CsmlNewBot from './csml/New.vue';
 import { frontendURL } from '../../../../helper/URLHelper';
 import SettingsContent from '../Wrapper.vue';
+import SettingsWrapper from '../SettingsWrapper.vue';
 
 export default {
   routes: [
@@ -12,12 +13,7 @@ export default {
       meta: {
         permissions: ['administrator'],
       },
-      component: SettingsContent,
-      props: {
-        headerTitle: 'AGENT_BOTS.HEADER',
-        icon: 'bot',
-        showNewButton: false,
-      },
+      component: SettingsWrapper,
       children: [
         {
           path: '',
@@ -28,6 +24,19 @@ export default {
             permissions: ['administrator'],
           },
         },
+      ],
+    },
+    {
+      path: frontendURL('accounts/:accountId/settings/agent-bots'),
+      component: SettingsContent,
+      props: () => {
+        return {
+          headerTitle: 'AGENT_BOTS.HEADER',
+          icon: 'bot',
+          showBackButton: true,
+        };
+      },
+      children: [
         {
           path: 'csml/new',
           name: 'agent_bots_csml_new',
diff --git a/app/javascript/dashboard/routes/dashboard/settings/agentBots/components/AgentBotRow.vue b/app/javascript/dashboard/routes/dashboard/settings/agentBots/components/AgentBotRow.vue
index 23079d2e3..f96ed8018 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/agentBots/components/AgentBotRow.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/agentBots/components/AgentBotRow.vue
@@ -1,81 +1,58 @@
-<script>
+<script setup>
+import { computed } from 'vue';
 import ShowMore from 'dashboard/components/widgets/ShowMore.vue';
 import AgentBotType from './AgentBotType.vue';
 
-export default {
-  components: { ShowMore, AgentBotType },
-  props: {
-    agentBot: {
-      type: Object,
-      required: true,
-    },
-    index: {
-      type: Number,
-      required: true,
-    },
+const props = defineProps({
+  agentBot: {
+    type: Object,
+    required: true,
   },
-  emits: ['edit', 'delete'],
-  computed: {
-    isACSMLTypeBot() {
-      const { bot_type: botType } = this.agentBot;
-      return botType === 'csml';
-    },
+  index: {
+    type: Number,
+    required: true,
   },
-};
+});
+
+const emit = defineEmits(['edit', 'delete']);
+
+const isACSMLTypeBot = computed(() => {
+  const { bot_type: botType } = props.agentBot;
+  return botType === 'csml';
+});
 </script>
 
 <template>
   <tr class="space-x-2">
-    <td class="agent-bot--details">
-      <div class="agent-bot--link">
+    <td class="py-4 ltr:pl-0 ltr:pr-4 rtl:pl-4 rtl:pr-0">
+      <div class="flex items-center break-words font-medium">
         {{ agentBot.name }}
         (<AgentBotType :bot-type="agentBot.bot_type" />)
       </div>
-      <div class="agent-bot--description">
+      <div class="text-sm">
         <ShowMore :text="agentBot.description || ''" :limit="120" />
       </div>
     </td>
-    <td class="flex justify-end gap-1">
-      <woot-button
-        v-if="isACSMLTypeBot"
-        v-tooltip.top="$t('AGENT_BOTS.EDIT.BUTTON_TEXT')"
-        variant="smooth"
-        size="tiny"
-        color-scheme="secondary"
-        icon="edit"
-        @click="$emit('edit', agentBot)"
-      />
-      <woot-button
-        v-tooltip.top="$t('AGENT_BOTS.DELETE.BUTTON_TEXT')"
-        variant="smooth"
-        color-scheme="alert"
-        size="tiny"
-        icon="dismiss-circle"
-        @click="$emit('delete', agentBot, index)"
-      />
+    <td class="align-middle">
+      <div class="flex justify-end gap-1 h-full items-center">
+        <woot-button
+          v-if="isACSMLTypeBot"
+          v-tooltip.top="$t('AGENT_BOTS.EDIT.BUTTON_TEXT')"
+          variant="smooth"
+          size="tiny"
+          color-scheme="secondary"
+          icon="edit"
+          @click="emit('edit', agentBot)"
+        />
+        <woot-button
+          v-tooltip.top="$t('AGENT_BOTS.DELETE.BUTTON_TEXT')"
+          variant="smooth"
+          color-scheme="alert"
+          size="tiny"
+          icon="dismiss-circle"
+          @click="emit('delete', agentBot, index)"
+        />
+      </div>
     </td>
   </tr>
 </template>
-
-<style scoped lang="scss">
-.agent-bot--link {
-  align-items: center;
-  display: flex;
-  font-weight: var(--font-weight-medium);
-  word-break: break-word;
-}
-
-.agent-bot--description {
-  font-size: var(--font-size-mini);
-}
-
-.agent-bot--type {
-  color: var(--s-600);
-  font-weight: var(--font-weight-medium);
-  margin-bottom: var(--space-small);
-}
-
-.agent-bot--details {
-  width: 90%;
-}
-</style>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/agentBots/components/AgentBotType.vue b/app/javascript/dashboard/routes/dashboard/settings/agentBots/components/AgentBotType.vue
index ac3ac90b9..b207e8637 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/agentBots/components/AgentBotType.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/agentBots/components/AgentBotType.vue
@@ -1,43 +1,36 @@
-<script>
-export default {
-  props: {
-    botType: {
-      type: String,
-      default: 'webhook',
-    },
+<script setup>
+import { computed } from 'vue';
+import { useI18n } from 'vue-i18n';
+
+defineProps({
+  botType: {
+    type: String,
+    default: 'webhook',
   },
-  data() {
-    return {
-      botTypeConfig: {
-        csml: {
-          label: this.$t('AGENT_BOTS.TYPES.CSML'),
-          thumbnail: '/dashboard/images/agent-bots/csml.png',
-        },
-        webhook: {
-          label: this.$t('AGENT_BOTS.TYPES.WEBHOOK'),
-          thumbnail: '/dashboard/images/agent-bots/webhook.svg',
-        },
-      },
-    };
+});
+
+const { t } = useI18n();
+
+const botTypeConfig = computed(() => ({
+  csml: {
+    label: t('AGENT_BOTS.TYPES.CSML'),
+    thumbnail: '/dashboard/images/agent-bots/csml.png',
   },
-};
+  webhook: {
+    label: t('AGENT_BOTS.TYPES.WEBHOOK'),
+    thumbnail: '/dashboard/images/agent-bots/webhook.svg',
+  },
+}));
 </script>
 
 <template>
   <span class="inline-flex items-center gap-1">
     <img
       v-tooltip="botTypeConfig[botType].label"
-      class="agent-bot-type--thumbnail"
+      class="h-3 w-auto"
       :src="botTypeConfig[botType].thumbnail"
       :alt="botTypeConfig[botType].label"
     />
     <span>{{ botTypeConfig[botType].label }}</span>
   </span>
 </template>
-
-<style scoped>
-.agent-bot-type--thumbnail {
-  width: auto;
-  height: var(--space-slab);
-}
-</style>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/integrations/IntegrationHooks.vue b/app/javascript/dashboard/routes/dashboard/settings/integrations/IntegrationHooks.vue
index 792e06b4d..0dc4c3372 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/integrations/IntegrationHooks.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/integrations/IntegrationHooks.vue
@@ -108,22 +108,13 @@ export default {
 </script>
 
 <template>
-  <div
-    class="overflow-auto p-4 max-w-6xl mx-auto my-auto flex flex-wrap h-full"
-  >
-    <woot-button
-      v-if="showAddButton"
-      color-scheme="success"
-      class-names="button--fixed-top"
-      icon="add-circle"
-      @click="openAddHookModal"
-    >
-      {{ $t('INTEGRATION_APPS.ADD_BUTTON') }}
-    </woot-button>
+  <div class="overflow-auto p-4 w-full my-auto flex flex-wrap h-full">
     <div v-if="showIntegrationHooks" class="w-full">
       <div v-if="isIntegrationMultiple">
         <MultipleIntegrationHooks
           :integration-id="integrationId"
+          :show-add-button="showAddButton"
+          @add="openAddHookModal"
           @delete="openDeletePopup"
         />
       </div>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/integrations/MultipleIntegrationHooks.vue b/app/javascript/dashboard/routes/dashboard/settings/integrations/MultipleIntegrationHooks.vue
index 8b8967089..ee472789b 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/integrations/MultipleIntegrationHooks.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/integrations/MultipleIntegrationHooks.vue
@@ -1,14 +1,23 @@
 <script>
 import { mapGetters } from 'vuex';
 import { useIntegrationHook } from 'dashboard/composables/useIntegrationHook';
+import BaseSettingsHeader from 'dashboard/routes/dashboard/settings/components/BaseSettingsHeader.vue';
+
 export default {
+  components: {
+    BaseSettingsHeader,
+  },
   props: {
     integrationId: {
       type: String,
       required: true,
     },
+    showAddButton: {
+      type: Boolean,
+      default: false,
+    },
   },
-  emits: ['delete'],
+  emits: ['delete', 'add'],
   setup(props) {
     const { integration, isHookTypeInbox, hasConnectedHooks } =
       useIntegrationHook(props.integrationId);
@@ -45,11 +54,37 @@ export default {
 </script>
 
 <template>
-  <div class="flex flex-row gap-4">
-    <div class="w-full lg:w-3/5">
+  <div class="flex flex-col flex-1 gap-8 overflow-auto">
+    <BaseSettingsHeader
+      :title="integration.name"
+      :description="
+        $t(
+          `INTEGRATION_APPS.SIDEBAR_DESCRIPTION.${integration.name.toUpperCase()}`,
+          { installationName: globalConfig.installationName }
+        )
+      "
+      :feature-name="integrationId"
+      :back-button-label="$t('INTEGRATION_SETTINGS.HEADER')"
+    >
+      <template #actions>
+        <woot-button
+          v-if="showAddButton"
+          class="rounded-md button nice"
+          icon="add-circle"
+          @click="$emit('add')"
+        >
+          {{ $t('INTEGRATION_APPS.ADD_BUTTON') }}
+        </woot-button>
+      </template>
+    </BaseSettingsHeader>
+    <div class="w-full">
       <table v-if="hasConnectedHooks" class="woot-table">
         <thead>
-          <th v-for="hookHeader in hookHeaders" :key="hookHeader">
+          <th
+            v-for="hookHeader in hookHeaders"
+            :key="hookHeader"
+            class="ltr:!pl-0 rtl:!pr-0"
+          >
             {{ hookHeader }}
           </th>
           <th v-if="isHookTypeInbox">
@@ -61,7 +96,7 @@ export default {
             <td
               v-for="property in hook.properties"
               :key="property"
-              class="break-words"
+              class="ltr:!pl-0 rtl:!pr-0"
             >
               {{ property }}
             </td>
@@ -90,18 +125,5 @@ export default {
         }}
       </p>
     </div>
-    <div class="hidden w-1/3 lg:block">
-      <p>
-        <b>{{ integration.name }}</b>
-      </p>
-      <p
-        v-dompurify-html="
-          $t(
-            `INTEGRATION_APPS.SIDEBAR_DESCRIPTION.${integration.name.toUpperCase()}`,
-            { installationName: globalConfig.installationName }
-          )
-        "
-      />
-    </div>
   </div>
 </template>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/integrations/integrations.routes.js b/app/javascript/dashboard/routes/dashboard/settings/integrations/integrations.routes.js
index dca2a19ed..f302f36ab 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/integrations/integrations.routes.js
+++ b/app/javascript/dashboard/routes/dashboard/settings/integrations/integrations.routes.js
@@ -48,6 +48,14 @@ export default {
       path: frontendURL('accounts/:accountId/settings/integrations'),
       component: SettingsContent,
       props: params => {
+        const integrationId = params.params?.integration_id;
+        const hideHeader = ['dialogflow'].includes(integrationId);
+
+        // Don't show header
+        if (hideHeader) {
+          return {};
+        }
+
         const showBackButton = params.name !== 'settings_integrations';
         const backUrl =
           params.name === 'settings_integrations_integration'

From 46ec92c86ea8f8d36272e5b31e2f5a1bb04d1a65 Mon Sep 17 00:00:00 2001
From: Pranav <pranav@chatwoot.com>
Date: Fri, 14 Mar 2025 17:37:36 -0700
Subject: [PATCH 4/9] fix: Improve performance of most hit APIs in widget
 (#11089)

- Cache campaigns for better performance
- Fix N+1 queries in inbox members
- Remove unused related articles
---
 .../api/v1/widget/campaigns_controller.rb     |  6 ++++-
 .../api/v1/widget/inbox_members_controller.rb |  2 +-
 .../widget/store/modules/campaign.js          | 21 ++++++++++-----
 .../modules/specs/campaign/actions.spec.js    | 26 +++++++++++++++++--
 .../modules/specs/campaign/mutations.spec.js  |  3 ++-
 .../api/v1/models/_category.json.jbuilder     | 20 --------------
 6 files changed, 47 insertions(+), 31 deletions(-)

diff --git a/app/controllers/api/v1/widget/campaigns_controller.rb b/app/controllers/api/v1/widget/campaigns_controller.rb
index cb9b96a38..10a73aa62 100644
--- a/app/controllers/api/v1/widget/campaigns_controller.rb
+++ b/app/controllers/api/v1/widget/campaigns_controller.rb
@@ -2,6 +2,10 @@ class Api::V1::Widget::CampaignsController < Api::V1::Widget::BaseController
   skip_before_action :set_contact
 
   def index
-    @campaigns = @web_widget.inbox.campaigns.where(enabled: true)
+    @campaigns = @web_widget
+                 .inbox
+                 .campaigns
+                 .where(enabled: true, account_id: @web_widget.inbox.account_id)
+                 .includes(:sender)
   end
 end
diff --git a/app/controllers/api/v1/widget/inbox_members_controller.rb b/app/controllers/api/v1/widget/inbox_members_controller.rb
index c4bc377ea..22934388b 100644
--- a/app/controllers/api/v1/widget/inbox_members_controller.rb
+++ b/app/controllers/api/v1/widget/inbox_members_controller.rb
@@ -2,6 +2,6 @@ class Api::V1::Widget::InboxMembersController < Api::V1::Widget::BaseController
   skip_before_action :set_contact
 
   def index
-    @inbox_members = @web_widget.inbox.inbox_members.includes(:user)
+    @inbox_members = @web_widget.inbox.inbox_members.includes(user: { avatar_attachment: :blob })
   end
 end
diff --git a/app/javascript/widget/store/modules/campaign.js b/app/javascript/widget/store/modules/campaign.js
index 317c64148..ad2822dd9 100644
--- a/app/javascript/widget/store/modules/campaign.js
+++ b/app/javascript/widget/store/modules/campaign.js
@@ -7,6 +7,7 @@ import {
 const state = {
   records: [],
   uiFlags: {
+    hasFetched: false,
     isError: false,
   },
   activeCampaign: {},
@@ -30,6 +31,7 @@ const resetCampaignTimers = (
 
 export const getters = {
   getCampaigns: $state => $state.records,
+  getUIFlags: $state => $state.uiFlags,
   getActiveCampaign: $state => $state.activeCampaign,
 };
 
@@ -53,15 +55,21 @@ export const actions = {
     }
   },
   initCampaigns: async (
-    { getters: { getCampaigns: campaigns }, dispatch },
+    { getters: { getCampaigns: campaigns, getUIFlags: uiFlags }, dispatch },
     { currentURL, websiteToken, isInBusinessHours }
   ) => {
     if (!campaigns.length) {
-      dispatch('fetchCampaigns', {
-        websiteToken,
-        currentURL,
-        isInBusinessHours,
-      });
+      // This check is added to ensure that the campaigns are fetched once
+      // On high traffic sites, if the campaigns are empty, the API is called
+      // every time the user changes the URL (in case of the SPA)
+      // So, we need to ensure that the campaigns are fetched only once
+      if (!uiFlags.hasFetched) {
+        dispatch('fetchCampaigns', {
+          websiteToken,
+          currentURL,
+          isInBusinessHours,
+        });
+      }
     } else {
       resetCampaignTimers(
         campaigns,
@@ -127,6 +135,7 @@ export const actions = {
 export const mutations = {
   setCampaigns($state, data) {
     $state.records = data;
+    $state.uiFlags.hasFetched = true;
   },
   setActiveCampaign($state, data) {
     $state.activeCampaign = data;
diff --git a/app/javascript/widget/store/modules/specs/campaign/actions.spec.js b/app/javascript/widget/store/modules/specs/campaign/actions.spec.js
index ca4a9736b..c24490171 100644
--- a/app/javascript/widget/store/modules/specs/campaign/actions.spec.js
+++ b/app/javascript/widget/store/modules/specs/campaign/actions.spec.js
@@ -63,15 +63,37 @@ describe('#actions', () => {
     };
     it('sends correct actions if campaigns are empty', async () => {
       await actions.initCampaigns(
-        { dispatch, getters: { getCampaigns: [] } },
+        {
+          dispatch,
+          getters: { getCampaigns: [], getUIFlags: { hasFetched: false } },
+        },
         actionParams
       );
       expect(dispatch.mock.calls).toEqual([['fetchCampaigns', actionParams]]);
       expect(campaignTimer.initTimers).not.toHaveBeenCalled();
     });
+
+    it('do not refetch if the campaigns are fetched once', async () => {
+      await actions.initCampaigns(
+        {
+          dispatch,
+          getters: { getCampaigns: [], getUIFlags: { hasFetched: true } },
+        },
+        actionParams
+      );
+      expect(dispatch.mock.calls).toEqual([]);
+      expect(campaignTimer.initTimers).not.toHaveBeenCalled();
+    });
+
     it('resets time if campaigns are available', async () => {
       await actions.initCampaigns(
-        { dispatch, getters: { getCampaigns: campaigns } },
+        {
+          dispatch,
+          getters: {
+            getCampaigns: campaigns,
+            getUIFlags: { hasFetched: true },
+          },
+        },
         actionParams
       );
       expect(dispatch.mock.calls).toEqual([]);
diff --git a/app/javascript/widget/store/modules/specs/campaign/mutations.spec.js b/app/javascript/widget/store/modules/specs/campaign/mutations.spec.js
index 28efb3146..9554a9d6b 100644
--- a/app/javascript/widget/store/modules/specs/campaign/mutations.spec.js
+++ b/app/javascript/widget/store/modules/specs/campaign/mutations.spec.js
@@ -7,9 +7,10 @@ vi.mock('widget/store/index.js', () => ({
 describe('#mutations', () => {
   describe('#setCampaigns', () => {
     it('set campaign records', () => {
-      const state = { records: [] };
+      const state = { records: [], uiFlags: {} };
       mutations.setCampaigns(state, campaigns);
       expect(state.records).toEqual(campaigns);
+      expect(state.uiFlags.hasFetched).toEqual(true);
     });
   });
 
diff --git a/app/views/public/api/v1/models/_category.json.jbuilder b/app/views/public/api/v1/models/_category.json.jbuilder
index 915914e57..15dc61668 100644
--- a/app/views/public/api/v1/models/_category.json.jbuilder
+++ b/app/views/public/api/v1/models/_category.json.jbuilder
@@ -4,26 +4,6 @@ json.locale category.locale
 json.description category.description
 json.position category.position
 
-json.related_categories do
-  if category.related_categories.any?
-    json.array! category.related_categories.each do |related_category|
-      json.partial! partial: 'public/api/v1/models/associated_category', formats: [:json], category: related_category
-    end
-  end
-end
-
-if category.parent_category.present?
-  json.parent_category do
-    json.partial! partial: 'public/api/v1/models/associated_category', formats: [:json], category: category.parent_category
-  end
-end
-
-if category.root_category.present?
-  json.root_category do
-    json.partial! partial: 'public/api/v1/models/associated_category', formats: [:json], category: category.root_category
-  end
-end
-
 json.meta do
   json.articles_count category.articles.published.size
 end

From 586dc800bb0d6772a9668eb5b4fe7c59df6fe82f Mon Sep 17 00:00:00 2001
From: Sojan Jose <sojan@pepalo.com>
Date: Sat, 15 Mar 2025 13:51:08 -0700
Subject: [PATCH 5/9] chore: Move Twilio event processing to background job
 (#11094)

- Twilio events were being processed synchronously, leading to slow API
responses.
- This change moves Twilio event processing to a background job to
improve performance and align with how other events (e.g., WhatsApp) are
handled.

---------

Co-authored-by: Pranav <pranav@chatwoot.com>
---
 app/controllers/twilio/callback_controller.rb |  2 +-
 .../twilio/delivery_status_controller.rb      |  2 +-
 .../webhooks/twilio_delivery_status_job.rb    |  8 ++++++
 app/jobs/webhooks/twilio_events_job.rb        |  8 ++++++
 .../twilio/callbacks_controller_spec.rb       | 28 +++++++++++++------
 .../twilio/delivery_status_controller_spec.rb | 26 +++++++++++------
 .../twilio_delivery_status_job_spec.rb        | 26 +++++++++++++++++
 spec/jobs/webhooks/twilio_events_job_spec.rb  | 28 +++++++++++++++++++
 8 files changed, 108 insertions(+), 20 deletions(-)
 create mode 100644 app/jobs/webhooks/twilio_delivery_status_job.rb
 create mode 100644 app/jobs/webhooks/twilio_events_job.rb
 create mode 100644 spec/jobs/webhooks/twilio_delivery_status_job_spec.rb
 create mode 100644 spec/jobs/webhooks/twilio_events_job_spec.rb

diff --git a/app/controllers/twilio/callback_controller.rb b/app/controllers/twilio/callback_controller.rb
index 7723e5dd2..ff5db952d 100644
--- a/app/controllers/twilio/callback_controller.rb
+++ b/app/controllers/twilio/callback_controller.rb
@@ -1,6 +1,6 @@
 class Twilio::CallbackController < ApplicationController
   def create
-    ::Twilio::IncomingMessageService.new(params: permitted_params).perform
+    Webhooks::TwilioEventsJob.perform_later(permitted_params.to_unsafe_hash)
 
     head :no_content
   end
diff --git a/app/controllers/twilio/delivery_status_controller.rb b/app/controllers/twilio/delivery_status_controller.rb
index cc7afb0fc..1c756a1c2 100644
--- a/app/controllers/twilio/delivery_status_controller.rb
+++ b/app/controllers/twilio/delivery_status_controller.rb
@@ -1,6 +1,6 @@
 class Twilio::DeliveryStatusController < ApplicationController
   def create
-    ::Twilio::DeliveryStatusService.new(params: permitted_params).perform
+    Webhooks::TwilioDeliveryStatusJob.perform_later(permitted_params.to_unsafe_hash)
 
     head :no_content
   end
diff --git a/app/jobs/webhooks/twilio_delivery_status_job.rb b/app/jobs/webhooks/twilio_delivery_status_job.rb
new file mode 100644
index 000000000..324a17e94
--- /dev/null
+++ b/app/jobs/webhooks/twilio_delivery_status_job.rb
@@ -0,0 +1,8 @@
+class Webhooks::TwilioDeliveryStatusJob < ApplicationJob
+  queue_as :low
+
+  def perform(params = {})
+    # Process the Twilio delivery status webhook event in the background
+    ::Twilio::DeliveryStatusService.new(params: params).perform
+  end
+end
diff --git a/app/jobs/webhooks/twilio_events_job.rb b/app/jobs/webhooks/twilio_events_job.rb
new file mode 100644
index 000000000..cd430a6eb
--- /dev/null
+++ b/app/jobs/webhooks/twilio_events_job.rb
@@ -0,0 +1,8 @@
+class Webhooks::TwilioEventsJob < ApplicationJob
+  queue_as :low
+
+  def perform(params = {})
+    # Process the Twilio webhook event in the background
+    ::Twilio::IncomingMessageService.new(params: params).perform
+  end
+end
diff --git a/spec/controllers/twilio/callbacks_controller_spec.rb b/spec/controllers/twilio/callbacks_controller_spec.rb
index bf975be6b..d16acf229 100644
--- a/spec/controllers/twilio/callbacks_controller_spec.rb
+++ b/spec/controllers/twilio/callbacks_controller_spec.rb
@@ -2,17 +2,27 @@ require 'rails_helper'
 
 RSpec.describe 'Twilio::CallbacksController', type: :request do
   include Rails.application.routes.url_helpers
-  let(:twilio_service) { instance_double(Twilio::IncomingMessageService) }
 
-  before do
-    allow(Twilio::IncomingMessageService).to receive(:new).and_return(twilio_service)
-    allow(twilio_service).to receive(:perform)
-  end
+  describe 'POST /twilio/callback' do
+    let(:params) do
+      {
+        'From' => '+1234567890',
+        'To' => '+0987654321',
+        'Body' => 'Test message',
+        'AccountSid' => 'AC123',
+        'SmsSid' => 'SM123'
+      }
+    end
 
-  describe 'GET /twilio/callback' do
-    it 'calls incoming message service' do
-      post twilio_callback_index_url, params: {}
-      expect(twilio_service).to have_received(:perform)
+    it 'enqueues the Twilio events job' do
+      expect do
+        post twilio_callback_index_url, params: params
+      end.to have_enqueued_job(Webhooks::TwilioEventsJob).with(params)
+    end
+
+    it 'returns no content status' do
+      post twilio_callback_index_url, params: params
+      expect(response).to have_http_status(:no_content)
     end
   end
 end
diff --git a/spec/controllers/twilio/delivery_status_controller_spec.rb b/spec/controllers/twilio/delivery_status_controller_spec.rb
index 05c236259..fc21f8f94 100644
--- a/spec/controllers/twilio/delivery_status_controller_spec.rb
+++ b/spec/controllers/twilio/delivery_status_controller_spec.rb
@@ -2,17 +2,25 @@ require 'rails_helper'
 
 RSpec.describe 'Twilio::DeliveryStatusController', type: :request do
   include Rails.application.routes.url_helpers
-  let(:twilio_service) { instance_double(Twilio::DeliveryStatusService) }
 
-  before do
-    allow(Twilio::DeliveryStatusService).to receive(:new).and_return(twilio_service)
-    allow(twilio_service).to receive(:perform)
-  end
+  describe 'POST /twilio/delivery_status' do
+    let(:params) do
+      {
+        'MessageSid' => 'SM123',
+        'MessageStatus' => 'delivered',
+        'AccountSid' => 'AC123'
+      }
+    end
 
-  describe 'POST /twilio/delivery' do
-    it 'calls incoming message service' do
-      post twilio_delivery_status_index_url, params: {}
-      expect(twilio_service).to have_received(:perform)
+    it 'enqueues the Twilio delivery status job' do
+      expect do
+        post twilio_delivery_status_index_url, params: params
+      end.to have_enqueued_job(Webhooks::TwilioDeliveryStatusJob).with(params)
+    end
+
+    it 'returns no content status' do
+      post twilio_delivery_status_index_url, params: params
+      expect(response).to have_http_status(:no_content)
     end
   end
 end
diff --git a/spec/jobs/webhooks/twilio_delivery_status_job_spec.rb b/spec/jobs/webhooks/twilio_delivery_status_job_spec.rb
new file mode 100644
index 000000000..dc94169ae
--- /dev/null
+++ b/spec/jobs/webhooks/twilio_delivery_status_job_spec.rb
@@ -0,0 +1,26 @@
+require 'rails_helper'
+
+RSpec.describe Webhooks::TwilioDeliveryStatusJob do
+  subject(:job) { described_class.perform_later(params) }
+
+  let(:params) do
+    {
+      'MessageSid' => 'SM123',
+      'MessageStatus' => 'delivered',
+      'AccountSid' => 'AC123'
+    }
+  end
+
+  it 'queues the job' do
+    expect { job }.to have_enqueued_job(described_class)
+      .with(params)
+      .on_queue('low')
+  end
+
+  it 'calls the Twilio::DeliveryStatusService' do
+    service = double
+    expect(Twilio::DeliveryStatusService).to receive(:new).with(params: params).and_return(service)
+    expect(service).to receive(:perform)
+    described_class.new.perform(params)
+  end
+end
diff --git a/spec/jobs/webhooks/twilio_events_job_spec.rb b/spec/jobs/webhooks/twilio_events_job_spec.rb
new file mode 100644
index 000000000..4eea87d6a
--- /dev/null
+++ b/spec/jobs/webhooks/twilio_events_job_spec.rb
@@ -0,0 +1,28 @@
+require 'rails_helper'
+
+RSpec.describe Webhooks::TwilioEventsJob do
+  subject(:job) { described_class.perform_later(params) }
+
+  let(:params) do
+    {
+      'From' => '+1234567890',
+      'To' => '+0987654321',
+      'Body' => 'Test message',
+      'AccountSid' => 'AC123',
+      'SmsSid' => 'SM123'
+    }
+  end
+
+  it 'queues the job' do
+    expect { job }.to have_enqueued_job(described_class)
+      .with(params)
+      .on_queue('low')
+  end
+
+  it 'calls the Twilio::IncomingMessageService' do
+    service = double
+    expect(Twilio::IncomingMessageService).to receive(:new).with(params: params).and_return(service)
+    expect(service).to receive(:perform)
+    described_class.new.perform(params)
+  end
+end

From bf5e4a92ddd42b540a29c7f26bb6f23d29f3baf8 Mon Sep 17 00:00:00 2001
From: Pranav <pranav@chatwoot.com>
Date: Sat, 15 Mar 2025 14:10:12 -0700
Subject: [PATCH 6/9] chore: Limit the number of articles retrieved by widget
 (#11095)

The UI displays only six articles, and this update introduces a per_page
parameter to control the number of articles returned per API call. The
value is capped between 1 and 100, with a default fallback if a lower
number is set.

This change is necessary due to high website traffic, where excessive
payloads are returned without adding value.

**Changes:**
- Add index to status, account_id, portal_id, views.
- Add per_page param in the API.
- Update the code in the frontend to fetch only 6
---
 .../api/v1/portals/articles_controller.rb       | 14 +++++++++++---
 app/javascript/widget/api/endPoints.js          |  1 +
 app/models/article.rb                           |  4 ++++
 .../api/v1/portals/articles/index.json.jbuilder |  2 +-
 app/views/widget_tests/index.html.erb           |  3 ++-
 .../20250315202035_add_index_to_articles.rb     |  8 ++++++++
 db/schema.rb                                    |  6 +++++-
 .../api/v1/portals/articles_controller_spec.rb  | 17 +++++++++++++++++
 8 files changed, 49 insertions(+), 6 deletions(-)
 create mode 100644 db/migrate/20250315202035_add_index_to_articles.rb

diff --git a/app/controllers/public/api/v1/portals/articles_controller.rb b/app/controllers/public/api/v1/portals/articles_controller.rb
index f0fcf403d..d07dbcb9d 100644
--- a/app/controllers/public/api/v1/portals/articles_controller.rb
+++ b/app/controllers/public/api/v1/portals/articles_controller.rb
@@ -6,17 +6,25 @@ class Public::Api::V1::Portals::ArticlesController < Public::Api::V1::Portals::B
   layout 'portal'
 
   def index
-    @articles = @portal.articles.published
+    @articles = @portal.articles.published.includes(:category, :author)
     @articles_count = @articles.count
     search_articles
     order_by_sort_param
-    @articles = @articles.page(list_params[:page]) if list_params[:page].present?
+    limit_results
   end
 
   def show; end
 
   private
 
+  def limit_results
+    return if list_params[:per_page].blank?
+
+    per_page = [list_params[:per_page].to_i, 100].min
+    per_page = 25 if per_page < 1
+    @articles = @articles.page(list_params[:page]).per(per_page)
+  end
+
   def search_articles
     @articles = @articles.search(list_params) if list_params.present?
   end
@@ -45,7 +53,7 @@ class Public::Api::V1::Portals::ArticlesController < Public::Api::V1::Portals::B
   end
 
   def list_params
-    params.permit(:query, :locale, :sort, :status, :page)
+    params.permit(:query, :locale, :sort, :status, :page, :per_page)
   end
 
   def permitted_params
diff --git a/app/javascript/widget/api/endPoints.js b/app/javascript/widget/api/endPoints.js
index e6ada5914..b595fdf00 100755
--- a/app/javascript/widget/api/endPoints.js
+++ b/app/javascript/widget/api/endPoints.js
@@ -103,6 +103,7 @@ const getMostReadArticles = (slug, locale) => ({
     page: 1,
     sort: 'views',
     status: 1,
+    per_page: 6,
   },
 });
 
diff --git a/app/models/article.rb b/app/models/article.rb
index ace793016..48e0529a2 100644
--- a/app/models/article.rb
+++ b/app/models/article.rb
@@ -23,9 +23,13 @@
 #
 # Indexes
 #
+#  index_articles_on_account_id             (account_id)
 #  index_articles_on_associated_article_id  (associated_article_id)
 #  index_articles_on_author_id              (author_id)
+#  index_articles_on_portal_id              (portal_id)
 #  index_articles_on_slug                   (slug) UNIQUE
+#  index_articles_on_status                 (status)
+#  index_articles_on_views                  (views)
 #
 class Article < ApplicationRecord
   include PgSearch::Model
diff --git a/app/views/public/api/v1/portals/articles/index.json.jbuilder b/app/views/public/api/v1/portals/articles/index.json.jbuilder
index 1927d5a09..43a9a173a 100644
--- a/app/views/public/api/v1/portals/articles/index.json.jbuilder
+++ b/app/views/public/api/v1/portals/articles/index.json.jbuilder
@@ -4,5 +4,5 @@ json.payload do
 end
 
 json.meta do
-  json.articles_count @articles.published.size
+  json.articles_count @articles_count
 end
diff --git a/app/views/widget_tests/index.html.erb b/app/views/widget_tests/index.html.erb
index cfc084384..9471c44c2 100644
--- a/app/views/widget_tests/index.html.erb
+++ b/app/views/widget_tests/index.html.erb
@@ -1,5 +1,6 @@
 <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0" />
-
+<body>
+</body>
 
 <%
   user_id = 1
diff --git a/db/migrate/20250315202035_add_index_to_articles.rb b/db/migrate/20250315202035_add_index_to_articles.rb
new file mode 100644
index 000000000..8b26344de
--- /dev/null
+++ b/db/migrate/20250315202035_add_index_to_articles.rb
@@ -0,0 +1,8 @@
+class AddIndexToArticles < ActiveRecord::Migration[7.0]
+  def change
+    add_index :articles, :status unless index_exists?(:articles, :status)
+    add_index :articles, :views unless index_exists?(:articles, :views)
+    add_index :articles, :portal_id unless index_exists?(:articles, :portal_id)
+    add_index :articles, :account_id unless index_exists?(:articles, :account_id)
+  end
+end
diff --git a/db/schema.rb b/db/schema.rb
index a68593c68..0818d1117 100644
--- a/db/schema.rb
+++ b/db/schema.rb
@@ -10,7 +10,7 @@
 #
 # It's strongly recommended that you check this file into your version control system.
 
-ActiveRecord::Schema[7.0].define(version: 2025_02_28_185548) do
+ActiveRecord::Schema[7.0].define(version: 2025_03_15_202035) do
   # These extensions should be enabled to support this database
   enable_extension "pg_stat_statements"
   enable_extension "pg_trgm"
@@ -159,9 +159,13 @@ ActiveRecord::Schema[7.0].define(version: 2025_02_28_185548) do
     t.string "slug", null: false
     t.integer "position"
     t.string "locale", default: "en", null: false
+    t.index ["account_id"], name: "index_articles_on_account_id"
     t.index ["associated_article_id"], name: "index_articles_on_associated_article_id"
     t.index ["author_id"], name: "index_articles_on_author_id"
+    t.index ["portal_id"], name: "index_articles_on_portal_id"
     t.index ["slug"], name: "index_articles_on_slug", unique: true
+    t.index ["status"], name: "index_articles_on_status"
+    t.index ["views"], name: "index_articles_on_views"
   end
 
   create_table "attachments", id: :serial, force: :cascade do |t|
diff --git a/spec/controllers/public/api/v1/portals/articles_controller_spec.rb b/spec/controllers/public/api/v1/portals/articles_controller_spec.rb
index 249d1e78a..08c5206c1 100644
--- a/spec/controllers/public/api/v1/portals/articles_controller_spec.rb
+++ b/spec/controllers/public/api/v1/portals/articles_controller_spec.rb
@@ -58,6 +58,23 @@ RSpec.describe 'Public Articles API', type: :request do
       expect(response_data[1][:views]).to eq(1)
       expect(response_data.last[:id]).to eq(article.id)
     end
+
+    it 'limits results based on per_page parameter' do
+      get "/hc/#{portal.slug}/#{category.locale}/articles.json", params: { per_page: 2 }
+
+      expect(response).to have_http_status(:success)
+      response_data = JSON.parse(response.body, symbolize_names: true)[:payload]
+      expect(response_data.length).to eq(2)
+      expect(JSON.parse(response.body, symbolize_names: true)[:meta][:articles_count]).to eq(5)
+    end
+
+    it 'uses default items per page if per_page is less than 1' do
+      get "/hc/#{portal.slug}/#{category.locale}/articles.json", params: { per_page: 0 }
+
+      expect(response).to have_http_status(:success)
+      response_data = JSON.parse(response.body, symbolize_names: true)[:payload]
+      expect(response_data.length).to eq(3)
+    end
   end
 
   describe 'GET /public/api/v1/portals/:slug/articles/:id' do

From 991b108a35c03b73af6366357b9e145be2ff9228 Mon Sep 17 00:00:00 2001
From: Sojan Jose <sojan@pepalo.com>
Date: Mon, 17 Mar 2025 00:17:11 -0700
Subject: [PATCH 7/9] feat: discard Twilio events when Body parameter is not
 present (#11096)

- Discard Twilio events when body parameter is not present.

---------

Co-authored-by: Pranav <pranavrajs@gmail.com>
---
 .../webhooks/twilio_delivery_status_job.rb    |  1 -
 app/jobs/webhooks/twilio_events_job.rb        |  5 +-
 spec/jobs/webhooks/twilio_events_job_spec.rb  | 66 +++++++++++++++++--
 3 files changed, 64 insertions(+), 8 deletions(-)

diff --git a/app/jobs/webhooks/twilio_delivery_status_job.rb b/app/jobs/webhooks/twilio_delivery_status_job.rb
index 324a17e94..d57946b4c 100644
--- a/app/jobs/webhooks/twilio_delivery_status_job.rb
+++ b/app/jobs/webhooks/twilio_delivery_status_job.rb
@@ -2,7 +2,6 @@ class Webhooks::TwilioDeliveryStatusJob < ApplicationJob
   queue_as :low
 
   def perform(params = {})
-    # Process the Twilio delivery status webhook event in the background
     ::Twilio::DeliveryStatusService.new(params: params).perform
   end
 end
diff --git a/app/jobs/webhooks/twilio_events_job.rb b/app/jobs/webhooks/twilio_events_job.rb
index cd430a6eb..5f44d981b 100644
--- a/app/jobs/webhooks/twilio_events_job.rb
+++ b/app/jobs/webhooks/twilio_events_job.rb
@@ -2,7 +2,10 @@ class Webhooks::TwilioEventsJob < ApplicationJob
   queue_as :low
 
   def perform(params = {})
-    # Process the Twilio webhook event in the background
+    # Skip processing if Body parameter or MediaUrl0 is not present
+    # This is to skip processing delivery events being delivered to this endpoint
+    return if params[:Body].blank? && params[:MediaUrl0].blank?
+
     ::Twilio::IncomingMessageService.new(params: params).perform
   end
 end
diff --git a/spec/jobs/webhooks/twilio_events_job_spec.rb b/spec/jobs/webhooks/twilio_events_job_spec.rb
index 4eea87d6a..f42caf675 100644
--- a/spec/jobs/webhooks/twilio_events_job_spec.rb
+++ b/spec/jobs/webhooks/twilio_events_job_spec.rb
@@ -5,11 +5,11 @@ RSpec.describe Webhooks::TwilioEventsJob do
 
   let(:params) do
     {
-      'From' => '+1234567890',
-      'To' => '+0987654321',
-      'Body' => 'Test message',
-      'AccountSid' => 'AC123',
-      'SmsSid' => 'SM123'
+      From: '+1234567890',
+      To: '+0987654321',
+      Body: 'Test message',
+      AccountSid: 'AC123',
+      SmsSid: 'SM123'
     }
   end
 
@@ -23,6 +23,60 @@ RSpec.describe Webhooks::TwilioEventsJob do
     service = double
     expect(Twilio::IncomingMessageService).to receive(:new).with(params: params).and_return(service)
     expect(service).to receive(:perform)
-    described_class.new.perform(params)
+    described_class.perform_now(params)
+  end
+
+  context 'when Body parameter or MediaUrl0 is not present' do
+    let(:params_without_body) do
+      {
+        From: '+1234567890',
+        To: '+0987654321',
+        AccountSid: 'AC123',
+        SmsSid: 'SM123'
+      }
+    end
+
+    it 'does not process the event' do
+      expect(Twilio::IncomingMessageService).not_to receive(:new)
+      described_class.perform_now(params_without_body)
+    end
+  end
+
+  context 'when Body parameter is present' do
+    let(:params_with_body) do
+      {
+        From: '+1234567890',
+        To: '+0987654321',
+        Body: 'Test message',
+        AccountSid: 'AC123',
+        SmsSid: 'SM123'
+      }
+    end
+
+    it 'processes the event' do
+      service = double
+      expect(Twilio::IncomingMessageService).to receive(:new).with(params: params_with_body).and_return(service)
+      expect(service).to receive(:perform)
+      described_class.perform_now(params_with_body)
+    end
+  end
+
+  context 'when MediaUrl0 parameter is present' do
+    let(:params_with_media) do
+      {
+        From: '+1234567890',
+        To: '+0987654321',
+        MediaUrl0: 'https://example.com/media.jpg',
+        AccountSid: 'AC123',
+        SmsSid: 'SM123'
+      }
+    end
+
+    it 'processes the event' do
+      service = double
+      expect(Twilio::IncomingMessageService).to receive(:new).with(params: params_with_media).and_return(service)
+      expect(service).to receive(:perform)
+      described_class.perform_now(params_with_media)
+    end
   end
 end

From 1c42957891d0a5e5249127aaa7c0bfa156083812 Mon Sep 17 00:00:00 2001
From: Vishnu Narayanan <iamwishnu@gmail.com>
Date: Tue, 18 Mar 2025 07:57:05 +0530
Subject: [PATCH 8/9] perf: enable active record connection pool reaper
 (#10866)

The pg_stat_activity data showed a lot of idle connections. This affects the total number of database connections available which resulted in production incidents during the weekend.

> reaping_frequency: frequency in seconds to periodically run the Reaper, which attempts to find and recover connections from dead threads, which can occur if a programmer forgets to close a connection at the end of a thread or a thread dies unexpectedly. Regardless of this setting, the Reaper will be invoked before every blocking wait. (Default nil, which means don't schedule the Reaper).

Ref: https://api.rubyonrails.org/v5.1/classes/ActiveRecord/ConnectionAdapters/ConnectionPool.html
---
 config/database.yml | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/config/database.yml b/config/database.yml
index 5cd278f8d..0577e3ee6 100644
--- a/config/database.yml
+++ b/config/database.yml
@@ -5,6 +5,9 @@ default: &default
   port: <%= ENV.fetch('POSTGRES_PORT', '5432') %>
    # ref: https://github.com/mperham/sidekiq/issues/2985#issuecomment-531097962
   pool: <%= Sidekiq.server? ? ENV.fetch('SIDEKIQ_CONCURRENCY', 10) : ENV.fetch('RAILS_MAX_THREADS', 5) %>
+  # frequency in seconds to periodically run the Reaper, which attempts
+  # to find and recover connections from dead threads
+  reaping_frequency: <%= ENV.fetch('DB_POOL_REAPING_FREQUENCY', 30) %>
   variables:
     # we are setting this value to be close to the racktimeout value. we will iterate and reduce this value going forward
     statement_timeout: <%= ENV["POSTGRES_STATEMENT_TIMEOUT"] || "14s" %>

From 3dc7045340ecb81cfcd2cda2f87e87e33d362787 Mon Sep 17 00:00:00 2001
From: Sivin Varghese <64252451+iamsivin@users.noreply.github.com>
Date: Tue, 18 Mar 2025 09:21:56 +0530
Subject: [PATCH 9/9] fix: Dropdown for custom attributes in conversation
 sidebar hides under the list (#11099)

# Pull Request Template

## Description

This PR fixes the issue where the custom attributes type list dropdown
in the conversation sidebar gets hidden under the section.

## Type of change

- [x] Bug fix (non-breaking change which fixes an issue)

## How Has This Been Tested?

### Screenshots
**Before**
<img width="310" alt="image"
src="https://github.com/user-attachments/assets/1aec7f08-8ca8-4868-914a-d545eab34dce"
/>


**After**
<img width="310" alt="image"
src="https://github.com/user-attachments/assets/eb9006f3-0bc1-4008-ac0d-1feeeadc139d"
/>



## Checklist:

- [x] My code follows the style guidelines of this project
- [x] I have performed a self-review of my code
- [ ] I have commented on my code, particularly in hard-to-understand
areas
- [ ] I have made corresponding changes to the documentation
- [x] My changes generate no new warnings
- [ ] I have added tests that prove my fix is effective or that my
feature works
- [x] New and existing unit tests pass locally with my changes
- [ ] Any dependent changes have been merged and published in downstream
modules
---
 .../conversation/customAttributes/CustomAttributes.vue          | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/javascript/dashboard/routes/dashboard/conversation/customAttributes/CustomAttributes.vue b/app/javascript/dashboard/routes/dashboard/conversation/customAttributes/CustomAttributes.vue
index 01fbe9b71..4f0cf6340 100644
--- a/app/javascript/dashboard/routes/dashboard/conversation/customAttributes/CustomAttributes.vue
+++ b/app/javascript/dashboard/routes/dashboard/conversation/customAttributes/CustomAttributes.vue
@@ -271,7 +271,7 @@ const evenClass = [
       ghost-class="ghost"
       handle=".drag-handle"
       item-key="key"
-      class="last:rounded-b-lg overflow-hidden"
+      class="last:rounded-b-lg"
       :class="evenClass"
       @start="dragging = true"
       @end="onDragEnd"