feat: apply filter on click outside

Arrow navigation was relative to current period instead of the
restored range. Now recomputes monthOffset from the difference
between restored dates and current period on URL restore.

.circleci/config.yml

@@ -144,7 +144,7 @@ jobs:
   # Backend tests with parallelization
   backend-tests:
     <<: *defaults
-    parallelism: 16
+    parallelism: 20
     steps:
       - checkout
       - node/install:

Gemfile.lock

@@ -541,9 +541,9 @@ GEM
       net-smtp
     marcel (1.0.4)
     maxminddb (0.1.22)
-    meta_request (0.8.3)
+    meta_request (0.8.5)
       rack-contrib (>= 1.1, < 3)
-      railties (>= 3.0.0, < 8)
+      railties (>= 3.0.0, < 9)
     method_source (1.1.0)
     mime-types (3.4.1)
       mime-types-data (~> 3.2015)

app/builders/messages/instagram/base_message_builder.rb

@@ -158,6 +158,7 @@ class Messages::Instagram::BaseMessageBuilder < Messages::Messenger::MessageBuil
       account_id: conversation.account_id,
       inbox_id: conversation.inbox_id,
       message_type: message_type,
+      status: @outgoing_echo ? :delivered : :sent,
       source_id: message_identifier,
       content: message_content,
       sender: @outgoing_echo ? nil : contact,
@@ -166,6 +167,7 @@ class Messages::Instagram::BaseMessageBuilder < Messages::Messenger::MessageBuil
       }
     }
 
+    params[:content_attributes][:external_echo] = true if @outgoing_echo
     params[:content_attributes][:is_unsupported] = true if message_is_unsupported?
     params
   end

app/builders/v2/reports/first_response_time_distribution_builder.rb

@@ -0,0 +1,68 @@
+class V2::Reports::FirstResponseTimeDistributionBuilder
+  include DateRangeHelper
+
+  attr_reader :account, :params
+
+  def initialize(account:, params:)
+    @account = account
+    @params = params
+  end
+
+  def build
+    build_distribution
+  end
+
+  private
+
+  def build_distribution
+    results = fetch_aggregated_counts
+    map_to_channel_types(results)
+  end
+
+  def fetch_aggregated_counts
+    ReportingEvent
+      .where(account_id: account.id, name: 'first_response')
+      .where(range_condition)
+      .group(:inbox_id)
+      .select(
+        :inbox_id,
+        bucket_case_statements
+      )
+  end
+
+  def bucket_case_statements
+    <<~SQL.squish
+      COUNT(CASE WHEN value < 3600 THEN 1 END) AS bucket_0_1h,
+      COUNT(CASE WHEN value >= 3600 AND value < 14400 THEN 1 END) AS bucket_1_4h,
+      COUNT(CASE WHEN value >= 14400 AND value < 28800 THEN 1 END) AS bucket_4_8h,
+      COUNT(CASE WHEN value >= 28800 AND value < 86400 THEN 1 END) AS bucket_8_24h,
+      COUNT(CASE WHEN value >= 86400 THEN 1 END) AS bucket_24h_plus
+    SQL
+  end
+
+  def range_condition
+    range.present? ? { created_at: range } : {}
+  end
+
+  def inbox_channel_types
+    @inbox_channel_types ||= account.inboxes.pluck(:id, :channel_type).to_h
+  end
+
+  def map_to_channel_types(results)
+    results.each_with_object({}) do |row, hash|
+      channel_type = inbox_channel_types[row.inbox_id]
+      next unless channel_type
+
+      hash[channel_type] ||= empty_buckets
+      hash[channel_type]['0-1h'] += row.bucket_0_1h
+      hash[channel_type]['1-4h'] += row.bucket_1_4h
+      hash[channel_type]['4-8h'] += row.bucket_4_8h
+      hash[channel_type]['8-24h'] += row.bucket_8_24h
+      hash[channel_type]['24h+'] += row.bucket_24h_plus
+    end
+  end
+
+  def empty_buckets
+    { '0-1h' => 0, '1-4h' => 0, '4-8h' => 0, '8-24h' => 0, '24h+' => 0 }
+  end
+end

app/builders/v2/reports/outgoing_messages_count_builder.rb

@@ -0,0 +1,79 @@
+class V2::Reports::OutgoingMessagesCountBuilder
+  include DateRangeHelper
+  attr_reader :account, :params
+
+  def initialize(account, params)
+    @account = account
+    @params = params
+  end
+
+  def build
+    send("build_by_#{params[:group_by]}")
+  end
+
+  private
+
+  def base_messages
+    account.messages.outgoing.unscope(:order).where(created_at: range)
+  end
+
+  def build_by_agent
+    counts = base_messages
+             .where(sender_type: 'User')
+             .where.not(sender_id: nil)
+             .group(:sender_id)
+             .count
+
+    user_names = account.users.where(id: counts.keys).index_by(&:id)
+
+    counts.map do |user_id, count|
+      user = user_names[user_id]
+      { id: user_id, name: user&.name, outgoing_messages_count: count }
+    end
+  end
+
+  def build_by_team
+    counts = base_messages
+             .joins('INNER JOIN conversations ON messages.conversation_id = conversations.id')
+             .where.not(conversations: { team_id: nil })
+             .group('conversations.team_id')
+             .count
+
+    team_names = account.teams.where(id: counts.keys).index_by(&:id)
+
+    counts.map do |team_id, count|
+      team = team_names[team_id]
+      { id: team_id, name: team&.name, outgoing_messages_count: count }
+    end
+  end
+
+  def build_by_inbox
+    counts = base_messages
+             .group(:inbox_id)
+             .count
+
+    inbox_names = account.inboxes.where(id: counts.keys).index_by(&:id)
+
+    counts.map do |inbox_id, count|
+      inbox = inbox_names[inbox_id]
+      { id: inbox_id, name: inbox&.name, outgoing_messages_count: count }
+    end
+  end
+
+  def build_by_label
+    counts = base_messages
+             .joins('INNER JOIN conversations ON messages.conversation_id = conversations.id')
+             .joins("INNER JOIN taggings ON taggings.taggable_id = conversations.id
+                     AND taggings.taggable_type = 'Conversation' AND taggings.context = 'labels'")
+             .joins('INNER JOIN tags ON tags.id = taggings.tag_id')
+             .group('tags.name')
+             .count
+
+    label_ids = account.labels.where(title: counts.keys).index_by(&:title)
+
+    counts.map do |label_name, count|
+      label = label_ids[label_name]
+      { id: label&.id, name: label_name, outgoing_messages_count: count }
+    end
+  end
+end

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

@@ -70,8 +70,10 @@ class Api::V1::Accounts::ConversationsController < Api::V1::Accounts::BaseContro
 
   def transcript
     render json: { error: 'email param missing' }, status: :unprocessable_entity and return if params[:email].blank?
+    return head :too_many_requests unless @conversation.account.within_email_rate_limit?
 
     ConversationReplyMailer.with(account: @conversation.account).conversation_transcript(@conversation, params[:email])&.deliver_later
+    @conversation.account.increment_email_sent_count
     head :ok
   end
 

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

@@ -35,12 +35,9 @@ class Api::V1::Widget::ConversationsController < Api::V1::Widget::BaseController
   end
 
   def transcript
-    if conversation.present? && conversation.contact.present? && conversation.contact.email.present?
-      ConversationReplyMailer.with(account: conversation.account).conversation_transcript(
-        conversation,
-        conversation.contact.email
-      )&.deliver_later
-    end
+    return head :too_many_requests unless conversation.present? && conversation.account.within_email_rate_limit?
+
+    send_transcript_email
     head :ok
   end
 
@@ -77,6 +74,16 @@ class Api::V1::Widget::ConversationsController < Api::V1::Widget::BaseController
 
   private
 
+  def send_transcript_email
+    return if conversation.contact&.email.blank?
+
+    ConversationReplyMailer.with(account: conversation.account).conversation_transcript(
+      conversation,
+      conversation.contact.email
+    )&.deliver_later
+    conversation.account.increment_email_sent_count
+  end
+
   def trigger_typing_event(event)
     Rails.configuration.dispatcher.dispatch(event, Time.zone.now, conversation: conversation, user: @contact)
   end

app/controllers/api/v2/accounts/reports_controller.rb

@@ -70,6 +70,23 @@ class Api::V2::Accounts::ReportsController < Api::V1::Accounts::BaseController
     render json: builder.build
   end
 
+  def first_response_time_distribution
+    builder = V2::Reports::FirstResponseTimeDistributionBuilder.new(
+      account: Current.account,
+      params: first_response_time_distribution_params
+    )
+    render json: builder.build
+  end
+
+  OUTGOING_MESSAGES_ALLOWED_GROUP_BY = %w[agent team inbox label].freeze
+
+  def outgoing_messages_count
+    return head :unprocessable_entity unless OUTGOING_MESSAGES_ALLOWED_GROUP_BY.include?(params[:group_by])
+
+    builder = V2::Reports::OutgoingMessagesCountBuilder.new(Current.account, outgoing_messages_count_params)
+    render json: builder.build
+  end
+
   private
 
   def generate_csv(filename, template)
@@ -156,4 +173,19 @@ class Api::V2::Accounts::ReportsController < Api::V1::Accounts::BaseController
       label_ids: params[:label_ids]
     }
   end
+
+  def first_response_time_distribution_params
+    {
+      since: params[:since],
+      until: params[:until]
+    }
+  end
+
+  def outgoing_messages_count_params
+    {
+      group_by: params[:group_by],
+      since: params[:since],
+      until: params[:until]
+    }
+  end
 end

app/controllers/super_admin/app_configs_controller.rb

@@ -42,7 +42,7 @@ class SuperAdmin::AppConfigsController < SuperAdmin::ApplicationController
       'facebook' => %w[FB_APP_ID FB_VERIFY_TOKEN FB_APP_SECRET IG_VERIFY_TOKEN FACEBOOK_API_VERSION ENABLE_MESSENGER_CHANNEL_HUMAN_AGENT],
       'shopify' => %w[SHOPIFY_CLIENT_ID SHOPIFY_CLIENT_SECRET],
       'microsoft' => %w[AZURE_APP_ID AZURE_APP_SECRET],
-      'email' => ['MAILER_INBOUND_EMAIL_DOMAIN'],
+      'email' => %w[MAILER_INBOUND_EMAIL_DOMAIN ACCOUNT_EMAILS_LIMIT ACCOUNT_EMAILS_PLAN_LIMITS],
       'linear' => %w[LINEAR_CLIENT_ID LINEAR_CLIENT_SECRET],
       'slack' => %w[SLACK_CLIENT_ID SLACK_CLIENT_SECRET],
       'instagram' => %w[INSTAGRAM_APP_ID INSTAGRAM_APP_SECRET INSTAGRAM_VERIFY_TOKEN INSTAGRAM_API_VERSION ENABLE_INSTAGRAM_CHANNEL_HUMAN_AGENT],

app/javascript/dashboard/components-next/captain/pageComponents/document/RelatedResponses.vue

@@ -18,7 +18,9 @@ const dialogRef = ref(null);
 
 const uiFlags = useMapGetter('captainResponses/getUIFlags');
 const responses = useMapGetter('captainResponses/getRecords');
+const meta = useMapGetter('captainResponses/getMeta');
 const isFetching = computed(() => uiFlags.value.fetchingList);
+const totalCount = computed(() => meta.value.totalCount || 0);
 
 const handleClose = () => {
   emit('close');
@@ -37,7 +39,7 @@ defineExpose({ dialogRef });
   <Dialog
     ref="dialogRef"
     type="edit"
-    :title="t('CAPTAIN.DOCUMENTS.RELATED_RESPONSES.TITLE')"
+    :title="`${t('CAPTAIN.DOCUMENTS.RELATED_RESPONSES.TITLE')} (${totalCount})`"
     :description="t('CAPTAIN.DOCUMENTS.RELATED_RESPONSES.DESCRIPTION')"
     :show-cancel-button="false"
     :show-confirm-button="false"

app/javascript/dashboard/components-next/message/Message.vue

@@ -3,12 +3,14 @@ import { onMounted, computed, ref, toRefs } from 'vue';
 import { useTimeoutFn } from '@vueuse/core';
 import { provideMessageContext } from './provider.js';
 import { useTrack } from 'dashboard/composables';
+import { useMapGetter } from 'dashboard/composables/store';
 import { emitter } from 'shared/helpers/mitt';
 import { useI18n } from 'vue-i18n';
 import { useRoute } from 'vue-router';
 import { LocalStorage } from 'shared/helpers/localStorage';
 import { ACCOUNT_EVENTS } from 'dashboard/helper/AnalyticsHelper/events';
 import { LOCAL_STORAGE_KEYS } from 'dashboard/constants/localStorage';
+import { getInboxIconByType } from 'dashboard/helper/inbox';
 import { BUS_EVENTS } from 'shared/constants/busEvents';
 import {
   MESSAGE_TYPES,
@@ -139,6 +141,8 @@ const showBackgroundHighlight = ref(false);
 const showContextMenu = ref(false);
 const { t } = useI18n();
 const route = useRoute();
+const inboxGetter = useMapGetter('inboxes/getInbox');
+const inbox = computed(() => inboxGetter.value(props.inboxId) || {});
 
 /**
  * Computes the message variant based on props
@@ -162,6 +166,10 @@ const variant = computed(() => {
   if (props.contentAttributes?.isUnsupported)
     return MESSAGE_VARIANTS.UNSUPPORTED;
 
+  if (props.contentAttributes?.externalEcho) {
+    return MESSAGE_VARIANTS.AGENT;
+  }
+
   const isBot = !props.sender || props.sender.type === SENDER_TYPES.AGENT_BOT;
   if (isBot && props.messageType === MESSAGE_TYPES.OUTGOING) {
     return MESSAGE_VARIANTS.BOT;
@@ -424,6 +432,18 @@ function handleReplyTo() {
 }
 
 const avatarInfo = computed(() => {
+  if (props.contentAttributes?.externalEcho) {
+    const { name, avatar_url, channel_type, medium } = inbox.value;
+    const iconName = avatar_url
+      ? null
+      : getInboxIconByType(channel_type, medium);
+    return {
+      name: iconName ? '' : name || t('CONVERSATION.NATIVE_APP'),
+      src: avatar_url || '',
+      iconName,
+    };
+  }
+
   // If no sender, return bot info
   if (!props.sender) {
     return {
@@ -451,6 +471,9 @@ const avatarInfo = computed(() => {
 });
 
 const avatarTooltip = computed(() => {
+  if (props.contentAttributes?.externalEcho) {
+    return t('CONVERSATION.NATIVE_APP_ADVISORY');
+  }
   if (avatarInfo.value.name === '') return '';
   return `${t('CONVERSATION.SENT_BY')} ${avatarInfo.value.name}`;
 });
@@ -484,7 +507,7 @@ provideMessageContext({
   <div
     v-if="shouldRenderMessage"
     :id="`message${props.id}`"
-    class="flex mb-2 w-full message-bubble-container"
+    class="flex w-full mb-2 message-bubble-container"
     :data-message-id="props.id"
     :class="[
       flexOrientationClass,

app/javascript/dashboard/components/ui/DatePicker/DatePicker.vue

@@ -1,11 +1,14 @@
 <script setup>
-import { ref, watch } from 'vue';
+import { ref, computed, watch } from 'vue';
+import { useI18n } from 'vue-i18n';
 import {
   getActiveDateRange,
   moveCalendarDate,
   DATE_RANGE_TYPES,
   CALENDAR_TYPES,
   CALENDAR_PERIODS,
+  isNavigableRange,
+  getRangeAtOffset,
 } from './helpers/DatePickerHelper';
 import {
   isValid,
@@ -13,14 +16,14 @@ import {
   subDays,
   startOfDay,
   endOfDay,
-  isBefore,
   subMonths,
   addMonths,
   isSameMonth,
   differenceInCalendarMonths,
+  differenceInCalendarWeeks,
   setMonth,
   setYear,
-  isAfter,
+  getWeek,
 } from 'date-fns';
 import { useAlert } from 'dashboard/composables';
 import DatePickerButton from './components/DatePickerButton.vue';
@@ -32,98 +35,187 @@ import CalendarWeek from './components/CalendarWeek.vue';
 import CalendarFooter from './components/CalendarFooter.vue';
 
 const emit = defineEmits(['dateRangeChanged']);
-const { LAST_7_DAYS, LAST_30_DAYS, CUSTOM_RANGE } = DATE_RANGE_TYPES;
+const { t } = useI18n();
+
+const dateRange = defineModel('dateRange', {
+  type: Array,
+  default: undefined,
+});
+
+const rangeType = defineModel('rangeType', {
+  type: String,
+  default: undefined,
+});
+const { LAST_7_DAYS, CUSTOM_RANGE } = DATE_RANGE_TYPES;
 const { START_CALENDAR, END_CALENDAR } = CALENDAR_TYPES;
 const { WEEK, MONTH, YEAR } = CALENDAR_PERIODS;
 
 const showDatePicker = ref(false);
 const calendarViews = ref({ start: WEEK, end: WEEK });
 const currentDate = ref(new Date());
-const selectedStartDate = ref(startOfDay(subDays(currentDate.value, 6))); // LAST_7_DAYS
-const selectedEndDate = ref(endOfDay(currentDate.value));
-// Setting the start and end calendar
-const startCurrentDate = ref(startOfDay(selectedStartDate.value));
+
+// Use dates from v-model if provided, otherwise default to last 7 days
+const selectedStartDate = ref(
+  dateRange.value?.[0]
+    ? startOfDay(dateRange.value[0])
+    : startOfDay(subDays(currentDate.value, 6)) // LAST_7_DAYS
+);
+const selectedEndDate = ref(
+  dateRange.value?.[1]
+    ? endOfDay(dateRange.value[1])
+    : endOfDay(currentDate.value)
+);
+// Calendar month positioning (left and right calendars)
+// These control which months are displayed in the dual calendar view
+const startCurrentDate = ref(startOfMonth(selectedStartDate.value));
 const endCurrentDate = ref(
   isSameMonth(selectedStartDate.value, selectedEndDate.value)
-    ? startOfMonth(addMonths(selectedEndDate.value, 1)) // Moves to the start of the next month if dates are in the same month (Mounted case LAST_7_DAYS)
-    : startOfMonth(selectedEndDate.value) // Always shows the month of the end date starting from the first (Mounted case LAST_7_DAYS)
+    ? startOfMonth(addMonths(selectedEndDate.value, 1)) // Same month: show next month on right (e.g., Jan 25-31 shows Jan + Feb)
+    : startOfMonth(selectedEndDate.value) // Different months: show end month on right (e.g., Dec 5 - Jan 3 shows Dec + Jan)
 );
 const selectingEndDate = ref(false);
-const selectedRange = ref(LAST_7_DAYS);
+const selectedRange = ref(rangeType.value || LAST_7_DAYS);
 const hoveredEndDate = ref(null);
+const monthOffset = ref(0);
+
+const showMonthNavigation = computed(() =>
+  isNavigableRange(selectedRange.value)
+);
+const canNavigateNext = computed(() => {
+  if (!isNavigableRange(selectedRange.value)) return false;
+  // Compare selected start to the current period's start to determine if we're in the past
+  const currentRange = getActiveDateRange(
+    selectedRange.value,
+    currentDate.value
+  );
+  return selectedStartDate.value < currentRange.start;
+});
+
+const navigationLabel = computed(() => {
+  const range = selectedRange.value;
+  if (range === DATE_RANGE_TYPES.MONTH_TO_DATE) {
+    return new Intl.DateTimeFormat(navigator.language, {
+      month: 'long',
+    }).format(selectedStartDate.value);
+  }
+  if (range === DATE_RANGE_TYPES.THIS_WEEK) {
+    const currentWeekRange = getActiveDateRange(range, currentDate.value);
+    const isCurrentWeek =
+      selectedStartDate.value.getTime() === currentWeekRange.start.getTime();
+    if (isCurrentWeek) return null;
+    const weekNumber = getWeek(selectedStartDate.value, { weekStartsOn: 1 });
+    return t('DATE_PICKER.WEEK_NUMBER', { weekNumber });
+  }
+  return null;
+});
 
 const manualStartDate = ref(selectedStartDate.value);
 const manualEndDate = ref(selectedEndDate.value);
 
-// Watcher will set the start and end dates based on the selected range
-watch(selectedRange, newRange => {
-  if (newRange !== CUSTOM_RANGE) {
-    // If selecting a range other than last 7 days or last 30 days, set the start and end dates to the selected start and end dates
-    // If selecting last 7 days or last 30 days is, set the start date to the selected start date
-    // and the end date to one month ahead of the start date if the start date and end date are in the same month
-    // Otherwise set the end date to the selected end date
-    const isLastSevenOrThirtyDays =
-      newRange === LAST_7_DAYS || newRange === LAST_30_DAYS;
-    startCurrentDate.value = selectedStartDate.value;
-    endCurrentDate.value =
-      isLastSevenOrThirtyDays &&
-      isSameMonth(selectedStartDate.value, selectedEndDate.value)
-        ? startOfMonth(addMonths(selectedStartDate.value, 1))
-        : selectedEndDate.value;
-    selectingEndDate.value = false;
-  } else if (!selectingEndDate.value) {
-    // If selecting a custom range and not selecting an end date, set the start date to the selected start date
-    startCurrentDate.value = startOfDay(currentDate.value);
-  }
-});
-
-// Watcher will set the input values based on the selected start and end dates
+// Watcher 1: Sync v-model props from parent component
+// Handles: URL params, parent component updates, rangeType changes
 watch(
-  [selectedStartDate, selectedEndDate],
-  ([newStart, newEnd]) => {
-    if (isValid(newStart)) {
-      manualStartDate.value = newStart;
-    } else {
-      manualStartDate.value = selectedStartDate.value;
+  [rangeType, dateRange],
+  ([newRangeType, newDateRange]) => {
+    if (newRangeType && newRangeType !== selectedRange.value) {
+      selectedRange.value = newRangeType;
+      monthOffset.value = 0;
+
+      // If rangeType changes without dateRange, recompute dates from the range
+      if (!newDateRange && newRangeType !== CUSTOM_RANGE) {
+        const activeDates = getActiveDateRange(newRangeType, currentDate.value);
+        if (activeDates) {
+          selectedStartDate.value = startOfDay(activeDates.start);
+          selectedEndDate.value = endOfDay(activeDates.end);
+        }
+      }
     }
 
-    if (isValid(newEnd)) {
-      manualEndDate.value = newEnd;
-    } else {
-      manualEndDate.value = selectedEndDate.value;
+    // When parent provides new dateRange (e.g., from URL params)
+    // Skip if navigating with arrows — offset controls dates in that case
+    if (newDateRange?.[0] && newDateRange?.[1] && monthOffset.value === 0) {
+      selectedStartDate.value = startOfDay(newDateRange[0]);
+      selectedEndDate.value = endOfDay(newDateRange[1]);
+
+      // Update calendar to show the months of the new date range
+      startCurrentDate.value = startOfMonth(newDateRange[0]);
+      endCurrentDate.value = isSameMonth(newDateRange[0], newDateRange[1])
+        ? startOfMonth(addMonths(newDateRange[1], 1))
+        : startOfMonth(newDateRange[1]);
+
+      // Recalculate offset so arrow navigation is relative to restored range
+      // TODO: When offset resolves to 0 (current period), the end date may be
+      // stale if the URL was saved on a previous day. "This month" / "This week"
+      // should show up-to-today dates for the current period. For now, the stale
+      // end date is shown until the user clicks an arrow or re-selects the range.
+      if (isNavigableRange(selectedRange.value)) {
+        const current = getActiveDateRange(
+          selectedRange.value,
+          currentDate.value
+        );
+        if (selectedRange.value === DATE_RANGE_TYPES.THIS_WEEK) {
+          monthOffset.value = differenceInCalendarWeeks(
+            newDateRange[0],
+            current.start,
+            { weekStartsOn: 1 }
+          );
+        } else {
+          monthOffset.value = differenceInCalendarMonths(
+            newDateRange[0],
+            current.start
+          );
+        }
+      }
     }
   },
   { immediate: true }
 );
 
-// Watcher to ensure dates are always in logical order
-// This watch is will ensure that the start date is always before the end date
+// Watcher 2: Keep manual input fields in sync with selected dates
+// Updates the input field values when dates change programmatically
 watch(
-  [startCurrentDate, endCurrentDate],
-  ([newStart, newEnd], [oldStart, oldEnd]) => {
-    const monthDifference = differenceInCalendarMonths(newEnd, newStart);
-
-    if (newStart !== oldStart) {
-      if (isAfter(newStart, newEnd) || monthDifference === 0) {
-        // Adjust the end date forward if the start date is adjusted and is after the end date or in the same month
-        endCurrentDate.value = addMonths(newStart, 1);
-      }
-    }
-    if (newEnd !== oldEnd) {
-      if (isBefore(newEnd, newStart) || monthDifference === 0) {
-        // Adjust the start date backward if the end date is adjusted and is before the start date or in the same month
-        startCurrentDate.value = subMonths(newEnd, 1);
-      }
-    }
+  [selectedStartDate, selectedEndDate],
+  ([newStart, newEnd]) => {
+    manualStartDate.value = isValid(newStart)
+      ? newStart
+      : selectedStartDate.value;
+    manualEndDate.value = isValid(newEnd) ? newEnd : selectedEndDate.value;
   },
-  { immediate: true, deep: true }
+  { immediate: true }
 );
 
 const setDateRange = range => {
   selectedRange.value = range.value;
+  monthOffset.value = 0;
   const { start, end } = getActiveDateRange(range.value, currentDate.value);
   selectedStartDate.value = start;
   selectedEndDate.value = end;
+
+  // Position calendar to show the months of the selected range
+  startCurrentDate.value = startOfMonth(start);
+  endCurrentDate.value = isSameMonth(start, end)
+    ? startOfMonth(addMonths(start, 1))
+    : startOfMonth(end);
+};
+
+const navigateMonth = direction => {
+  monthOffset.value += direction === 'prev' ? -1 : 1;
+  if (monthOffset.value > 0) monthOffset.value = 0;
+
+  const { start, end } = getRangeAtOffset(
+    selectedRange.value,
+    monthOffset.value,
+    currentDate.value
+  );
+  selectedStartDate.value = start;
+  selectedEndDate.value = end;
+
+  startCurrentDate.value = startOfMonth(start);
+  endCurrentDate.value = isSameMonth(start, end)
+    ? startOfMonth(addMonths(start, 1))
+    : startOfMonth(end);
+
+  emit('dateRangeChanged', [start, end, selectedRange.value]);
 };
 
 const moveCalendar = (calendar, direction, period = MONTH) => {
@@ -134,12 +226,27 @@ const moveCalendar = (calendar, direction, period = MONTH) => {
     direction,
     period
   );
-  startCurrentDate.value = start;
-  endCurrentDate.value = end;
+
+  // Prevent calendar months from overlapping
+  const monthDiff = differenceInCalendarMonths(end, start);
+  if (monthDiff === 0) {
+    // If they would be the same month, adjust the other calendar
+    if (calendar === START_CALENDAR) {
+      endCurrentDate.value = addMonths(start, 1);
+      startCurrentDate.value = start;
+    } else {
+      startCurrentDate.value = subMonths(end, 1);
+      endCurrentDate.value = end;
+    }
+  } else {
+    startCurrentDate.value = start;
+    endCurrentDate.value = end;
+  }
 };
 
 const selectDate = day => {
   selectedRange.value = CUSTOM_RANGE;
+  monthOffset.value = 0;
   if (!selectingEndDate.value || day < selectedStartDate.value) {
     selectedStartDate.value = day;
     selectedEndDate.value = null;
@@ -175,10 +282,10 @@ const openCalendar = (index, calendarType, period = MONTH) => {
 const updateManualInput = (newDate, calendarType) => {
   if (calendarType === START_CALENDAR) {
     selectedStartDate.value = newDate;
-    startCurrentDate.value = newDate;
+    startCurrentDate.value = startOfMonth(newDate);
   } else {
     selectedEndDate.value = newDate;
-    endCurrentDate.value = newDate;
+    endCurrentDate.value = startOfMonth(newDate);
   }
   selectingEndDate.value = false;
 };
@@ -188,13 +295,22 @@ const handleManualInputError = message => {
 };
 
 const resetDatePicker = () => {
-  startCurrentDate.value = startOfDay(currentDate.value); // Resets to today at start of the day
-  endCurrentDate.value = addMonths(startOfDay(currentDate.value), 1); // Resets to one month ahead
-  selectedStartDate.value = startOfDay(subDays(currentDate.value, 6));
-  selectedEndDate.value = endOfDay(currentDate.value);
+  // Calculate Last 7 days from today
+  const startDate = startOfDay(subDays(currentDate.value, 6));
+  const endDate = endOfDay(currentDate.value);
+
+  selectedStartDate.value = startDate;
+  selectedEndDate.value = endDate;
+
+  // Position calendar to show the months of Last 7 days
+  // Example: If today is Feb 5, Last 7 days = Jan 30 - Feb 5, so show Jan + Feb
+  startCurrentDate.value = startOfMonth(startDate);
+  endCurrentDate.value = isSameMonth(startDate, endDate)
+    ? startOfMonth(addMonths(startDate, 1))
+    : startOfMonth(endDate);
   selectingEndDate.value = false;
   selectedRange.value = LAST_7_DAYS;
-  // Reset view modes if they are being used to toggle between different calendar views
+  monthOffset.value = 0;
   calendarViews.value = { start: WEEK, end: WEEK };
 };
 
@@ -203,26 +319,58 @@ const emitDateRange = () => {
     useAlert('Please select a valid time range');
   } else {
     showDatePicker.value = false;
-    emit('dateRangeChanged', [selectedStartDate.value, selectedEndDate.value]);
+    emit('dateRangeChanged', [
+      selectedStartDate.value,
+      selectedEndDate.value,
+      selectedRange.value,
+    ]);
   }
 };
 
+// Called when picker opens - positions calendar to show selected date range
+// Fixes issue where calendar showed wrong months when loaded from URL params
+const initializeCalendarMonths = () => {
+  if (selectedStartDate.value && selectedEndDate.value) {
+    startCurrentDate.value = startOfMonth(selectedStartDate.value);
+    endCurrentDate.value = isSameMonth(
+      selectedStartDate.value,
+      selectedEndDate.value
+    )
+      ? startOfMonth(addMonths(selectedEndDate.value, 1))
+      : startOfMonth(selectedEndDate.value);
+  }
+};
+
+const toggleDatePicker = () => {
+  showDatePicker.value = !showDatePicker.value;
+  if (showDatePicker.value) initializeCalendarMonths();
+};
+
 const closeDatePicker = () => {
-  showDatePicker.value = false;
+  if (isValid(selectedStartDate.value) && isValid(selectedEndDate.value)) {
+    emitDateRange();
+  } else {
+    showDatePicker.value = false;
+  }
 };
 </script>
 
 <template>
-  <div v-on-clickaway="closeDatePicker" class="relative font-inter">
+  <div class="relative flex-shrink-0 font-inter">
     <DatePickerButton
       :selected-start-date="selectedStartDate"
       :selected-end-date="selectedEndDate"
       :selected-range="selectedRange"
-      @open="showDatePicker = !showDatePicker"
+      :show-month-navigation="showMonthNavigation"
+      :can-navigate-next="canNavigateNext"
+      :navigation-label="navigationLabel"
+      @open="toggleDatePicker"
+      @navigate-month="navigateMonth"
     />
     <div
       v-if="showDatePicker"
-      class="flex absolute top-9 ltr:left-0 rtl:right-0 z-30 shadow-md select-none w-[880px] h-[490px] rounded-2xl bg-n-alpha-3 backdrop-blur-[100px] border-0 outline outline-1 outline-n-container"
+      v-on-clickaway="closeDatePicker"
+      class="flex absolute top-9 ltr:left-0 rtl:right-0 z-30 shadow-md select-none w-[880px] rounded-2xl bg-n-alpha-3 backdrop-blur-[100px] border-0 outline outline-1 outline-n-container"
     >
       <CalendarDateRange
         :selected-range="selectedRange"

app/javascript/dashboard/components/ui/DatePicker/components/CalendarAction.vue

@@ -46,13 +46,13 @@ const onClickSetView = (type, mode) => {
       xs
       icon="i-lucide-chevron-left"
       class="rtl:rotate-180"
-      @click="onClickPrev(calendarType)"
+      @click.stop="onClickPrev(calendarType)"
     />
     <div class="flex items-center gap-1">
       <button
         v-if="firstButtonLabel"
         class="p-0 text-sm font-medium text-center text-n-slate-12 hover:text-n-brand"
-        @click="onClickSetView(calendarType, viewMode)"
+        @click.stop="onClickSetView(calendarType, viewMode)"
       >
         {{ firstButtonLabel }}
       </button>
@@ -60,7 +60,7 @@ const onClickSetView = (type, mode) => {
         v-if="buttonLabel"
         class="p-0 text-sm font-medium text-center text-n-slate-12"
         :class="{ 'hover:text-n-brand': viewMode }"
-        @click="onClickSetView(calendarType, YEAR)"
+        @click.stop="onClickSetView(calendarType, YEAR)"
       >
         {{ buttonLabel }}
       </button>
@@ -71,7 +71,7 @@ const onClickSetView = (type, mode) => {
       xs
       icon="i-lucide-chevron-right"
       class="rtl:rotate-180"
-      @click="onClickNext(calendarType)"
+      @click.stop="onClickNext(calendarType)"
     />
   </div>
 </template>

app/javascript/dashboard/components/ui/DatePicker/components/CalendarDateRange.vue

@@ -18,24 +18,25 @@ const setDateRange = range => {
 <template>
   <div class="w-[200px] flex flex-col items-start">
     <h4
-      class="w-full px-5 py-4 text-sm font-medium capitalize text-start text-n-slate-12"
+      class="w-full px-5 py-4 text-xs font-bold capitalize text-start text-n-slate-10"
     >
       {{ $t('DATE_PICKER.DATE_RANGE_OPTIONS.TITLE') }}
     </h4>
     <div class="flex flex-col items-start w-full">
-      <button
-        v-for="range in dateRanges"
-        :key="range.label"
-        class="w-full px-5 py-3 text-sm font-medium truncate border-none rounded-none text-start hover:bg-n-alpha-2 dark:hover:bg-n-solid-3"
-        :class="
-          range.value === selectedRange
-            ? 'text-n-slate-12 bg-n-alpha-1 dark:bg-n-solid-active'
-            : 'text-n-slate-12'
-        "
-        @click="setDateRange(range)"
-      >
-        {{ $t(range.label) }}
-      </button>
+      <template v-for="range in dateRanges" :key="range.label">
+        <div v-if="range.separator" class="w-full border-t border-n-strong" />
+        <button
+          class="w-full px-5 py-3 text-sm font-medium truncate border-none rounded-none text-start hover:bg-n-alpha-2 dark:hover:bg-n-solid-3"
+          :class="
+            range.value === selectedRange
+              ? 'text-n-slate-12 bg-n-alpha-1 dark:bg-n-solid-active'
+              : 'text-n-slate-12'
+          "
+          @click="setDateRange(range)"
+        >
+          {{ $t(range.label) }}
+        </button>
+      </template>
     </div>
   </div>
 </template>

app/javascript/dashboard/components/ui/DatePicker/components/CalendarFooter.vue

@@ -23,7 +23,6 @@ const onClickApply = () => {
     />
     <NextButton
       sm
-      ghost
       :label="$t('DATE_PICKER.APPLY_BUTTON')"
       @click="onClickApply"
     />

app/javascript/dashboard/components/ui/DatePicker/components/CalendarMonth.vue

@@ -78,7 +78,7 @@ const selectMonth = index => {
           'hover:bg-n-alpha-2 dark:hover:bg-n-solid-3':
             index !== activeMonthIndex,
         }"
-        @click="selectMonth(index)"
+        @click.stop="selectMonth(index)"
       >
         {{ month }}
       </button>

app/javascript/dashboard/components/ui/DatePicker/components/CalendarYear.vue

@@ -77,7 +77,7 @@ const selectYear = year => {
           'bg-n-brand text-white hover:bg-n-blue-10': year === activeYear,
           'hover:bg-n-alpha-2 dark:hover:bg-n-solid-3': year !== activeYear,
         }"
-        @click="selectYear(year)"
+        @click.stop="selectYear(year)"
       >
         {{ year }}
       </button>

app/javascript/dashboard/components/ui/DatePicker/components/DatePickerButton.vue

@@ -2,6 +2,8 @@
 import { computed } from 'vue';
 import { dateRanges } from '../helpers/DatePickerHelper';
 import { format, isSameYear, isValid } from 'date-fns';
+import Icon from 'dashboard/components-next/icon/Icon.vue';
+import NextButton from 'dashboard/components-next/button/Button.vue';
 
 const props = defineProps({
   selectedStartDate: Date,
@@ -10,9 +12,21 @@ const props = defineProps({
     type: String,
     default: '',
   },
+  showMonthNavigation: {
+    type: Boolean,
+    default: false,
+  },
+  canNavigateNext: {
+    type: Boolean,
+    default: false,
+  },
+  navigationLabel: {
+    type: String,
+    default: null,
+  },
 });
 
-const emit = defineEmits(['open']);
+const emit = defineEmits(['open', 'navigateMonth']);
 
 const formatDateRange = computed(() => {
   const startDate = props.selectedStartDate;
@@ -22,19 +36,15 @@ const formatDateRange = computed(() => {
     return 'Select a date range';
   }
 
-  const formatString = isSameYear(startDate, endDate)
-    ? 'MMM d' // Same year: "Apr 1"
-    : 'MMM d yyyy'; // Different years: "Apr 1 2025"
+  const now = new Date();
+  const bothCurrentYear =
+    isSameYear(startDate, now) && isSameYear(endDate, now);
 
-  if (isSameYear(startDate, new Date()) && isSameYear(endDate, new Date())) {
-    // Both dates are in the current year
+  if (bothCurrentYear) {
     return `${format(startDate, 'MMM d')} - ${format(endDate, 'MMM d')}`;
   }
-  // At least one date is not in the current year
-  return `${format(startDate, formatString)} - ${format(
-    endDate,
-    formatString
-  )}`;
+
+  return `${format(startDate, 'MMM d yyyy')} - ${format(endDate, 'MMM d yyyy')}`;
 });
 
 const activeDateRange = computed(
@@ -47,17 +57,46 @@ const openDatePicker = () => {
 </script>
 
 <template>
-  <button
-    class="inline-flex relative items-center rounded-lg gap-2 py-1.5 px-3 h-8 bg-n-alpha-2 hover:bg-n-alpha-1 active:bg-n-alpha-1"
-    @click="openDatePicker"
-  >
-    <fluent-icon class="text-n-slate-12" icon="calendar" size="16" />
-    <span class="text-sm font-medium text-n-slate-12">
-      {{ $t(activeDateRange) }}
-    </span>
-    <span class="text-sm font-medium text-n-slate-11">
-      {{ formatDateRange }}
-    </span>
-    <fluent-icon class="text-n-slate-12" icon="chevron-down" size="14" />
-  </button>
+  <div class="inline-flex items-center gap-1">
+    <button
+      class="inline-flex relative items-center rounded-lg gap-2 py-1.5 px-3 h-8 bg-n-alpha-2 hover:bg-n-alpha-1 active:bg-n-alpha-1 flex-shrink-0"
+      @click="openDatePicker"
+    >
+      <Icon
+        icon="i-lucide-calendar-range"
+        class="text-n-slate-11 size-3.5 flex-shrink-0"
+      />
+      <span class="text-sm font-medium text-n-slate-12 truncate">
+        {{ navigationLabel || $t(activeDateRange) }}
+      </span>
+      <span class="text-sm font-medium text-n-slate-11 truncate">
+        {{ formatDateRange }}
+      </span>
+      <Icon
+        icon="i-lucide-chevron-down"
+        class="text-n-slate-12 size-4 flex-shrink-0"
+      />
+    </button>
+    <NextButton
+      v-if="showMonthNavigation"
+      v-tooltip.top="$t('DATE_PICKER.PREVIOUS_PERIOD')"
+      slate
+      faded
+      sm
+      icon="i-lucide-chevron-left"
+      class="rtl:rotate-180"
+      @click="emit('navigateMonth', 'prev')"
+    />
+    <NextButton
+      v-if="showMonthNavigation"
+      v-tooltip.top="$t('DATE_PICKER.NEXT_PERIOD')"
+      slate
+      faded
+      sm
+      icon="i-lucide-chevron-right"
+      class="rtl:rotate-180"
+      :disabled="!canNavigateNext"
+      @click="emit('navigateMonth', 'next')"
+    />
+  </div>
 </template>

app/javascript/dashboard/components/ui/DatePicker/helpers/DatePickerHelper.js

@@ -10,6 +10,8 @@ import {
   isSameMonth,
   format,
   startOfWeek,
+  endOfWeek,
+  addWeeks,
   addDays,
   eachDayOfInterval,
   endOfMonth,
@@ -34,13 +36,27 @@ export const dateRanges = [
   {
     label: 'DATE_PICKER.DATE_RANGE_OPTIONS.LAST_3_MONTHS',
     value: 'last3months',
+    separator: true,
   },
   {
     label: 'DATE_PICKER.DATE_RANGE_OPTIONS.LAST_6_MONTHS',
     value: 'last6months',
   },
   { label: 'DATE_PICKER.DATE_RANGE_OPTIONS.LAST_YEAR', value: 'lastYear' },
-  { label: 'DATE_PICKER.DATE_RANGE_OPTIONS.CUSTOM_RANGE', value: 'custom' },
+  {
+    label: 'DATE_PICKER.DATE_RANGE_OPTIONS.THIS_WEEK',
+    value: 'thisWeek',
+    separator: true,
+  },
+  {
+    label: 'DATE_PICKER.DATE_RANGE_OPTIONS.MONTH_TO_DATE',
+    value: 'monthToDate',
+  },
+  {
+    label: 'DATE_PICKER.DATE_RANGE_OPTIONS.CUSTOM_RANGE',
+    value: 'custom',
+    separator: true,
+  },
 ];
 
 export const DATE_RANGE_TYPES = {
@@ -49,6 +65,8 @@ export const DATE_RANGE_TYPES = {
   LAST_3_MONTHS: 'last3months',
   LAST_6_MONTHS: 'last6months',
   LAST_YEAR: 'lastYear',
+  THIS_WEEK: 'thisWeek',
+  MONTH_TO_DATE: 'monthToDate',
   CUSTOM_RANGE: 'custom',
 };
 
@@ -210,6 +228,14 @@ export const getActiveDateRange = (range, currentDate) => {
       start: startOfDay(subMonths(currentDate, 12)),
       end: endOfDay(currentDate),
     }),
+    thisWeek: () => ({
+      start: startOfDay(startOfWeek(currentDate, { weekStartsOn: 1 })),
+      end: endOfDay(currentDate),
+    }),
+    monthToDate: () => ({
+      start: startOfDay(startOfMonth(currentDate)),
+      end: endOfDay(currentDate),
+    }),
     custom: () => ({ start: currentDate, end: currentDate }),
   };
 
@@ -217,3 +243,48 @@ export const getActiveDateRange = (range, currentDate) => {
     ranges[range] || (() => ({ start: currentDate, end: currentDate }))
   )();
 };
+
+export const isNavigableRange = rangeType =>
+  rangeType === DATE_RANGE_TYPES.MONTH_TO_DATE ||
+  rangeType === DATE_RANGE_TYPES.THIS_WEEK;
+
+const WEEK_START = 1; // Monday
+
+const getWeekRangeAtOffset = (offset, currentDate) => {
+  if (offset === 0) {
+    return {
+      start: startOfDay(startOfWeek(currentDate, { weekStartsOn: WEEK_START })),
+      end: endOfDay(currentDate),
+    };
+  }
+  const targetWeek = addWeeks(currentDate, offset);
+  return {
+    start: startOfDay(startOfWeek(targetWeek, { weekStartsOn: WEEK_START })),
+    end: endOfDay(endOfWeek(targetWeek, { weekStartsOn: WEEK_START })),
+  };
+};
+
+const getMonthRangeAtOffset = (offset, currentDate) => {
+  if (offset === 0) {
+    return {
+      start: startOfDay(startOfMonth(currentDate)),
+      end: endOfDay(currentDate),
+    };
+  }
+  const targetMonth = addMonths(currentDate, offset);
+  return {
+    start: startOfDay(startOfMonth(targetMonth)),
+    end: endOfDay(endOfMonth(targetMonth)),
+  };
+};
+
+export const getRangeAtOffset = (
+  rangeType,
+  offset,
+  currentDate = new Date()
+) => {
+  if (rangeType === DATE_RANGE_TYPES.THIS_WEEK) {
+    return getWeekRangeAtOffset(offset, currentDate);
+  }
+  return getMonthRangeAtOffset(offset, currentDate);
+};

app/javascript/dashboard/components/ui/Dropdown/DropdownSearch.vue

@@ -34,8 +34,8 @@ const value = defineModel({
       <input
         v-model="value"
         :placeholder="inputPlaceholder"
-        type="text"
-        class="w-full mb-0 text-sm !outline-0 bg-transparent text-n-slate-12 placeholder:text-n-slate-10 reset-base"
+        type="search"
+        class="w-full mb-0 text-sm !outline-0 !outline-none bg-transparent text-n-slate-12 placeholder:text-n-slate-10 reset-base"
       />
     </div>
     <!-- Clear filter button -->

app/javascript/dashboard/helper/validations.js

@@ -127,6 +127,7 @@ const validateSingleAction = action => {
     'resolve_conversation',
     'remove_assigned_team',
     'open_conversation',
+    'pending_conversation',
   ];
 
   if (

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

@@ -150,7 +150,8 @@
       "ADD_PRIVATE_NOTE": "Add a Private Note",
       "CHANGE_PRIORITY": "Change Priority",
       "ADD_SLA": "Add SLA",
-      "OPEN_CONVERSATION": "Open conversation"
+      "OPEN_CONVERSATION": "Open conversation",
+      "PENDING_CONVERSATION": "Mark conversation as pending"
     },
     "MESSAGE_TYPES": {
       "INCOMING": "Incoming Message",

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

@@ -253,6 +253,8 @@
     "MESSAGE_ERROR": "Unable to send this message, please try again later",
     "SENT_BY": "Sent by:",
     "BOT": "Bot",
+    "NATIVE_APP": "Native app",
+    "NATIVE_APP_ADVISORY": "This message was sent from the native app. Reply from Chatwoot to maintain the message window.",
     "SEND_FAILED": "Couldn't send message! Try again",
     "TRY_AGAIN": "retry",
     "ASSIGNMENT": {

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

@@ -1,5 +1,8 @@
 {
   "DATE_PICKER": {
+    "PREVIOUS_PERIOD": "Previous period",
+    "NEXT_PERIOD": "Next period",
+    "WEEK_NUMBER": "Week #{weekNumber}",
     "APPLY_BUTTON": "Apply",
     "CLEAR_BUTTON": "Clear",
     "DATE_RANGE_INPUT": {
@@ -13,6 +16,8 @@
       "LAST_3_MONTHS": "Last 3 months",
       "LAST_6_MONTHS": "Last 6 months",
       "LAST_YEAR": "Last year",
+      "THIS_WEEK": "This week",
+      "MONTH_TO_DATE": "This month",
       "CUSTOM_RANGE": "Custom date range"
     }
   }

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

@@ -128,11 +128,16 @@
   },
   "AGENT_REPORTS": {
     "HEADER": "Agents Overview",
-    "DESCRIPTION": "Easily track agent performance with key metrics such as conversations, response times, resolution times, and resolved cases. Click an agent’s name to learn more.",
+    "DESCRIPTION": "Easily track agent performance with key metrics such as conversations, response times, resolution times, and resolved cases. Click an agent's name to learn more.",
     "LOADING_CHART": "Loading chart data...",
     "NO_ENOUGH_DATA": "We've not received enough data points to generate report, Please try again later.",
     "DOWNLOAD_AGENT_REPORTS": "Download agent reports",
     "FILTER_DROPDOWN_LABEL": "Select Agent",
+    "FILTERS": {
+      "INPUT_PLACEHOLDER": {
+        "AGENTS": "Search agents"
+      }
+    },
     "METRICS": {
       "CONVERSATIONS": {
         "NAME": "Conversations",
@@ -201,6 +206,11 @@
     "NO_ENOUGH_DATA": "We've not received enough data points to generate report, Please try again later.",
     "DOWNLOAD_LABEL_REPORTS": "Download label reports",
     "FILTER_DROPDOWN_LABEL": "Select Label",
+    "FILTERS": {
+      "INPUT_PLACEHOLDER": {
+        "LABELS": "Search labels"
+      }
+    },
     "METRICS": {
       "CONVERSATIONS": {
         "NAME": "Conversations",
@@ -271,6 +281,11 @@
     "FILTER_DROPDOWN_LABEL": "Select Inbox",
     "ALL_INBOXES": "All Inboxes",
     "SEARCH_INBOX": "Search Inbox",
+    "FILTERS": {
+      "INPUT_PLACEHOLDER": {
+        "INBOXES": "Search inboxes"
+      }
+    },
     "METRICS": {
       "CONVERSATIONS": {
         "NAME": "Conversations",
@@ -334,11 +349,19 @@
   },
   "TEAM_REPORTS": {
     "HEADER": "Team Overview",
-    "DESCRIPTION": "Get a snapshot of your team’s performance with essential metrics, including conversations, response times, resolution times, and resolved cases. Click a team name for more details.",
+    "DESCRIPTION": "Get a snapshot of your team's performance with essential metrics, including conversations, response times, resolution times, and resolved cases. Click a team name for more details.",
     "LOADING_CHART": "Loading chart data...",
     "NO_ENOUGH_DATA": "We've not received enough data points to generate report, Please try again later.",
     "DOWNLOAD_TEAM_REPORTS": "Download team reports",
     "FILTER_DROPDOWN_LABEL": "Select Team",
+    "FILTERS": {
+      "ADD_FILTER": "Add filter",
+      "CLEAR_ALL": "Clear all",
+      "NO_FILTER": "No filters available",
+      "INPUT_PLACEHOLDER": {
+        "TEAMS": "Search teams"
+      }
+    },
     "METRICS": {
       "CONVERSATIONS": {
         "NAME": "Conversations",

app/javascript/dashboard/routes/dashboard/settings/automation/constants.js

@@ -116,6 +116,10 @@ export const AUTOMATIONS = {
         key: 'open_conversation',
         name: 'OPEN_CONVERSATION',
       },
+      {
+        key: 'pending_conversation',
+        name: 'PENDING_CONVERSATION',
+      },
       {
         key: 'resolve_conversation',
         name: 'RESOLVE_CONVERSATION',
@@ -232,6 +236,10 @@ export const AUTOMATIONS = {
         key: 'snooze_conversation',
         name: 'SNOOZE_CONVERSATION',
       },
+      {
+        key: 'pending_conversation',
+        name: 'PENDING_CONVERSATION',
+      },
       {
         key: 'resolve_conversation',
         name: 'RESOLVE_CONVERSATION',
@@ -360,6 +368,10 @@ export const AUTOMATIONS = {
         key: 'snooze_conversation',
         name: 'SNOOZE_CONVERSATION',
       },
+      {
+        key: 'pending_conversation',
+        name: 'PENDING_CONVERSATION',
+      },
       {
         key: 'resolve_conversation',
         name: 'RESOLVE_CONVERSATION',
@@ -482,6 +494,10 @@ export const AUTOMATIONS = {
         key: 'snooze_conversation',
         name: 'SNOOZE_CONVERSATION',
       },
+      {
+        key: 'pending_conversation',
+        name: 'PENDING_CONVERSATION',
+      },
       {
         key: 'send_webhook_event',
         name: 'SEND_WEBHOOK_EVENT',
@@ -668,6 +684,11 @@ export const AUTOMATION_ACTION_TYPES = [
     label: 'OPEN_CONVERSATION',
     inputType: null,
   },
+  {
+    key: 'pending_conversation',
+    label: 'PENDING_CONVERSATION',
+    inputType: null,
+  },
   {
     key: 'send_webhook_event',
     label: 'SEND_WEBHOOK_EVENT',

app/javascript/dashboard/routes/dashboard/settings/reports/BotReports.vue

@@ -1,7 +1,7 @@
 <script>
 import { useAlert, useTrack } from 'dashboard/composables';
 import BotMetrics from './components/BotMetrics.vue';
-import ReportFilterSelector from './components/FilterSelector.vue';
+import ReportFilters from './components/ReportFilters.vue';
 import { GROUP_BY_FILTER } from './constants';
 import ReportContainer from './ReportContainer.vue';
 import { REPORTS_EVENTS } from '../../../../helper/AnalyticsHelper/events';
@@ -12,7 +12,7 @@ export default {
   components: {
     BotMetrics,
     ReportHeader,
-    ReportFilterSelector,
+    ReportFilters,
     ReportContainer,
   },
   data() {
@@ -88,10 +88,10 @@ export default {
 <template>
   <ReportHeader :header-title="$t('BOT_REPORTS.HEADER')" />
   <div class="flex flex-col gap-4">
-    <ReportFilterSelector
-      :show-agents-filter="false"
-      show-group-by-filter
-      :show-business-hours-switch="false"
+    <ReportFilters
+      :show-entity-filter="false"
+      show-group-by
+      :show-business-hours="false"
       @filter-change="onFilterChange"
     />
 

app/javascript/dashboard/routes/dashboard/settings/reports/CsatResponses.vue

@@ -52,6 +52,9 @@ export default {
       );
     },
   },
+  mounted() {
+    this.$store.dispatch('agents/get');
+  },
   methods: {
     getAllData() {
       try {

app/javascript/dashboard/routes/dashboard/settings/reports/Index.vue

@@ -1,7 +1,7 @@
 <script>
 import V4Button from 'dashboard/components-next/button/Button.vue';
 import { useAlert, useTrack } from 'dashboard/composables';
-import ReportFilterSelector from './components/FilterSelector.vue';
+import ReportFilters from './components/ReportFilters.vue';
 import { GROUP_BY_FILTER } from './constants';
 import { REPORTS_EVENTS } from '../../../../helper/AnalyticsHelper/events';
 import { generateFileName } from 'dashboard/helper/downloadHelper';
@@ -22,7 +22,7 @@ export default {
   name: 'ConversationReports',
   components: {
     ReportHeader,
-    ReportFilterSelector,
+    ReportFilters,
     ReportContainer,
     V4Button,
   },
@@ -115,10 +115,10 @@ export default {
       @click="downloadConversationReports"
     />
   </ReportHeader>
-  <div class="flex flex-col gap-3">
-    <ReportFilterSelector
-      :show-agents-filter="false"
-      show-group-by-filter
+  <div class="flex flex-col">
+    <ReportFilters
+      :show-entity-filter="false"
+      show-group-by
       @filter-change="onFilterChange"
     />
     <ReportContainer :group-by="groupBy" />

app/javascript/dashboard/routes/dashboard/settings/reports/ReportContainer.vue

@@ -145,7 +145,7 @@ export default {
 
 <template>
   <div
-    class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-2 px-6 py-5 shadow outline-1 outline outline-n-container rounded-xl bg-n-solid-2"
+    class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-2 px-6 py-5 shadow outline-1 outline outline-n-container rounded-xl bg-n-solid-2 mt-4"
   >
     <div
       v-for="metric in metrics"

app/javascript/dashboard/routes/dashboard/settings/reports/components/Csat/CsatFilters.vue

@@ -2,6 +2,8 @@
 import { ref, computed, onMounted } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useStore } from 'vuex';
+import { useRoute, useRouter } from 'vue-router';
+import { subDays, fromUnixTime } from 'date-fns';
 import { getUnixStartOfDay, getUnixEndOfDay } from 'helpers/DateHelper';
 import {
   buildFilterList,
@@ -13,6 +15,12 @@ import FilterButton from 'dashboard/components/ui/Dropdown/DropdownButton.vue';
 import ActiveFilterChip from '../Filters/v3/ActiveFilterChip.vue';
 import AddFilterChip from '../Filters/v3/AddFilterChip.vue';
 import WootDatePicker from 'dashboard/components/ui/DatePicker/DatePicker.vue';
+import {
+  parseReportURLParams,
+  parseFilterURLParams,
+  generateCompleteURLParams,
+} from '../../helpers/reportFilterHelper';
+import { DATE_RANGE_TYPES } from 'dashboard/components/ui/DatePicker/helpers/DatePickerHelper';
 
 const props = defineProps({
   showTeamFilter: {
@@ -25,16 +33,29 @@ const emit = defineEmits(['filterChange']);
 
 const { t } = useI18n();
 const store = useStore();
+const route = useRoute();
+const router = useRouter();
+
+// Initialize from URL params immediately
+const urlParams = parseReportURLParams(route.query);
+const urlFilters = parseFilterURLParams(route.query);
+
+const initialDateRange =
+  urlParams.from && urlParams.to
+    ? [fromUnixTime(urlParams.from), fromUnixTime(urlParams.to)]
+    : [subDays(new Date(), 6), new Date()];
 
 const showDropdownMenu = ref(false);
 const showSubDropdownMenu = ref(false);
 const activeFilterType = ref('');
-const customDateRange = ref([new Date(), new Date()]);
+const customDateRange = ref(initialDateRange);
+const selectedDateRange = ref(urlParams.range || DATE_RANGE_TYPES.LAST_7_DAYS);
+
 const appliedFilters = ref({
-  user_ids: null,
-  inbox_id: null,
-  team_id: null,
-  rating: null,
+  user_ids: urlFilters.agent_id,
+  inbox_id: urlFilters.inbox_id,
+  team_id: urlFilters.team_id,
+  rating: urlFilters.rating,
 });
 
 const agents = computed(() => store.getters['agents/getAgents']);
@@ -111,13 +132,17 @@ const activeFilters = computed(() => {
   const activeKeys = Object.keys(appliedFilters.value).filter(
     key => appliedFilters.value[key]
   );
+
   return activeKeys.map(key => {
     const filterType = getFilterType(key, 'keyToType');
     const items = getFilterSource(filterType);
     const item = getActiveFilter(items, filterType, appliedFilters.value[key]);
+    const displayName =
+      item?.name || item?.title || `ID: ${appliedFilters.value[key]}`;
+
     return {
-      id: item?.id,
-      name: item?.name || '',
+      id: item?.id || appliedFilters.value[key],
+      name: displayName,
       type: filterType,
       options: getFilterOptions(filterType),
     };
@@ -130,7 +155,23 @@ const hasActiveFilters = computed(() =>
 
 const isAllFilterSelected = computed(() => !filterListMenuItems.value.length);
 
+const updateURLParams = () => {
+  const params = generateCompleteURLParams({
+    from: from.value,
+    to: to.value,
+    range: selectedDateRange.value,
+    filters: {
+      agent_id: appliedFilters.value.user_ids,
+      inbox_id: appliedFilters.value.inbox_id,
+      team_id: appliedFilters.value.team_id,
+      rating: appliedFilters.value.rating,
+    },
+  });
+  router.replace({ query: params });
+};
+
 const emitChange = () => {
+  updateURLParams();
   emit('filterChange', {
     from: from.value,
     to: to.value,
@@ -200,7 +241,9 @@ const openActiveFilterDropdown = filterType => {
 };
 
 const onDateRangeChange = value => {
-  customDateRange.value = value;
+  const [startDate, endDate, rangeType] = value;
+  customDateRange.value = [startDate, endDate];
+  selectedDateRange.value = rangeType || DATE_RANGE_TYPES.CUSTOM_RANGE;
   emitChange();
 };
 
@@ -211,7 +254,11 @@ onMounted(() => {
 
 <template>
   <div class="flex flex-col flex-wrap w-full gap-3 md:flex-row">
-    <WootDatePicker @date-range-changed="onDateRangeChange" />
+    <WootDatePicker
+      v-model:date-range="customDateRange"
+      v-model:range-type="selectedDateRange"
+      @date-range-changed="onDateRangeChange"
+    />
 
     <div
       class="flex flex-col flex-wrap items-start gap-2 md:items-center md:flex-nowrap md:flex-row"

app/javascript/dashboard/routes/dashboard/settings/reports/components/FilterSelector.vue

@@ -1,228 +0,0 @@
-<script>
-import WootDateRangePicker from 'dashboard/components/ui/DateRangePicker.vue';
-import ReportsFiltersDateRange from './Filters/DateRange.vue';
-import ReportsFiltersDateGroupBy from './Filters/DateGroupBy.vue';
-import ReportsFiltersAgents from './Filters/Agents.vue';
-import ReportsFiltersLabels from './Filters/Labels.vue';
-import ReportsFiltersInboxes from './Filters/Inboxes.vue';
-import ReportsFiltersTeams from './Filters/Teams.vue';
-import ReportsFiltersRatings from './Filters/Ratings.vue';
-import subDays from 'date-fns/subDays';
-import { DATE_RANGE_OPTIONS } from '../constants';
-import { getUnixStartOfDay, getUnixEndOfDay } from 'helpers/DateHelper';
-import ToggleSwitch from 'dashboard/components-next/switch/Switch.vue';
-
-export default {
-  components: {
-    WootDateRangePicker,
-    ReportsFiltersDateRange,
-    ReportsFiltersDateGroupBy,
-    ReportsFiltersAgents,
-    ReportsFiltersLabels,
-    ReportsFiltersInboxes,
-    ReportsFiltersTeams,
-    ReportsFiltersRatings,
-    ToggleSwitch,
-  },
-  props: {
-    showGroupByFilter: {
-      type: Boolean,
-      default: false,
-    },
-    showAgentsFilter: {
-      type: Boolean,
-      default: false,
-    },
-    showLabelsFilter: {
-      type: Boolean,
-      default: false,
-    },
-    showInboxFilter: {
-      type: Boolean,
-      default: false,
-    },
-    showRatingFilter: {
-      type: Boolean,
-      default: false,
-    },
-    showTeamFilter: {
-      type: Boolean,
-      default: false,
-    },
-    showBusinessHoursSwitch: {
-      type: Boolean,
-      default: true,
-    },
-  },
-  emits: ['filterChange'],
-  data() {
-    return {
-      // default value, need not be translated
-      selectedDateRange: DATE_RANGE_OPTIONS.LAST_7_DAYS,
-      selectedGroupByFilter: null,
-      selectedLabel: null,
-      selectedInbox: null,
-      selectedTeam: null,
-      selectedRating: null,
-      selectedAgents: [],
-      customDateRange: [new Date(), new Date()],
-      businessHoursSelected: false,
-    };
-  },
-  computed: {
-    isDateRangeSelected() {
-      return (
-        this.selectedDateRange.id === DATE_RANGE_OPTIONS.CUSTOM_DATE_RANGE.id
-      );
-    },
-    isGroupByPossible() {
-      return this.selectedDateRange.id !== DATE_RANGE_OPTIONS.LAST_7_DAYS.id;
-    },
-    to() {
-      if (this.isDateRangeSelected) {
-        return getUnixEndOfDay(this.customDateRange[1]);
-      }
-      return getUnixEndOfDay(new Date());
-    },
-    from() {
-      if (this.isDateRangeSelected) {
-        return getUnixStartOfDay(this.customDateRange[0]);
-      }
-
-      const { offset } = this.selectedDateRange;
-      const fromDate = subDays(new Date(), offset);
-      return getUnixStartOfDay(fromDate);
-    },
-    validGroupOptions() {
-      return this.selectedDateRange.groupByOptions;
-    },
-    validGroupBy() {
-      if (!this.selectedGroupByFilter) {
-        return this.validGroupOptions[0];
-      }
-
-      const validIds = this.validGroupOptions.map(opt => opt.id);
-      if (validIds.includes(this.selectedGroupByFilter.id)) {
-        return this.selectedGroupByFilter;
-      }
-      return this.validGroupOptions[0];
-    },
-  },
-  mounted() {
-    this.emitChange();
-  },
-  methods: {
-    emitChange() {
-      const {
-        from,
-        to,
-        selectedGroupByFilter: groupBy,
-        businessHoursSelected: businessHours,
-        selectedAgents,
-        selectedLabel,
-        selectedInbox,
-        selectedTeam,
-        selectedRating,
-      } = this;
-      this.$emit('filterChange', {
-        from,
-        to,
-        groupBy,
-        businessHours,
-        selectedAgents,
-        selectedLabel,
-        selectedInbox,
-        selectedTeam,
-        selectedRating,
-      });
-    },
-    onDateRangeChange(selectedRange) {
-      this.selectedDateRange = selectedRange;
-      this.selectedGroupByFilter = this.validGroupBy;
-      this.emitChange();
-    },
-    onCustomDateRangeChange(value) {
-      this.customDateRange = value;
-      this.selectedGroupByFilter = this.validGroupBy;
-      this.emitChange();
-    },
-    onGroupingChange(payload) {
-      this.selectedGroupByFilter = payload;
-      this.emitChange();
-    },
-    handleAgentsFilterSelection(selectedAgents) {
-      this.selectedAgents = selectedAgents;
-      this.emitChange();
-    },
-    handleLabelsFilterSelection(selectedLabel) {
-      this.selectedLabel = selectedLabel;
-      this.emitChange();
-    },
-    handleInboxFilterSelection(selectedInbox) {
-      this.selectedInbox = selectedInbox;
-      this.emitChange();
-    },
-    handleTeamFilterSelection(selectedTeam) {
-      this.selectedTeam = selectedTeam;
-      this.emitChange();
-    },
-    handleRatingFilterSelection(selectedRating) {
-      this.selectedRating = selectedRating;
-      this.emitChange();
-    },
-  },
-};
-</script>
-
-<template>
-  <div class="flex flex-col justify-between gap-3 md:flex-row">
-    <div
-      class="w-full grid gap-y-2 gap-x-1.5 grid-cols-[repeat(auto-fill,minmax(250px,1fr))]"
-    >
-      <ReportsFiltersDateRange @on-range-change="onDateRangeChange" />
-      <WootDateRangePicker
-        v-if="isDateRangeSelected"
-        show-range
-        class="no-margin auto-width"
-        :value="customDateRange"
-        :confirm-text="$t('REPORT.CUSTOM_DATE_RANGE.CONFIRM')"
-        :placeholder="$t('REPORT.CUSTOM_DATE_RANGE.PLACEHOLDER')"
-        @change="onCustomDateRangeChange"
-      />
-      <ReportsFiltersDateGroupBy
-        v-if="showGroupByFilter && isGroupByPossible"
-        :valid-group-options="validGroupOptions"
-        :selected-option="selectedGroupByFilter"
-        @on-grouping-change="onGroupingChange"
-      />
-      <ReportsFiltersAgents
-        v-if="showAgentsFilter"
-        @agents-filter-selection="handleAgentsFilterSelection"
-      />
-      <ReportsFiltersLabels
-        v-if="showLabelsFilter"
-        @labels-filter-selection="handleLabelsFilterSelection"
-      />
-      <ReportsFiltersTeams
-        v-if="showTeamFilter"
-        @team-filter-selection="handleTeamFilterSelection"
-      />
-      <ReportsFiltersInboxes
-        v-if="showInboxFilter"
-        @inbox-filter-selection="handleInboxFilterSelection"
-      />
-      <ReportsFiltersRatings
-        v-if="showRatingFilter"
-        @rating-filter-selection="handleRatingFilterSelection"
-      />
-    </div>
-    <div v-if="showBusinessHoursSwitch" class="flex items-center">
-      <span class="mx-2 text-sm whitespace-nowrap">
-        {{ $t('REPORT.BUSINESS_HOURS') }}
-      </span>
-      <span>
-        <ToggleSwitch v-model="businessHoursSelected" @change="emitChange" />
-      </span>
-    </div>
-  </div>
-</template>

app/javascript/dashboard/routes/dashboard/settings/reports/components/Filters/Agents.vue

@@ -1,47 +0,0 @@
-<script>
-import { mapGetters } from 'vuex';
-
-export default {
-  name: 'ReportsFiltersAgents',
-  emits: ['agentsFilterSelection'],
-  data() {
-    return {
-      selectedOptions: [],
-    };
-  },
-  computed: {
-    ...mapGetters({
-      options: 'agents/getAgents',
-    }),
-  },
-  mounted() {
-    this.$store.dispatch('agents/get');
-  },
-  methods: {
-    handleInput() {
-      this.$emit('agentsFilterSelection', this.selectedOptions);
-    },
-  },
-};
-</script>
-
-<template>
-  <div class="multiselect-wrap--small">
-    <multiselect
-      v-model="selectedOptions"
-      class="no-margin"
-      :options="options"
-      track-by="id"
-      label="name"
-      multiple
-      :close-on-select="false"
-      :clear-on-select="false"
-      hide-selected
-      :placeholder="$t('CSAT_REPORTS.FILTERS.AGENTS.PLACEHOLDER')"
-      selected-label
-      :select-label="$t('FORMS.MULTISELECT.ENTER_TO_SELECT')"
-      :deselect-label="$t('FORMS.MULTISELECT.ENTER_TO_REMOVE')"
-      @update:model-value="handleInput"
-    />
-  </div>
-</template>

app/javascript/dashboard/routes/dashboard/settings/reports/components/Filters/DateGroupBy.vue

@@ -1,66 +0,0 @@
-<script>
-import { GROUP_BY_OPTIONS } from '../../constants';
-
-export default {
-  name: 'ReportsFiltersDateGroupBy',
-  props: {
-    validGroupOptions: {
-      type: Array,
-      default: () => [GROUP_BY_OPTIONS.DAY],
-    },
-    selectedOption: {
-      type: Object,
-      default: () => GROUP_BY_OPTIONS.DAY,
-    },
-  },
-  emits: ['onGroupingChange'],
-  data() {
-    return {
-      currentSelectedFilter: null,
-    };
-  },
-  computed: {
-    translatedOptions() {
-      return this.validGroupOptions.map(option => ({
-        ...option,
-        groupBy: this.$t(option.translationKey),
-      }));
-    },
-  },
-  watch: {
-    selectedOption: {
-      handler() {
-        this.currentSelectedFilter = {
-          ...this.selectedOption,
-          groupBy: this.$t(this.selectedOption.translationKey),
-        };
-      },
-      immediate: true,
-    },
-  },
-  methods: {
-    changeFilterSelection(selectedFilter) {
-      this.groupByOptions = this.$emit('onGroupingChange', selectedFilter);
-    },
-  },
-};
-</script>
-
-<template>
-  <div class="multiselect-wrap--small">
-    <p aria-hidden="true" class="hidden">
-      {{ $t('REPORT.GROUP_BY_FILTER_DROPDOWN_LABEL') }}
-    </p>
-    <multiselect
-      v-model="currentSelectedFilter"
-      class="no-margin"
-      track-by="id"
-      label="groupBy"
-      :placeholder="$t('REPORT.GROUP_BY_FILTER_DROPDOWN_LABEL')"
-      :options="translatedOptions"
-      :allow-empty="false"
-      :show-labels="false"
-      @select="changeFilterSelection"
-    />
-  </div>
-</template>

app/javascript/dashboard/routes/dashboard/settings/reports/components/Filters/DateRange.vue

@@ -1,51 +0,0 @@
-<script setup>
-import { ref, computed } from 'vue';
-import { useI18n } from 'vue-i18n';
-import { DATE_RANGE_OPTIONS } from '../../constants';
-
-const emit = defineEmits(['onRangeChange']);
-
-const { t } = useI18n();
-
-const options = computed(() =>
-  Object.values(DATE_RANGE_OPTIONS).map(option => ({
-    ...option,
-    name: t(option.translationKey),
-  }))
-);
-
-const selectedId = ref(Object.values(DATE_RANGE_OPTIONS)[0].id);
-
-const selectedOption = computed({
-  get() {
-    return options.value.find(o => o.id === selectedId.value);
-  },
-  set(val) {
-    selectedId.value = val.id;
-  },
-});
-
-const updateRange = range => {
-  selectedOption.value = range;
-  emit('onRangeChange', range);
-};
-</script>
-
-<template>
-  <div class="multiselect-wrap--small">
-    <multiselect
-      v-model="selectedOption"
-      class="no-margin"
-      track-by="id"
-      label="name"
-      :placeholder="$t('FORMS.MULTISELECT.SELECT_ONE')"
-      selected-label
-      :select-label="$t('FORMS.MULTISELECT.ENTER_TO_SELECT')"
-      deselect-label=""
-      :options="options"
-      :searchable="false"
-      :allow-empty="false"
-      @select="updateRange"
-    />
-  </div>
-</template>

app/javascript/dashboard/routes/dashboard/settings/reports/components/Filters/Inboxes.vue

@@ -1,42 +0,0 @@
-<script>
-import { mapGetters } from 'vuex';
-
-export default {
-  name: 'ReportsFiltersInboxes',
-  emits: ['inboxFilterSelection'],
-  data() {
-    return {
-      selectedOption: null,
-    };
-  },
-  computed: {
-    ...mapGetters({
-      options: 'inboxes/getInboxes',
-    }),
-  },
-  mounted() {
-    this.$store.dispatch('inboxes/get');
-  },
-  methods: {
-    handleInput() {
-      this.$emit('inboxFilterSelection', this.selectedOption);
-    },
-  },
-};
-</script>
-
-<template>
-  <div class="multiselect-wrap--small">
-    <multiselect
-      v-model="selectedOption"
-      class="no-margin"
-      :placeholder="$t('INBOX_REPORTS.FILTER_DROPDOWN_LABEL')"
-      label="name"
-      track-by="id"
-      :options="options"
-      :option-height="24"
-      :show-labels="false"
-      @update:model-value="handleInput"
-    />
-  </div>
-</template>

app/javascript/dashboard/routes/dashboard/settings/reports/components/Filters/Labels.vue

@@ -1,66 +0,0 @@
-<script>
-import { mapGetters } from 'vuex';
-
-export default {
-  name: 'ReportsFiltersLabels',
-  emits: ['labelsFilterSelection'],
-  data() {
-    return {
-      selectedOption: null,
-    };
-  },
-  computed: {
-    ...mapGetters({
-      options: 'labels/getLabels',
-    }),
-  },
-  mounted() {
-    this.$store.dispatch('labels/get');
-  },
-  methods: {
-    handleInput() {
-      this.$emit('labelsFilterSelection', this.selectedOption);
-    },
-  },
-};
-</script>
-
-<template>
-  <div class="multiselect-wrap--small">
-    <multiselect
-      v-model="selectedOption"
-      class="no-margin"
-      :placeholder="$t('LABEL_REPORTS.FILTER_DROPDOWN_LABEL')"
-      label="title"
-      track-by="id"
-      :options="options"
-      :option-height="24"
-      :show-labels="false"
-      @update:model-value="handleInput"
-    >
-      <template #singleLabel="props">
-        <div class="flex items-center min-w-0 gap-2">
-          <div
-            :style="{ backgroundColor: props.option.color }"
-            class="w-5 h-5 rounded-full"
-          />
-          <span class="my-0 text-n-slate-12">
-            {{ props.option.title }}
-          </span>
-        </div>
-      </template>
-      <template #option="props">
-        <div class="flex items-center gap-2">
-          <div
-            :style="{ backgroundColor: props.option.color }"
-            class="flex-shrink-0 w-5 h-5 border border-solid rounded-full border-n-weak"
-          />
-
-          <span class="my-0 text-n-slate-12 truncate min-w-0">
-            {{ props.option.title }}
-          </span>
-        </div>
-      </template>
-    </multiselect>
-  </div>
-</template>

app/javascript/dashboard/routes/dashboard/settings/reports/components/Filters/Ratings.vue

@@ -1,40 +0,0 @@
-<script>
-import { CSAT_RATINGS } from 'shared/constants/messages';
-
-export default {
-  name: 'ReportFiltersRatings',
-  emits: ['ratingFilterSelection'],
-  data() {
-    const translatedOptions = CSAT_RATINGS.reverse().map(option => ({
-      ...option,
-      label: this.$t(option.translationKey),
-    }));
-
-    return {
-      selectedOption: null,
-      options: translatedOptions,
-    };
-  },
-  methods: {
-    handleInput(selectedRating) {
-      this.$emit('ratingFilterSelection', selectedRating);
-    },
-  },
-};
-</script>
-
-<template>
-  <div class="multiselect-wrap--small">
-    <multiselect
-      v-model="selectedOption"
-      class="no-margin"
-      :option-height="24"
-      :placeholder="$t('FORMS.MULTISELECT.SELECT_ONE')"
-      :options="options"
-      :show-labels="false"
-      track-by="value"
-      label="label"
-      @update:model-value="handleInput"
-    />
-  </div>
-</template>

app/javascript/dashboard/routes/dashboard/settings/reports/components/Filters/Teams.vue

@@ -1,42 +0,0 @@
-<script>
-import { mapGetters } from 'vuex';
-
-export default {
-  name: 'ReportsFiltersTeams',
-  emits: ['teamFilterSelection'],
-  data() {
-    return {
-      selectedOption: null,
-    };
-  },
-  computed: {
-    ...mapGetters({
-      options: 'teams/getTeams',
-    }),
-  },
-  mounted() {
-    this.$store.dispatch('teams/get');
-  },
-  methods: {
-    handleInput() {
-      this.$emit('teamFilterSelection', this.selectedOption);
-    },
-  },
-};
-</script>
-
-<template>
-  <div class="multiselect-wrap--small">
-    <multiselect
-      v-model="selectedOption"
-      class="no-margin"
-      :placeholder="$t('TEAM_REPORTS.FILTER_DROPDOWN_LABEL')"
-      label="name"
-      track-by="id"
-      :options="options"
-      :option-height="24"
-      :show-labels="false"
-      @update:model-value="handleInput"
-    />
-  </div>
-</template>

app/javascript/dashboard/routes/dashboard/settings/reports/components/Filters/v3/ActiveFilterChip.vue

@@ -8,8 +8,8 @@ const props = defineProps({
     required: true,
   },
   id: {
-    type: Number,
-    required: true,
+    type: [Number, null],
+    default: null,
   },
   type: {
     type: String,
@@ -35,6 +35,10 @@ const props = defineProps({
     type: Boolean,
     default: false,
   },
+  showClearFilter: {
+    type: Boolean,
+    default: true,
+  },
 });
 
 const emit = defineEmits([
@@ -60,7 +64,7 @@ const closeDropdown = () => emit('closeDropdown');
       <FilterListDropdown
         v-if="options"
         v-on-clickaway="closeDropdown"
-        show-clear-filter
+        :show-clear-filter="showClearFilter"
         :list-items="options"
         :active-filter-id="id"
         :input-placeholder="placeholder"

app/javascript/dashboard/routes/dashboard/settings/reports/components/OverviewReportFilters.vue

@@ -0,0 +1,102 @@
+<script setup>
+import { ref, onMounted } from 'vue';
+import { useRoute, useRouter } from 'vue-router';
+import { getUnixStartOfDay, getUnixEndOfDay } from 'helpers/DateHelper';
+import subDays from 'date-fns/subDays';
+import WootDatePicker from 'dashboard/components/ui/DatePicker/DatePicker.vue';
+import ToggleSwitch from 'dashboard/components-next/switch/Switch.vue';
+import {
+  generateReportURLParams,
+  parseReportURLParams,
+} from '../helpers/reportFilterHelper';
+import { DATE_RANGE_TYPES } from 'dashboard/components/ui/DatePicker/helpers/DatePickerHelper';
+
+const emit = defineEmits(['filterChange']);
+
+const route = useRoute();
+const router = useRouter();
+
+const customDateRange = ref([subDays(new Date(), 6), new Date()]);
+const selectedDateRange = ref(DATE_RANGE_TYPES.LAST_7_DAYS);
+const businessHoursSelected = ref(false);
+
+const updateURLParams = () => {
+  const params = generateReportURLParams({
+    from: getUnixStartOfDay(customDateRange.value[0]),
+    to: getUnixEndOfDay(customDateRange.value[1]),
+    businessHours: businessHoursSelected.value,
+    range: selectedDateRange.value,
+  });
+
+  router.replace({ query: { ...params } });
+};
+
+const emitChange = () => {
+  updateURLParams();
+  emit('filterChange', {
+    from: getUnixStartOfDay(customDateRange.value[0]),
+    to: getUnixEndOfDay(customDateRange.value[1]),
+    businessHours: businessHoursSelected.value,
+  });
+};
+
+const onDateRangeChange = value => {
+  const [startDate, endDate, rangeType] = value;
+  customDateRange.value = [startDate, endDate];
+  selectedDateRange.value = rangeType || DATE_RANGE_TYPES.CUSTOM_RANGE;
+  emitChange();
+};
+
+const onBusinessHoursToggle = () => {
+  emitChange();
+};
+
+const initializeFromURL = () => {
+  const urlParams = parseReportURLParams(route.query);
+
+  // Set the range type first
+  if (urlParams.range) {
+    selectedDateRange.value = urlParams.range;
+  }
+
+  // Restore dates from URL if available
+  if (urlParams.from && urlParams.to) {
+    customDateRange.value = [
+      new Date(urlParams.from * 1000),
+      new Date(urlParams.to * 1000),
+    ];
+  }
+
+  if (urlParams.businessHours) {
+    businessHoursSelected.value = urlParams.businessHours;
+  }
+};
+
+onMounted(() => {
+  initializeFromURL();
+  emitChange();
+});
+</script>
+
+<template>
+  <div class="flex flex-col justify-between gap-3 md:flex-row">
+    <div class="flex flex-col flex-wrap items-start gap-2 md:flex-row">
+      <WootDatePicker
+        v-model:date-range="customDateRange"
+        v-model:range-type="selectedDateRange"
+        @date-range-changed="onDateRangeChange"
+      />
+    </div>
+    <div class="flex items-center">
+      <span class="mx-2 text-sm whitespace-nowrap">
+        {{ $t('REPORT.BUSINESS_HOURS') }}
+      </span>
+      <span>
+        <ToggleSwitch
+          v-model="businessHoursSelected"
+          @change="onBusinessHoursToggle"
+        />
+      </span>
+    </div>
+  </div>
+</template>

app/javascript/dashboard/routes/dashboard/settings/reports/components/ReportFilters.vue

@@ -1,349 +1,382 @@
-<script>
-import endOfDay from 'date-fns/endOfDay';
-import getUnixTime from 'date-fns/getUnixTime';
-import startOfDay from 'date-fns/startOfDay';
+<script setup>
+import { ref, computed, onMounted } from 'vue';
+import { useI18n } from 'vue-i18n';
+import { useStore } from 'vuex';
+import { useRoute, useRouter } from 'vue-router';
+import { getUnixStartOfDay, getUnixEndOfDay } from 'helpers/DateHelper';
 import subDays from 'date-fns/subDays';
-import Avatar from 'next/avatar/Avatar.vue';
-import WootDateRangePicker from 'dashboard/components/ui/DateRangePicker.vue';
+import differenceInDays from 'date-fns/differenceInDays';
+import ActiveFilterChip from './Filters/v3/ActiveFilterChip.vue';
+import WootDatePicker from 'dashboard/components/ui/DatePicker/DatePicker.vue';
 import ToggleSwitch from 'dashboard/components-next/switch/Switch.vue';
-
 import { GROUP_BY_FILTER } from '../constants';
-const CUSTOM_DATE_RANGE_ID = 5;
+import { DATE_RANGE_TYPES } from 'dashboard/components/ui/DatePicker/helpers/DatePickerHelper';
+import {
+  generateReportURLParams,
+  parseReportURLParams,
+} from '../helpers/reportFilterHelper';
 
-export default {
-  components: {
-    WootDateRangePicker,
-    Avatar,
-    ToggleSwitch,
+const props = defineProps({
+  filterType: {
+    type: String,
+    required: false,
+    default: '',
+    validator: value =>
+      ['teams', 'inboxes', 'labels', 'agents', ''].includes(value),
   },
-  props: {
-    currentFilter: {
-      type: Object,
-      default: () => null,
-    },
-    filterItemsList: {
-      type: Array,
-      default: () => [],
-    },
-    groupByFilterItemsList: {
-      type: Array,
-      default: () => [],
-    },
-    type: {
-      type: String,
-      default: 'agent',
-    },
-    selectedGroupByFilter: {
-      type: Object,
-      default: () => {},
-    },
+  selectedItem: {
+    type: Object,
+    default: null,
   },
-  emits: [
-    'businessHoursToggle',
-    'dateRangeChange',
-    'filterChange',
-    'groupByFilterChange',
-  ],
-  data() {
-    return {
-      currentSelectedFilter: this.currentFilter || null,
-      currentDateRangeSelection: {
-        id: 0,
-        name: this.$t('REPORT.DATE_RANGE_OPTIONS.LAST_7_DAYS'),
-      },
-      customDateRange: [new Date(), new Date()],
-      currentSelectedGroupByFilter: null,
-      businessHoursSelected: false,
-    };
+  showGroupBy: {
+    type: Boolean,
+    default: true,
   },
-  computed: {
-    dateRange() {
-      return [
-        { id: 0, name: this.$t('REPORT.DATE_RANGE_OPTIONS.LAST_7_DAYS') },
-        { id: 1, name: this.$t('REPORT.DATE_RANGE_OPTIONS.LAST_30_DAYS') },
-        { id: 2, name: this.$t('REPORT.DATE_RANGE_OPTIONS.LAST_3_MONTHS') },
-        { id: 3, name: this.$t('REPORT.DATE_RANGE_OPTIONS.LAST_6_MONTHS') },
-        { id: 4, name: this.$t('REPORT.DATE_RANGE_OPTIONS.LAST_YEAR') },
-        { id: 5, name: this.$t('REPORT.DATE_RANGE_OPTIONS.CUSTOM_DATE_RANGE') },
-      ];
-    },
-    isDateRangeSelected() {
-      return this.currentDateRangeSelection.id === CUSTOM_DATE_RANGE_ID;
-    },
-    to() {
-      if (this.isDateRangeSelected) {
-        return this.toCustomDate(this.customDateRange[1]);
-      }
-      return this.toCustomDate(new Date());
-    },
-    from() {
-      if (this.isDateRangeSelected) {
-        return this.fromCustomDate(this.customDateRange[0]);
-      }
-      const dateRange = {
-        0: 6,
-        1: 29,
-        2: 89,
-        3: 179,
-        4: 364,
-      };
-      const diff = dateRange[this.currentDateRangeSelection.id];
-      const fromDate = subDays(new Date(), diff);
-      return this.fromCustomDate(fromDate);
-    },
-    multiselectLabel() {
-      const typeLabels = {
-        agent: this.$t('AGENT_REPORTS.FILTER_DROPDOWN_LABEL'),
-        label: this.$t('LABEL_REPORTS.FILTER_DROPDOWN_LABEL'),
-        inbox: this.$t('INBOX_REPORTS.FILTER_DROPDOWN_LABEL'),
-        team: this.$t('TEAM_REPORTS.FILTER_DROPDOWN_LABEL'),
-      };
-      return typeLabels[this.type] || this.$t('FORMS.MULTISELECT.SELECT_ONE');
-    },
-    groupBy() {
-      if (this.isDateRangeSelected) {
-        return GROUP_BY_FILTER[4].period;
-      }
-      const groupRange = {
-        0: GROUP_BY_FILTER[1].period,
-        1: GROUP_BY_FILTER[2].period,
-        2: GROUP_BY_FILTER[3].period,
-        3: GROUP_BY_FILTER[3].period,
-        4: GROUP_BY_FILTER[4].period,
-      };
-      return groupRange[this.currentDateRangeSelection.id];
-    },
-    notLast7Days() {
-      return this.groupBy !== GROUP_BY_FILTER[1].period;
-    },
+  showBusinessHours: {
+    type: Boolean,
+    default: true,
   },
-  watch: {
-    filterItemsList(val) {
-      this.currentSelectedFilter = !this.currentFilter
-        ? val[0]
-        : this.currentFilter;
-      this.changeFilterSelection();
-    },
-    groupByFilterItemsList() {
-      this.currentSelectedGroupByFilter = this.selectedGroupByFilter;
-    },
-  },
-  mounted() {
-    this.onDateRangeChange();
-  },
-  methods: {
-    onDateRangeChange() {
-      this.$emit('dateRangeChange', {
-        from: this.from,
-        to: this.to,
-        groupBy: this.groupBy,
-      });
-    },
-    onBusinessHoursToggle() {
-      this.$emit('businessHoursToggle', this.businessHoursSelected);
-    },
-    fromCustomDate(date) {
-      return getUnixTime(startOfDay(date));
-    },
-    toCustomDate(date) {
-      return getUnixTime(endOfDay(date));
-    },
-    changeDateSelection(selectedRange) {
-      this.currentDateRangeSelection = selectedRange;
-      this.onDateRangeChange();
-    },
-    changeFilterSelection() {
-      this.$emit('filterChange', this.currentSelectedFilter);
-    },
-    onChange(value) {
-      this.customDateRange = value;
-      this.onDateRangeChange();
-    },
-    changeGroupByFilterSelection() {
-      this.$emit('groupByFilterChange', this.currentSelectedGroupByFilter);
-    },
+  showEntityFilter: {
+    type: Boolean,
+    default: true,
   },
+});
+
+const emit = defineEmits(['filterChange']);
+
+const { t } = useI18n();
+const store = useStore();
+const route = useRoute();
+const router = useRouter();
+
+const buildReportFilterList = (items, type) => {
+  if (!Array.isArray(items)) return [];
+
+  return items.map(item => ({
+    id: item.id,
+    name: item.name || item.title,
+    type,
+  }));
 };
+
+const getReportFilterKey = filterType => {
+  const keyMap = {
+    teams: 'team_id',
+    inboxes: 'inbox_id',
+    labels: 'label_id',
+    agents: 'agent_id',
+  };
+  return keyMap[filterType] || '';
+};
+
+const getFilterKey = () => getReportFilterKey(props.filterType);
+
+const showSubDropdownMenu = ref(false);
+const showGroupByDropdown = ref(false);
+const activeFilterType = ref('');
+const customDateRange = ref([subDays(new Date(), 6), new Date()]);
+const selectedDateRange = ref(DATE_RANGE_TYPES.LAST_7_DAYS);
+const businessHoursSelected = ref(false);
+const groupBy = ref(GROUP_BY_FILTER[1]);
+const groupByfilterItemsList = ref([{ id: 1, name: 'Day' }]);
+
+const appliedFilters = ref(
+  props.showEntityFilter
+    ? { [getFilterKey()]: props.selectedItem?.id || null }
+    : {}
+);
+
+const filterSource = computed(() => {
+  const sources = {
+    teams: store.getters['teams/getTeams'],
+    inboxes: store.getters['inboxes/getInboxes'],
+    labels: store.getters['labels/getLabels'],
+    agents: store.getters['agents/getAgents'],
+  };
+  return sources[props.filterType] || [];
+});
+
+const from = computed(() => getUnixStartOfDay(customDateRange.value[0]));
+const to = computed(() => getUnixEndOfDay(customDateRange.value[1]));
+
+const daysDifference = computed(() => {
+  return differenceInDays(customDateRange.value[1], customDateRange.value[0]);
+});
+
+const isGroupByPossible = computed(() => {
+  return props.showGroupBy && daysDifference.value >= 29;
+});
+
+const GROUP_BY_OPTIONS = computed(() => ({
+  WEEK: [
+    { id: 1, name: t('REPORT.GROUPING_OPTIONS.DAY') },
+    { id: 2, name: t('REPORT.GROUPING_OPTIONS.WEEK') },
+  ],
+  MONTH: [
+    { id: 1, name: t('REPORT.GROUPING_OPTIONS.DAY') },
+    { id: 2, name: t('REPORT.GROUPING_OPTIONS.WEEK') },
+    { id: 3, name: t('REPORT.GROUPING_OPTIONS.MONTH') },
+  ],
+  YEAR: [
+    { id: 2, name: t('REPORT.GROUPING_OPTIONS.WEEK') },
+    { id: 3, name: t('REPORT.GROUPING_OPTIONS.MONTH') },
+    { id: 4, name: t('REPORT.GROUPING_OPTIONS.YEAR') },
+  ],
+}));
+
+const fetchFilterItems = () => {
+  const days = daysDifference.value;
+  if (days >= 364) return GROUP_BY_OPTIONS.value.YEAR;
+  if (days >= 90) return GROUP_BY_OPTIONS.value.MONTH;
+  if (days >= 29) return GROUP_BY_OPTIONS.value.WEEK;
+  return GROUP_BY_OPTIONS.value.WEEK;
+};
+
+const filterOptions = computed(() =>
+  buildReportFilterList(filterSource.value, props.filterType)
+);
+
+const filterPlaceholder = computed(() => {
+  const placeholders = {
+    teams: 'TEAM_REPORTS.FILTERS.INPUT_PLACEHOLDER.TEAMS',
+    inboxes: 'INBOX_REPORTS.FILTERS.INPUT_PLACEHOLDER.INBOXES',
+    labels: 'LABEL_REPORTS.FILTERS.INPUT_PLACEHOLDER.LABELS',
+    agents: 'AGENT_REPORTS.FILTERS.INPUT_PLACEHOLDER.AGENTS',
+  };
+  return t(placeholders[props.filterType] || '');
+});
+
+const defaultFilterLabel = computed(() => {
+  const labelKeys = {
+    teams: 'TEAM_REPORTS.FILTER_DROPDOWN_LABEL',
+    inboxes: 'INBOX_REPORTS.FILTER_DROPDOWN_LABEL',
+    labels: 'LABEL_REPORTS.FILTER_DROPDOWN_LABEL',
+    agents: 'AGENT_REPORTS.FILTER_DROPDOWN_LABEL',
+  };
+  return t(labelKeys[props.filterType] || 'FORMS.MULTISELECT.SELECT_ONE');
+});
+
+const selectedFilterName = computed(() => {
+  const filterKey = getFilterKey();
+  const selectedId = appliedFilters.value[filterKey];
+
+  if (!selectedId) {
+    return defaultFilterLabel.value;
+  }
+
+  const selectedItem = filterOptions.value.find(item => item.id === selectedId);
+  return selectedItem?.name || defaultFilterLabel.value;
+});
+
+const updateURLParams = () => {
+  const params = generateReportURLParams({
+    from: from.value,
+    to: to.value,
+    businessHours: businessHoursSelected.value,
+    groupBy: isGroupByPossible.value ? groupBy.value.id : null,
+    range: selectedDateRange.value,
+  });
+
+  router.replace({ query: { ...params } });
+};
+
+const emitChange = () => {
+  const payload = {
+    from: from.value,
+    to: to.value,
+    businessHours: businessHoursSelected.value,
+  };
+
+  if (props.showGroupBy) {
+    // Always emit groupBy, default to day when range is too short
+    payload.groupBy = isGroupByPossible.value
+      ? groupBy.value
+      : GROUP_BY_FILTER[1];
+  }
+
+  if (props.showEntityFilter) {
+    const filterKey = getFilterKey();
+    const selectedValue = appliedFilters.value[filterKey];
+
+    if (selectedValue) {
+      payload[props.filterType] =
+        props.filterType === 'agents'
+          ? [{ id: selectedValue }]
+          : { id: selectedValue };
+    }
+  }
+
+  updateURLParams();
+  emit('filterChange', payload);
+};
+
+const closeActiveFilterDropdown = () => {
+  showSubDropdownMenu.value = false;
+  activeFilterType.value = '';
+};
+
+const openActiveFilterDropdown = filterType => {
+  showGroupByDropdown.value = false;
+  activeFilterType.value = filterType;
+  showSubDropdownMenu.value = !showSubDropdownMenu.value;
+};
+
+const addFilter = item => {
+  const filterKey = getFilterKey();
+  appliedFilters.value[filterKey] = item.id;
+  closeActiveFilterDropdown();
+  emitChange();
+
+  // Navigate to the new entity's route
+  const routeNameMap = {
+    teams: 'team_reports_show',
+    inboxes: 'inbox_reports_show',
+    labels: 'label_reports_show',
+    agents: 'agent_reports_show',
+  };
+
+  const routeName = routeNameMap[props.filterType];
+  if (routeName) {
+    router.push({
+      name: routeName,
+      params: { ...route.params, id: item.id },
+      query: route.query,
+    });
+  }
+};
+
+const onDateRangeChange = value => {
+  const [startDate, endDate, rangeType] = value;
+  customDateRange.value = [startDate, endDate];
+  selectedDateRange.value = rangeType || DATE_RANGE_TYPES.CUSTOM_RANGE;
+  groupByfilterItemsList.value = fetchFilterItems();
+  const filterItems = groupByfilterItemsList.value.filter(
+    item => item.id === groupBy.value.id
+  );
+  if (filterItems.length === 0) {
+    groupBy.value = GROUP_BY_FILTER[groupByfilterItemsList.value[0].id];
+  }
+  emitChange();
+};
+
+const onBusinessHoursToggle = () => {
+  emitChange();
+};
+
+const onGroupByFilterChange = payload => {
+  groupBy.value = GROUP_BY_FILTER[payload.id];
+  showGroupByDropdown.value = false;
+  emitChange();
+};
+
+const toggleGroupByDropdown = () => {
+  showGroupByDropdown.value = !showGroupByDropdown.value;
+};
+
+const closeGroupByDropdown = () => {
+  showGroupByDropdown.value = false;
+};
+
+const initializeFromURL = () => {
+  const urlParams = parseReportURLParams(route.query);
+
+  // Set the range type first
+  if (urlParams.range) {
+    selectedDateRange.value = urlParams.range;
+  }
+
+  // Restore dates from URL if available
+  if (urlParams.from && urlParams.to) {
+    customDateRange.value = [
+      new Date(urlParams.from * 1000),
+      new Date(urlParams.to * 1000),
+    ];
+  }
+
+  if (urlParams.businessHours) {
+    businessHoursSelected.value = urlParams.businessHours;
+  }
+
+  if (urlParams.groupBy) {
+    const groupByValue = GROUP_BY_FILTER[urlParams.groupBy];
+    if (groupByValue) {
+      groupBy.value = groupByValue;
+    }
+  }
+
+  // Initialize entity filter from route params (not URL query)
+  if (props.showEntityFilter && route.params.id) {
+    const filterKey = getFilterKey();
+    appliedFilters.value[filterKey] = Number(route.params.id);
+  }
+};
+
+onMounted(() => {
+  initializeFromURL();
+  groupByfilterItemsList.value = fetchFilterItems();
+  emitChange();
+});
 </script>
 
 <template>
-  <div class="grid grid-cols-1 md:grid-cols-3 gap-y-0.5 gap-x-2">
-    <div v-if="type === 'agent'" class="multiselect-wrap--small">
-      <p class="mb-2 text-xs font-medium">
-        {{ $t('AGENT_REPORTS.FILTER_DROPDOWN_LABEL') }}
-      </p>
-      <multiselect
-        v-model="currentSelectedFilter"
-        :placeholder="multiselectLabel"
-        label="name"
-        track-by="id"
-        :options="filterItemsList"
-        :option-height="24"
-        :show-labels="false"
-        @update:model-value="changeFilterSelection"
-      >
-        <template #singleLabel="props">
-          <div class="flex min-w-0 items-center gap-2">
-            <Avatar
-              :src="props.option.thumbnail"
-              :status="props.option.availability_status"
-              :name="props.option.name"
-              :size="22"
-              hide-offline-status
-              rounded-full
-            />
-            <span class="my-0 text-n-slate-12 truncate">{{
-              props.option.name
-            }}</span>
-          </div>
-        </template>
-        <template #options="props">
-          <div class="flex items-center gap-2">
-            <Avatar
-              :src="props.option.thumbnail"
-              :status="props.option.availability_status"
-              :name="props.option.name"
-              :size="22"
-              hide-offline-status
-              rounded-full
-            />
-            <p class="my-0 text-n-slate-12">
-              {{ props.option.name }}
-            </p>
-          </div>
-        </template>
-      </multiselect>
-    </div>
+  <div class="flex flex-col w-full gap-3 lg:flex-row">
+    <WootDatePicker
+      v-model:date-range="customDateRange"
+      v-model:range-type="selectedDateRange"
+      @date-range-changed="onDateRangeChange"
+    />
 
-    <div v-else-if="type === 'label'" class="multiselect-wrap--small">
-      <p class="mb-2 text-xs font-medium">
-        {{ $t('LABEL_REPORTS.FILTER_DROPDOWN_LABEL') }}
-      </p>
-      <multiselect
-        v-model="currentSelectedFilter"
-        :placeholder="multiselectLabel"
-        label="title"
-        track-by="id"
-        :options="filterItemsList"
-        :option-height="24"
-        :show-labels="false"
-        @update:model-value="changeFilterSelection"
-      >
-        <template #singleLabel="props">
-          <div class="flex items-center min-w-0 gap-2">
-            <div
-              :style="{ backgroundColor: props.option.color }"
-              class="w-5 h-5 rounded-full"
-            />
-
-            <span class="my-0 text-n-slate-12 truncate">
-              {{ props.option.title }}
-            </span>
-          </div>
-        </template>
-        <template #option="props">
-          <div class="flex items-center min-w-0 gap-2">
-            <div
-              :style="{ backgroundColor: props.option.color }"
-              class="flex-shrink-0 w-5 h-5 border border-solid rounded-full border-n-weak"
-            />
-
-            <span class="my-0 text-n-slate-12 truncate">
-              {{ props.option.title }}
-            </span>
-          </div>
-        </template>
-      </multiselect>
-    </div>
-
-    <div v-else class="multiselect-wrap--small">
-      <p class="mb-2 text-xs font-medium">
-        <template v-if="type === 'inbox'">
-          {{ $t('INBOX_REPORTS.FILTER_DROPDOWN_LABEL') }}
-        </template>
-        <template v-else-if="type === 'team'">
-          {{ $t('TEAM_REPORTS.FILTER_DROPDOWN_LABEL') }}
-        </template>
-        <template v-else>
-          {{ $t('FORMS.MULTISELECT.SELECT_ONE') }}
-        </template>
-      </p>
-      <multiselect
-        v-model="currentSelectedFilter"
-        track-by="id"
-        label="name"
-        :placeholder="multiselectLabel"
-        selected-label
-        :select-label="$t('FORMS.MULTISELECT.ENTER_TO_SELECT')"
-        deselect-label=""
-        :options="filterItemsList"
-        :searchable="false"
-        :allow-empty="false"
-        @update:model-value="changeFilterSelection"
+    <div class="flex gap-2 items-center w-full">
+      <ActiveFilterChip
+        v-if="showEntityFilter"
+        :id="appliedFilters[getFilterKey()]"
+        :name="selectedFilterName"
+        :type="filterType"
+        :options="filterOptions"
+        :active-filter-type="activeFilterType"
+        :show-menu="showSubDropdownMenu"
+        :placeholder="filterPlaceholder"
+        :show-clear-filter="false"
+        enable-search
+        @toggle-dropdown="openActiveFilterDropdown"
+        @close-dropdown="closeActiveFilterDropdown"
+        @add-filter="addFilter"
       />
-    </div>
 
-    <div class="multiselect-wrap--small">
-      <p class="mb-2 text-xs font-medium">
-        {{ $t('REPORT.DURATION_FILTER_LABEL') }}
-      </p>
-      <multiselect
-        v-model="currentDateRangeSelection"
-        track-by="name"
-        label="name"
-        :placeholder="$t('FORMS.MULTISELECT.SELECT_ONE')"
-        selected-label
-        :select-label="$t('FORMS.MULTISELECT.ENTER_TO_SELECT')"
-        deselect-label=""
-        :options="dateRange"
-        :searchable="false"
-        :allow-empty="false"
-        @select="changeDateSelection"
-      />
-    </div>
-
-    <div
-      class="flex items-center h-10 self-center order-5 md:order-2 md:justify-self-end"
-    >
-      <span class="mr-2 text-sm whitespace-nowrap">
-        {{ $t('REPORT.BUSINESS_HOURS') }}
-      </span>
-      <span>
-        <ToggleSwitch
-          v-model="businessHoursSelected"
-          @change="onBusinessHoursToggle"
-        />
-      </span>
-    </div>
-
-    <div v-if="isDateRangeSelected" class="order-3 md:order-4">
-      <p class="mb-2 text-xs font-medium">
-        {{ $t('REPORT.CUSTOM_DATE_RANGE.PLACEHOLDER') }}
-      </p>
-      <WootDateRangePicker
-        show-range
-        :value="customDateRange"
-        :confirm-text="$t('REPORT.CUSTOM_DATE_RANGE.CONFIRM')"
-        :placeholder="$t('REPORT.CUSTOM_DATE_RANGE.PLACEHOLDER')"
-        class="auto-width"
-        @change="onChange"
-      />
-    </div>
-
-    <div v-if="notLast7Days" class="multiselect-wrap--small order-4 md:order-5">
-      <p class="mb-2 text-xs font-medium">
-        {{ $t('REPORT.GROUP_BY_FILTER_DROPDOWN_LABEL') }}
-      </p>
-      <multiselect
-        v-model="currentSelectedGroupByFilter"
-        track-by="id"
-        label="groupBy"
+      <ActiveFilterChip
+        v-if="isGroupByPossible"
+        :id="groupBy?.id"
+        :name="
+          groupByfilterItemsList.find(item => item.id === groupBy?.id)?.name ||
+          $t('REPORT.GROUP_BY_FILTER_DROPDOWN_LABEL')
+        "
+        type="groupBy"
+        :options="groupByfilterItemsList"
+        :active-filter-type="showGroupByDropdown ? 'groupBy' : ''"
+        :show-menu="showGroupByDropdown"
         :placeholder="$t('REPORT.GROUP_BY_FILTER_DROPDOWN_LABEL')"
-        :options="groupByFilterItemsList"
-        :allow-empty="false"
-        :show-labels="false"
-        @update:model-value="changeGroupByFilterSelection"
+        :enable-search="false"
+        :show-clear-filter="false"
+        @toggle-dropdown="toggleGroupByDropdown"
+        @close-dropdown="closeGroupByDropdown"
+        @add-filter="onGroupByFilterChange"
+        @remove-filter="() => {}"
       />
+
+      <div
+        v-if="showBusinessHours"
+        class="flex items-center flex-shrink-0 ltr:ml-auto rtl:mr-auto"
+      >
+        <span class="mx-2 text-sm whitespace-nowrap">
+          {{ $t('REPORT.BUSINESS_HOURS') }}
+        </span>
+        <span>
+          <ToggleSwitch
+            v-model="businessHoursSelected"
+            @change="onBusinessHoursToggle"
+          />
+        </span>
+      </div>
     </div>
   </div>
 </template>

app/javascript/dashboard/routes/dashboard/settings/reports/components/SLA/SLAFilter.vue

@@ -1,155 +1,201 @@
-<script>
-import { mapGetters } from 'vuex';
+<script setup>
+import { ref, computed, onMounted } from 'vue';
+import { useI18n } from 'vue-i18n';
+import { useStore } from 'vuex';
+import { useRoute, useRouter } from 'vue-router';
 import {
   buildFilterList,
   getActiveFilter,
   getFilterType,
 } from './helpers/SLAFilterHelpers';
+import {
+  parseFilterURLParams,
+  generateCompleteURLParams,
+} from '../../helpers/reportFilterHelper';
 import FilterButton from 'dashboard/components/ui/Dropdown/DropdownButton.vue';
 import ActiveFilterChip from '../Filters/v3/ActiveFilterChip.vue';
 import AddFilterChip from '../Filters/v3/AddFilterChip.vue';
 
-export default {
-  components: {
-    FilterButton,
-    ActiveFilterChip,
-    AddFilterChip,
-  },
-  emits: ['filterChange'],
-  data() {
+const emit = defineEmits(['filterChange']);
+
+const { t } = useI18n();
+const store = useStore();
+const route = useRoute();
+const router = useRouter();
+
+const showDropdownMenu = ref(false);
+const showSubDropdownMenu = ref(false);
+const activeFilterType = ref('');
+const appliedFilters = ref({
+  assigned_agent_id: null,
+  inbox_id: null,
+  team_id: null,
+  sla_policy_id: null,
+  label_list: null,
+});
+
+const agents = computed(() => store.getters['agents/getAgents']);
+const inboxes = computed(() => store.getters['inboxes/getInboxes']);
+const teams = computed(() => store.getters['teams/getTeams']);
+const labels = computed(() => store.getters['labels/getLabels']);
+const sla = computed(() => store.getters['sla/getSLA']);
+
+const filterListMenuItems = computed(() => {
+  const filterTypes = [
+    { id: '1', name: t('SLA_REPORTS.DROPDOWN.SLA'), type: 'sla' },
+    { id: '2', name: t('SLA_REPORTS.DROPDOWN.INBOXES'), type: 'inboxes' },
+    { id: '3', name: t('SLA_REPORTS.DROPDOWN.AGENTS'), type: 'agents' },
+    { id: '4', name: t('SLA_REPORTS.DROPDOWN.TEAMS'), type: 'teams' },
+    { id: '5', name: t('SLA_REPORTS.DROPDOWN.LABELS'), type: 'labels' },
+  ];
+
+  const activeFilterKeys = Object.keys(appliedFilters.value).filter(
+    key => appliedFilters.value[key]
+  );
+  const activeFilterTypes = activeFilterKeys.map(key =>
+    getFilterType(key, 'keyToType')
+  );
+
+  const sources = {
+    agents: agents.value,
+    inboxes: inboxes.value,
+    teams: teams.value,
+    labels: labels.value,
+    sla: sla.value,
+  };
+
+  return filterTypes
+    .filter(({ type }) => !activeFilterTypes.includes(type))
+    .map(({ id, name, type }) => ({
+      id,
+      name,
+      type,
+      options: buildFilterList(sources[type], type),
+    }));
+});
+
+const activeFilters = computed(() => {
+  const activeKeys = Object.keys(appliedFilters.value).filter(
+    key => appliedFilters.value[key]
+  );
+
+  const sources = {
+    agents: agents.value,
+    inboxes: inboxes.value,
+    teams: teams.value,
+    labels: labels.value,
+    sla: sla.value,
+  };
+
+  return activeKeys.map(key => {
+    const filterType = getFilterType(key, 'keyToType');
+    const item = getActiveFilter(
+      sources[filterType],
+      filterType,
+      appliedFilters.value[key]
+    );
     return {
-      showDropdownMenu: false,
-      showSubDropdownMenu: false,
-      activeFilterType: '',
-      appliedFilters: {
-        assigned_agent_id: null,
-        inbox_id: null,
-        team_id: null,
-        sla_policy_id: null,
-        label_list: null,
-      },
+      id: item.id,
+      name: filterType === 'labels' ? item.title : item.name,
+      type: filterType,
+      options: buildFilterList(sources[filterType], filterType),
     };
-  },
-  computed: {
-    ...mapGetters({
-      agents: 'agents/getAgents',
-      inboxes: 'inboxes/getInboxes',
-      teams: 'teams/getTeams',
-      labels: 'labels/getLabels',
-      sla: 'sla/getSLA',
-    }),
-    filterListMenuItems() {
-      const filterTypes = [
-        { id: '1', name: this.$t('SLA_REPORTS.DROPDOWN.SLA'), type: 'sla' },
-        {
-          id: '2',
-          name: this.$t('SLA_REPORTS.DROPDOWN.INBOXES'),
-          type: 'inboxes',
-        },
-        {
-          id: '3',
-          name: this.$t('SLA_REPORTS.DROPDOWN.AGENTS'),
-          type: 'agents',
-        },
-        { id: '4', name: this.$t('SLA_REPORTS.DROPDOWN.TEAMS'), type: 'teams' },
-        {
-          id: '5',
-          name: this.$t('SLA_REPORTS.DROPDOWN.LABELS'),
-          type: 'labels',
-        },
-      ];
-      // Filter out the active filters from the filter list
-      // We only want to show the filters that are not already applied
-      // In the add filter dropdown
-      const activeFilters = Object.keys(this.appliedFilters).filter(
-        key => this.appliedFilters[key]
-      );
-      const activeFilterTypes = activeFilters.map(key =>
-        getFilterType(key, 'keyToType')
-      );
-      return filterTypes
-        .filter(({ type }) => !activeFilterTypes.includes(type))
-        .map(({ id, name, type }) => ({
-          id,
-          name,
-          type,
-          options: buildFilterList(this[type], type),
-        }));
+  });
+});
+
+const hasActiveFilters = computed(() =>
+  Object.values(appliedFilters.value).some(value => value !== null)
+);
+
+const isAllFilterSelected = computed(() => !filterListMenuItems.value.length);
+
+const updateURLParams = () => {
+  const params = generateCompleteURLParams({
+    from: route.query.from,
+    to: route.query.to,
+    range: route.query.range,
+    filters: {
+      agent_id: appliedFilters.value.assigned_agent_id,
+      inbox_id: appliedFilters.value.inbox_id,
+      team_id: appliedFilters.value.team_id,
+      sla_policy_id: appliedFilters.value.sla_policy_id,
+      label: appliedFilters.value.label_list,
     },
-    activeFilters() {
-      // Get the active filters from the applied filters
-      // and return the filter name, type and options
-      const activeKey = Object.keys(this.appliedFilters).filter(
-        key => this.appliedFilters[key]
-      );
-      return activeKey.map(key => {
-        const filterType = getFilterType(key, 'keyToType');
-        const item = getActiveFilter(
-          this[filterType],
-          filterType,
-          this.appliedFilters[key]
-        );
-        return {
-          id: item.id,
-          name: filterType === 'labels' ? item.title : item.name,
-          type: filterType,
-          options: buildFilterList(this[filterType], filterType),
-        };
-      });
-    },
-    hasActiveFilters() {
-      return Object.values(this.appliedFilters).some(value => value !== null);
-    },
-    isAllFilterSelected() {
-      return !this.filterListMenuItems.length;
-    },
-  },
-  methods: {
-    addFilter(item) {
-      const { type, id, name } = item;
-      const filterKey = getFilterType(type, 'typeToKey');
-      this.appliedFilters[filterKey] = type === 'labels' ? name : id;
-      this.$emit('filterChange', this.appliedFilters);
-      this.resetDropdown();
-    },
-    removeFilter(type) {
-      const filterKey = getFilterType(type, 'typeToKey');
-      this.appliedFilters[filterKey] = null;
-      this.$emit('filterChange', this.appliedFilters);
-    },
-    clearAllFilters() {
-      this.appliedFilters = {
-        assigned_agent_id: null,
-        inbox_id: null,
-        team_id: null,
-        sla_policy_id: null,
-        label_list: null,
-      };
-      this.$emit('filterChange', this.appliedFilters);
-      this.resetDropdown();
-    },
-    showDropdown() {
-      this.showSubDropdownMenu = false;
-      this.showDropdownMenu = !this.showDropdownMenu;
-    },
-    closeDropdown() {
-      this.showDropdownMenu = false;
-    },
-    openActiveFilterDropdown(filterType) {
-      this.closeDropdown();
-      this.activeFilterType = filterType;
-      this.showSubDropdownMenu = !this.showSubDropdownMenu;
-    },
-    closeActiveFilterDropdown() {
-      this.activeFilterType = '';
-      this.showSubDropdownMenu = false;
-    },
-    resetDropdown() {
-      this.closeDropdown();
-      this.closeActiveFilterDropdown();
-    },
-  },
+  });
+  router.replace({ query: params });
 };
+
+const emitChange = () => {
+  updateURLParams();
+  emit('filterChange', appliedFilters.value);
+};
+
+const showDropdown = () => {
+  showSubDropdownMenu.value = false;
+  showDropdownMenu.value = !showDropdownMenu.value;
+};
+
+const closeDropdown = () => {
+  showDropdownMenu.value = false;
+};
+
+const openActiveFilterDropdown = filterType => {
+  closeDropdown();
+  activeFilterType.value = filterType;
+  showSubDropdownMenu.value = !showSubDropdownMenu.value;
+};
+
+const closeActiveFilterDropdown = () => {
+  activeFilterType.value = '';
+  showSubDropdownMenu.value = false;
+};
+
+const resetDropdown = () => {
+  closeDropdown();
+  closeActiveFilterDropdown();
+};
+
+const addFilter = item => {
+  const { type, id, name } = item;
+  const filterKey = getFilterType(type, 'typeToKey');
+  appliedFilters.value[filterKey] = type === 'labels' ? name : id;
+  emitChange();
+  resetDropdown();
+};
+
+const removeFilter = type => {
+  const filterKey = getFilterType(type, 'typeToKey');
+  appliedFilters.value[filterKey] = null;
+  emitChange();
+};
+
+const clearAllFilters = () => {
+  appliedFilters.value = {
+    assigned_agent_id: null,
+    inbox_id: null,
+    team_id: null,
+    sla_policy_id: null,
+    label_list: null,
+  };
+  emitChange();
+  resetDropdown();
+};
+
+const initializeFromURL = () => {
+  const urlFilters = parseFilterURLParams(route.query);
+  appliedFilters.value.assigned_agent_id = urlFilters.agent_id;
+  appliedFilters.value.inbox_id = urlFilters.inbox_id;
+  appliedFilters.value.team_id = urlFilters.team_id;
+  appliedFilters.value.sla_policy_id = urlFilters.sla_policy_id;
+  appliedFilters.value.label_list = urlFilters.label;
+};
+
+onMounted(() => {
+  initializeFromURL();
+  if (hasActiveFilters.value) {
+    emitChange();
+  }
+});
 </script>
 
 <template>

app/javascript/dashboard/routes/dashboard/settings/reports/components/SLA/SLAReportFilters.vue

@@ -1,73 +1,98 @@
-<script>
+<script setup>
+import { ref, computed, onMounted } from 'vue';
+import { useRoute, useRouter } from 'vue-router';
 import SLAFilter from '../SLA/SLAFilter.vue';
-import subDays from 'date-fns/subDays';
-import { DATE_RANGE_OPTIONS } from '../../constants';
+import WootDatePicker from 'dashboard/components/ui/DatePicker/DatePicker.vue';
+import { subDays, fromUnixTime } from 'date-fns';
 import { getUnixStartOfDay, getUnixEndOfDay } from 'helpers/DateHelper';
+import {
+  generateReportURLParams,
+  parseReportURLParams,
+  parseFilterURLParams,
+} from '../../helpers/reportFilterHelper';
 
-export default {
-  components: {
-    SLAFilter,
-  },
-  emits: ['filterChange'],
+const emit = defineEmits(['filterChange']);
 
-  data() {
-    return {
-      selectedDateRange: DATE_RANGE_OPTIONS.LAST_7_DAYS,
-      selectedGroupByFilter: null,
-      customDateRange: [new Date(), new Date()],
-    };
-  },
-  computed: {
-    to() {
-      return getUnixEndOfDay(this.customDateRange[1]);
-    },
-    from() {
-      return getUnixStartOfDay(this.customDateRange[0]);
-    },
-  },
-  watch: {
-    businessHoursSelected() {
-      this.emitChange();
-    },
-  },
-  mounted() {
-    this.setInitialRange();
-  },
-  methods: {
-    setInitialRange() {
-      const { offset } = this.selectedDateRange;
-      const fromDate = subDays(new Date(), offset);
-      const from = getUnixStartOfDay(fromDate);
-      const to = getUnixEndOfDay(new Date());
-      this.$emit('filterChange', {
-        from,
-        to,
-        ...this.selectedGroupByFilter,
-      });
-    },
-    emitChange() {
-      const { from, to } = this;
-      this.$emit('filterChange', {
-        from,
-        to,
-        ...this.selectedGroupByFilter,
-      });
-    },
-    emitFilterChange(params) {
-      this.selectedGroupByFilter = params;
-      this.emitChange();
-    },
-    onDateRangeChange(value) {
-      this.customDateRange = value;
-      this.emitChange();
-    },
-  },
+const route = useRoute();
+const router = useRouter();
+
+// Initialize from URL params immediately
+const urlParams = parseReportURLParams(route.query);
+const initialDateRange =
+  urlParams.from && urlParams.to
+    ? [fromUnixTime(urlParams.from), fromUnixTime(urlParams.to)]
+    : [subDays(new Date(), 6), new Date()];
+
+const selectedDateRange = ref(urlParams.range || 'last7days');
+const selectedGroupByFilter = ref(null);
+const customDateRange = ref(initialDateRange);
+
+const to = computed(() => getUnixEndOfDay(customDateRange.value[1]));
+const from = computed(() => getUnixStartOfDay(customDateRange.value[0]));
+
+const updateURLParams = () => {
+  const dateParams = generateReportURLParams({
+    from: from.value,
+    to: to.value,
+    range: selectedDateRange.value,
+  });
+
+  const filterParams = parseFilterURLParams(route.query);
+  const params = { ...dateParams };
+
+  if (filterParams.agent_id) params.agent_id = filterParams.agent_id;
+  if (filterParams.inbox_id) params.inbox_id = filterParams.inbox_id;
+  if (filterParams.team_id) params.team_id = filterParams.team_id;
+  if (filterParams.sla_policy_id)
+    params.sla_policy_id = filterParams.sla_policy_id;
+  if (filterParams.label) params.label = filterParams.label;
+
+  router.replace({ query: params });
 };
+
+const emitChange = () => {
+  updateURLParams();
+  emit('filterChange', {
+    from: from.value,
+    to: to.value,
+    ...selectedGroupByFilter.value,
+  });
+};
+
+const emitFilterChange = params => {
+  selectedGroupByFilter.value = params;
+  emit('filterChange', {
+    from: from.value,
+    to: to.value,
+    ...selectedGroupByFilter.value,
+  });
+};
+
+const onDateRangeChange = ([startDate, endDate, rangeType]) => {
+  customDateRange.value = [startDate, endDate];
+  selectedDateRange.value = rangeType;
+  emitChange();
+};
+
+const setInitialRange = () => {
+  customDateRange.value = [subDays(new Date(), 6), new Date()];
+  emitChange();
+};
+
+onMounted(() => {
+  if (!route.query.from || !route.query.to) {
+    setInitialRange();
+  }
+});
 </script>
 
 <template>
   <div class="flex flex-col flex-wrap w-full gap-3 md:flex-row">
-    <woot-date-picker @date-range-changed="onDateRangeChange" />
+    <WootDatePicker
+      v-model:date-range="customDateRange"
+      v-model:range-type="selectedDateRange"
+      @date-range-changed="onDateRangeChange"
+    />
     <SLAFilter @filter-change="emitFilterChange" />
   </div>
 </template>

app/javascript/dashboard/routes/dashboard/settings/reports/components/SummaryReports.vue

@@ -1,5 +1,5 @@
 <script setup>
-import ReportFilterSelector from './FilterSelector.vue';
+import OverviewReportFilters from './OverviewReportFilters.vue';
 import { formatTime } from '@chatwoot/utils';
 import { useStore, useMapGetter } from 'dashboard/composables/store';
 import Table from 'dashboard/components/table/Table.vue';
@@ -178,7 +178,7 @@ defineExpose({ downloadReports });
 </script>
 
 <template>
-  <ReportFilterSelector @filter-change="onFilterChange" />
+  <OverviewReportFilters @filter-change="onFilterChange" />
   <div
     class="flex-1 overflow-auto px-2 py-2 mt-5 shadow outline-1 outline outline-n-container rounded-xl bg-n-solid-2"
   >

app/javascript/dashboard/routes/dashboard/settings/reports/components/WootReports.vue

@@ -1,31 +1,12 @@
 <script>
 import V4Button from 'dashboard/components-next/button/Button.vue';
-import { useAlert, useTrack } from 'dashboard/composables';
+import { useAlert } from 'dashboard/composables';
 import ReportFilters from './ReportFilters.vue';
 import ReportContainer from '../ReportContainer.vue';
 import { GROUP_BY_FILTER } from '../constants';
 import { generateFileName } from '../../../../../helper/downloadHelper';
-import { REPORTS_EVENTS } from '../../../../../helper/AnalyticsHelper/events';
 import ReportHeader from './ReportHeader.vue';
 
-const GROUP_BY_OPTIONS = {
-  DAY: [{ id: 1, groupByKey: 'REPORT.GROUPING_OPTIONS.DAY' }],
-  WEEK: [
-    { id: 1, groupByKey: 'REPORT.GROUPING_OPTIONS.DAY' },
-    { id: 2, groupByKey: 'REPORT.GROUPING_OPTIONS.WEEK' },
-  ],
-  MONTH: [
-    { id: 1, groupByKey: 'REPORT.GROUPING_OPTIONS.DAY' },
-    { id: 2, groupByKey: 'REPORT.GROUPING_OPTIONS.WEEK' },
-    { id: 3, groupByKey: 'REPORT.GROUPING_OPTIONS.MONTH' },
-  ],
-  YEAR: [
-    { id: 2, groupByKey: 'REPORT.GROUPING_OPTIONS.WEEK' },
-    { id: 3, groupByKey: 'REPORT.GROUPING_OPTIONS.MONTH' },
-    { id: 4, groupByKey: 'REPORT.GROUPING_OPTIONS.YEAR' },
-  ],
-};
-
 export default {
   components: {
     ReportHeader,
@@ -69,12 +50,19 @@ export default {
       to: 0,
       selectedFilter: this.selectedItem,
       groupBy: GROUP_BY_FILTER[1],
-      groupByfilterItemsList: GROUP_BY_OPTIONS.DAY.map(this.translateOptions),
-      selectedGroupByFilter: null,
       businessHours: false,
     };
   },
   computed: {
+    filterType() {
+      const pluralMap = {
+        agent: 'agents',
+        team: 'teams',
+        inbox: 'inboxes',
+        label: 'labels',
+      };
+      return pluralMap[this.type] || this.type;
+    },
     filterItemsList() {
       return this.$store.getters[this.getterKey] || [];
     },
@@ -145,69 +133,29 @@ export default {
         this.$store.dispatch(dispatchMethods[type], params);
       }
     },
-    onDateRangeChange({ from, to, groupBy }) {
-      // do not track filter change on inital load
-      if (this.from !== 0 && this.to !== 0) {
-        useTrack(REPORTS_EVENTS.FILTER_REPORT, {
-          filterType: 'date',
-          reportType: this.type,
-        });
-      }
-
+    onFilterChange(payload) {
+      const { from, to, businessHours, groupBy } = payload;
       this.from = from;
       this.to = to;
-      this.groupByfilterItemsList = this.fetchFilterItems(groupBy);
-      const filterItems = this.groupByfilterItemsList.filter(
-        item => item.id === this.groupBy.id
-      );
-      if (filterItems.length > 0) {
-        this.selectedGroupByFilter = filterItems[0];
+      this.businessHours = businessHours;
+
+      if (groupBy) {
+        this.groupBy = groupBy;
       } else {
-        this.selectedGroupByFilter = this.groupByfilterItemsList[0];
-        this.groupBy = GROUP_BY_FILTER[this.selectedGroupByFilter.id];
+        this.groupBy = GROUP_BY_FILTER[1];
       }
-      this.fetchAllData();
-    },
-    onFilterChange(payload) {
-      if (payload) {
-        this.selectedFilter = payload;
-        this.fetchAllData();
-      }
-    },
-    onGroupByFilterChange(payload) {
-      this.groupBy = GROUP_BY_FILTER[payload.id];
-      this.fetchAllData();
 
-      useTrack(REPORTS_EVENTS.FILTER_REPORT, {
-        filterType: 'groupBy',
-        filterValue: this.groupBy?.period,
-        reportType: this.type,
-      });
-    },
-    fetchFilterItems(groupBy) {
-      switch (groupBy) {
-        case GROUP_BY_FILTER[2].period:
-          return GROUP_BY_OPTIONS.WEEK.map(this.translateOptions);
-        case GROUP_BY_FILTER[3].period:
-          return GROUP_BY_OPTIONS.MONTH.map(this.translateOptions);
-        case GROUP_BY_FILTER[4].period:
-          return GROUP_BY_OPTIONS.YEAR.map(this.translateOptions);
-        default:
-          return GROUP_BY_OPTIONS.DAY.map(this.translateOptions);
+      // Get filter value directly from filterType key
+      const filterValue = payload[this.filterType];
+      if (filterValue) {
+        this.selectedFilter = Array.isArray(filterValue)
+          ? filterValue[0]
+          : filterValue;
+      } else {
+        this.selectedFilter = null;
       }
-    },
-    translateOptions(opts) {
-      return { id: opts.id, groupBy: this.$t(opts.groupByKey) };
-    },
-    onBusinessHoursToggle(value) {
-      this.businessHours = value;
-      this.fetchAllData();
 
-      useTrack(REPORTS_EVENTS.FILTER_REPORT, {
-        filterType: 'businessHours',
-        filterValue: value,
-        reportType: this.type,
-      });
+      this.fetchAllData();
     },
   },
 };
@@ -222,17 +170,12 @@ export default {
       @click="downloadReports"
     />
   </ReportHeader>
+
   <ReportFilters
     v-if="filterItemsList"
-    :type="type"
-    :filter-items-list="filterItemsList"
-    :group-by-filter-items-list="groupByfilterItemsList"
-    :selected-group-by-filter="selectedGroupByFilter"
-    :current-filter="selectedFilter"
-    @date-range-change="onDateRangeChange"
+    :filter-type="filterType"
+    :selected-item="selectedFilter"
     @filter-change="onFilterChange"
-    @group-by-filter-change="onGroupByFilterChange"
-    @business-hours-toggle="onBusinessHoursToggle"
   />
   <ReportContainer
     v-if="filterItemsList.length"

app/javascript/dashboard/routes/dashboard/settings/reports/components/specs/Filters/FiltersAgents.spec.js

@@ -1,57 +0,0 @@
-import { shallowMount } from '@vue/test-utils';
-import { createStore } from 'vuex';
-import ReportsFiltersAgents from '../../Filters/Agents.vue';
-
-const mockStore = createStore({
-  modules: {
-    agents: {
-      namespaced: true,
-      state: {
-        agents: [],
-      },
-      getters: {
-        getAgents: state => state.agents,
-      },
-      actions: {
-        get: vi.fn(),
-      },
-    },
-  },
-});
-
-const mountParams = {
-  global: {
-    plugins: [mockStore],
-    mocks: {
-      $t: msg => msg,
-    },
-    stubs: ['multiselect'],
-  },
-};
-
-describe('ReportsFiltersAgents.vue', () => {
-  it('emits "agents-filter-selection" event when handleInput is called', async () => {
-    const wrapper = shallowMount(ReportsFiltersAgents, mountParams);
-
-    const selectedAgents = [
-      { id: 1, name: 'Agent 1' },
-      { id: 2, name: 'Agent 2' },
-    ];
-    await wrapper.setData({ selectedOptions: selectedAgents });
-
-    await wrapper.vm.handleInput();
-
-    expect(wrapper.emitted('agentsFilterSelection')).toBeTruthy();
-    expect(wrapper.emitted('agentsFilterSelection')[0]).toEqual([
-      selectedAgents,
-    ]);
-  });
-
-  it('dispatches the "agents/get" action when the component is mounted', () => {
-    const dispatchSpy = vi.spyOn(mockStore, 'dispatch');
-
-    shallowMount(ReportsFiltersAgents, mountParams);
-
-    expect(dispatchSpy).toHaveBeenCalledWith('agents/get');
-  });
-});

app/javascript/dashboard/routes/dashboard/settings/reports/components/specs/Filters/FiltersDateGroupBy.spec.js

@@ -1,47 +0,0 @@
-import { shallowMount } from '@vue/test-utils';
-import ReportsFiltersDateGroupBy from '../../Filters/DateGroupBy.vue';
-import { GROUP_BY_OPTIONS } from '../../../constants';
-
-const mountParams = {
-  global: {
-    mocks: {
-      $t: msg => msg,
-    },
-    stubs: ['multiselect'],
-  },
-};
-
-describe('ReportsFiltersDateGroupBy.vue', () => {
-  it('emits "on-grouping-change" event when changeFilterSelection is called', () => {
-    const wrapper = shallowMount(ReportsFiltersDateGroupBy, mountParams);
-
-    const selectedFilter = GROUP_BY_OPTIONS.DAY;
-    wrapper.vm.changeFilterSelection(selectedFilter);
-
-    expect(wrapper.emitted('onGroupingChange')).toBeTruthy();
-    expect(wrapper.emitted('onGroupingChange')[0]).toEqual([selectedFilter]);
-  });
-
-  it('updates currentSelectedFilter when selectedOption is changed', async () => {
-    const wrapper = shallowMount(ReportsFiltersDateGroupBy, mountParams);
-
-    const newSelectedOption = GROUP_BY_OPTIONS.MONTH;
-    await wrapper.setProps({ selectedOption: newSelectedOption });
-
-    expect(wrapper.vm.currentSelectedFilter).toEqual({
-      ...newSelectedOption,
-      groupBy: newSelectedOption.translationKey,
-    });
-  });
-
-  it('initializes translatedOptions correctly', () => {
-    const wrapper = shallowMount(ReportsFiltersDateGroupBy, mountParams);
-
-    const expectedOptions = wrapper.vm.validGroupOptions.map(option => ({
-      ...option,
-      groupBy: option.translationKey,
-    }));
-
-    expect(wrapper.vm.translatedOptions).toEqual(expectedOptions);
-  });
-});

app/javascript/dashboard/routes/dashboard/settings/reports/components/specs/Filters/FiltersDateRange.spec.js

@@ -1,41 +0,0 @@
-import { shallowMount } from '@vue/test-utils';
-import ReportFiltersDateRange from '../../Filters/DateRange.vue';
-import { DATE_RANGE_OPTIONS } from '../../../constants';
-
-const mountParams = {
-  global: {
-    mocks: {
-      $t: msg => msg,
-    },
-    stubs: ['multiselect'],
-  },
-};
-
-describe('ReportFiltersDateRange.vue', () => {
-  it('emits "onRangeChange" event when updateRange is called', () => {
-    const wrapper = shallowMount(ReportFiltersDateRange, mountParams);
-
-    const selectedRange = DATE_RANGE_OPTIONS.LAST_7_DAYS;
-    wrapper.vm.updateRange(selectedRange);
-
-    expect(wrapper.emitted('onRangeChange')).toBeTruthy();
-    expect(wrapper.emitted('onRangeChange')[0]).toEqual([selectedRange]);
-  });
-
-  it('initializes options correctly', () => {
-    const wrapper = shallowMount(ReportFiltersDateRange, mountParams);
-
-    const expectedIds = Object.values(DATE_RANGE_OPTIONS).map(
-      option => option.id
-    );
-    const receivedIds = wrapper.vm.options.map(option => option.id);
-
-    expect(receivedIds).toEqual(expectedIds);
-  });
-
-  it('initializes selectedOption correctly', () => {
-    const wrapper = shallowMount(ReportFiltersDateRange, mountParams);
-    const expectedId = Object.values(DATE_RANGE_OPTIONS)[0].id;
-    expect(wrapper.vm.selectedOption.id).toBe(expectedId);
-  });
-});

app/javascript/dashboard/routes/dashboard/settings/reports/components/specs/Filters/FiltersInboxes.spec.js

@@ -1,65 +0,0 @@
-import { shallowMount } from '@vue/test-utils';
-import { createStore } from 'vuex';
-import ReportsFiltersInboxes from '../../Filters/Inboxes.vue';
-
-const mountParams = {
-  global: {
-    mocks: {
-      $t: msg => msg,
-    },
-    stubs: ['multiselect'],
-  },
-};
-
-describe('ReportsFiltersInboxes.vue', () => {
-  let store;
-  let inboxesModule;
-
-  beforeEach(() => {
-    inboxesModule = {
-      namespaced: true,
-      getters: {
-        getInboxes: () => () => [
-          { id: 1, name: 'Inbox 1' },
-          { id: 2, name: 'Inbox 2' },
-        ],
-      },
-      actions: {
-        get: vi.fn(),
-      },
-    };
-
-    store = createStore({
-      modules: {
-        inboxes: inboxesModule,
-      },
-    });
-  });
-
-  it('dispatches "inboxes/get" action when component is mounted', () => {
-    shallowMount(ReportsFiltersInboxes, {
-      global: {
-        plugins: [store],
-        ...mountParams.global,
-      },
-    });
-    expect(inboxesModule.actions.get).toHaveBeenCalled();
-  });
-
-  it('emits "inbox-filter-selection" event when handleInput is called', async () => {
-    const wrapper = shallowMount(ReportsFiltersInboxes, {
-      global: {
-        plugins: [store],
-        ...mountParams.global,
-      },
-    });
-
-    const selectedInbox = { id: 1, name: 'Inbox 1' };
-    await wrapper.setData({ selectedOption: selectedInbox });
-
-    await wrapper.vm.handleInput();
-
-    expect(wrapper.emitted('inboxFilterSelection')).toBeTruthy();
-    expect(wrapper.emitted('inboxFilterSelection')[0]).toEqual([selectedInbox]);
-  });
-});

app/javascript/dashboard/routes/dashboard/settings/reports/components/specs/Filters/FiltersLabels.spec.js

@@ -1,67 +0,0 @@
-import { shallowMount } from '@vue/test-utils';
-import { createStore } from 'vuex';
-import ReportsFiltersLabels from '../../Filters/Labels.vue';
-
-const mountParams = {
-  global: {
-    mocks: {
-      $t: msg => msg,
-    },
-    stubs: ['multiselect'],
-  },
-};
-
-describe('ReportsFiltersLabels.vue', () => {
-  let store;
-  let labelsModule;
-
-  beforeEach(() => {
-    labelsModule = {
-      namespaced: true,
-      getters: {
-        getLabels: () => () => [
-          { id: 1, title: 'Label 1', color: 'red' },
-          { id: 2, title: 'Label 2', color: 'blue' },
-        ],
-      },
-      actions: {
-        get: vi.fn(),
-      },
-    };
-
-    store = createStore({
-      modules: {
-        labels: labelsModule,
-      },
-    });
-  });
-
-  it('dispatches "labels/get" action when component is mounted', () => {
-    shallowMount(ReportsFiltersLabels, {
-      global: {
-        plugins: [store],
-        ...mountParams.global,
-      },
-    });
-    expect(labelsModule.actions.get).toHaveBeenCalled();
-  });
-
-  it('emits "labels-filter-selection" event when handleInput is called', async () => {
-    const wrapper = shallowMount(ReportsFiltersLabels, {
-      global: {
-        plugins: [store],
-        ...mountParams.global,
-      },
-    });
-
-    const selectedLabel = { id: 1, title: 'Label 1', color: 'red' };
-    await wrapper.setData({ selectedOption: selectedLabel });
-
-    await wrapper.vm.handleInput();
-
-    expect(wrapper.emitted('labelsFilterSelection')).toBeTruthy();
-    expect(wrapper.emitted('labelsFilterSelection')[0]).toEqual([
-      selectedLabel,
-    ]);
-  });
-});

app/javascript/dashboard/routes/dashboard/settings/reports/components/specs/Filters/FiltersRatings.spec.js

@@ -1,43 +0,0 @@
-import { shallowMount } from '@vue/test-utils';
-import ReportFiltersRatings from '../../Filters/Ratings.vue';
-import { CSAT_RATINGS } from 'shared/constants/messages';
-
-const mountParams = {
-  global: {
-    mocks: {
-      $t: msg => msg,
-    },
-    stubs: ['multiselect'],
-  },
-};
-
-describe('ReportFiltersRatings.vue', () => {
-  it('emits "rating-filter-selection" event when handleInput is called', async () => {
-    const wrapper = shallowMount(ReportFiltersRatings, {
-      ...mountParams,
-    });
-
-    const selectedRating = { value: 1, label: 'Rating 1' };
-    await wrapper.setData({ selectedOption: selectedRating });
-
-    await wrapper.vm.handleInput(selectedRating);
-
-    expect(wrapper.emitted('ratingFilterSelection')).toBeTruthy();
-    expect(wrapper.emitted('ratingFilterSelection')[0]).toEqual([
-      selectedRating,
-    ]);
-  });
-
-  it('initializes options correctly', () => {
-    const wrapper = shallowMount(ReportFiltersRatings, {
-      ...mountParams,
-    });
-
-    const expectedOptions = CSAT_RATINGS.map(option => ({
-      ...option,
-      label: option.translationKey,
-    }));
-
-    expect(wrapper.vm.options).toEqual(expectedOptions);
-  });
-});

app/javascript/dashboard/routes/dashboard/settings/reports/components/specs/Filters/FiltersTeams.spec.js

@@ -1,65 +0,0 @@
-import { shallowMount } from '@vue/test-utils';
-import { createStore } from 'vuex';
-import ReportsFiltersTeams from '../../Filters/Teams.vue';
-
-const mountParams = {
-  global: {
-    mocks: {
-      $t: msg => msg,
-    },
-    stubs: ['multiselect'],
-  },
-};
-
-describe('ReportsFiltersTeams.vue', () => {
-  let store;
-  let teamsModule;
-
-  beforeEach(() => {
-    teamsModule = {
-      namespaced: true,
-      getters: {
-        getTeams: () => () => [
-          { id: 1, name: 'Team 1' },
-          { id: 2, name: 'Team 2' },
-        ],
-      },
-      actions: {
-        get: vi.fn(),
-      },
-    };
-
-    store = createStore({
-      modules: {
-        teams: teamsModule,
-      },
-    });
-  });
-
-  it('dispatches "teams/get" action when component is mounted', () => {
-    shallowMount(ReportsFiltersTeams, {
-      global: {
-        plugins: [store],
-        ...mountParams,
-      },
-    });
-    expect(teamsModule.actions.get).toHaveBeenCalled();
-  });
-
-  it('emits "team-filter-selection" event when handleInput is called', async () => {
-    const wrapper = shallowMount(ReportsFiltersTeams, {
-      global: {
-        plugins: [store],
-        ...mountParams,
-      },
-    });
-
-    await wrapper.setData({ selectedOption: { id: 1, name: 'Team 1' } });
-    await wrapper.vm.handleInput();
-
-    expect(wrapper.emitted('teamFilterSelection')).toBeTruthy();
-    expect(wrapper.emitted('teamFilterSelection')[0]).toEqual([
-      { id: 1, name: 'Team 1' },
-    ]);
-  });
-});

app/javascript/dashboard/routes/dashboard/settings/reports/helpers/reportFilterHelper.js

@@ -0,0 +1,69 @@
+export const generateReportURLParams = ({
+  from,
+  to,
+  businessHours,
+  groupBy,
+  range,
+}) => {
+  const params = {};
+
+  // Always include from/to dates
+  if (from) params.from = from;
+  if (to) params.to = to;
+
+  if (businessHours) params.business_hours = 'true';
+  if (groupBy) params.group_by = groupBy;
+
+  // Include range type (last7days, last3months, custom, etc.)
+  if (range) params.range = range;
+
+  return params;
+};
+
+export const parseReportURLParams = query => {
+  const { from, to, business_hours, group_by, range } = query;
+
+  return {
+    from: from ? Number(from) : null,
+    to: to ? Number(to) : null,
+    businessHours: business_hours === 'true',
+    groupBy: group_by ? Number(group_by) : null,
+    range: range || null,
+  };
+};
+
+// Parse filter params from URL (agent_id, inbox_id, team_id, sla_policy_id, label, rating)
+export const parseFilterURLParams = query => {
+  return {
+    agent_id: query.agent_id ? Number(query.agent_id) : null,
+    inbox_id: query.inbox_id ? Number(query.inbox_id) : null,
+    team_id: query.team_id ? Number(query.team_id) : null,
+    sla_policy_id: query.sla_policy_id ? Number(query.sla_policy_id) : null,
+    label: query.label || null,
+    rating: query.rating ? Number(query.rating) : null,
+  };
+};
+
+// Generate filter URL params (only include non-null values)
+export const generateFilterURLParams = filters => {
+  const params = {};
+  if (filters.agent_id) params.agent_id = filters.agent_id;
+  if (filters.inbox_id) params.inbox_id = filters.inbox_id;
+  if (filters.team_id) params.team_id = filters.team_id;
+  if (filters.sla_policy_id) params.sla_policy_id = filters.sla_policy_id;
+  if (filters.label) params.label = filters.label;
+  if (filters.rating) params.rating = filters.rating;
+  return params;
+};
+
+// Merge date range and filter params for complete URL
+export const generateCompleteURLParams = ({
+  from,
+  to,
+  range,
+  filters = {},
+}) => {
+  const dateParams = generateReportURLParams({ from, to, range });
+  const filterParams = generateFilterURLParams(filters);
+  return { ...dateParams, ...filterParams };
+};

app/javascript/dashboard/routes/dashboard/settings/reports/helpers/reportFilterHelper.spec.js

@@ -0,0 +1,350 @@
+import {
+  generateReportURLParams,
+  parseReportURLParams,
+  parseFilterURLParams,
+  generateFilterURLParams,
+  generateCompleteURLParams,
+} from './reportFilterHelper';
+
+describe('reportFilterHelper', () => {
+  describe('generateReportURLParams', () => {
+    it('generates URL params with from and to dates', () => {
+      const params = generateReportURLParams({
+        from: 1738607400,
+        to: 1770229799,
+      });
+
+      expect(params).toEqual({
+        from: 1738607400,
+        to: 1770229799,
+      });
+    });
+
+    it('includes business hours when true', () => {
+      const params = generateReportURLParams({
+        from: 1738607400,
+        to: 1770229799,
+        businessHours: true,
+      });
+
+      expect(params).toEqual({
+        from: 1738607400,
+        to: 1770229799,
+        business_hours: 'true',
+      });
+    });
+
+    it('excludes business hours when false', () => {
+      const params = generateReportURLParams({
+        from: 1738607400,
+        to: 1770229799,
+        businessHours: false,
+      });
+
+      expect(params).toEqual({
+        from: 1738607400,
+        to: 1770229799,
+      });
+    });
+
+    it('includes group by parameter', () => {
+      const params = generateReportURLParams({
+        from: 1738607400,
+        to: 1770229799,
+        groupBy: 3,
+      });
+
+      expect(params).toEqual({
+        from: 1738607400,
+        to: 1770229799,
+        group_by: 3,
+      });
+    });
+
+    it('includes range type', () => {
+      const params = generateReportURLParams({
+        from: 1738607400,
+        to: 1770229799,
+        range: 'last7days',
+      });
+
+      expect(params).toEqual({
+        from: 1738607400,
+        to: 1770229799,
+        range: 'last7days',
+      });
+    });
+
+    it('generates complete URL params with all options', () => {
+      const params = generateReportURLParams({
+        from: 1738607400,
+        to: 1770229799,
+        businessHours: true,
+        groupBy: 3,
+        range: 'lastYear',
+      });
+
+      expect(params).toEqual({
+        from: 1738607400,
+        to: 1770229799,
+        business_hours: 'true',
+        group_by: 3,
+        range: 'lastYear',
+      });
+    });
+  });
+
+  describe('parseReportURLParams', () => {
+    it('parses from and to dates as numbers', () => {
+      const result = parseReportURLParams({
+        from: '1738607400',
+        to: '1770229799',
+      });
+
+      expect(result).toEqual({
+        from: 1738607400,
+        to: 1770229799,
+        businessHours: false,
+        groupBy: null,
+        range: null,
+      });
+    });
+
+    it('parses business hours as boolean', () => {
+      const result = parseReportURLParams({
+        from: '1738607400',
+        to: '1770229799',
+        business_hours: 'true',
+      });
+
+      expect(result.businessHours).toBe(true);
+    });
+
+    it('returns false for business hours when not "true"', () => {
+      const result = parseReportURLParams({
+        from: '1738607400',
+        to: '1770229799',
+        business_hours: 'false',
+      });
+
+      expect(result.businessHours).toBe(false);
+    });
+
+    it('parses group by as number', () => {
+      const result = parseReportURLParams({
+        from: '1738607400',
+        to: '1770229799',
+        group_by: '3',
+      });
+
+      expect(result.groupBy).toBe(3);
+    });
+
+    it('parses range type', () => {
+      const result = parseReportURLParams({
+        from: '1738607400',
+        to: '1770229799',
+        range: 'last7days',
+      });
+
+      expect(result.range).toBe('last7days');
+    });
+
+    it('returns null for missing parameters', () => {
+      const result = parseReportURLParams({});
+
+      expect(result).toEqual({
+        from: null,
+        to: null,
+        businessHours: false,
+        groupBy: null,
+        range: null,
+      });
+    });
+
+    it('parses complete URL params with all options', () => {
+      const result = parseReportURLParams({
+        from: '1738607400',
+        to: '1770229799',
+        business_hours: 'true',
+        group_by: '3',
+        range: 'lastYear',
+      });
+
+      expect(result).toEqual({
+        from: 1738607400,
+        to: 1770229799,
+        businessHours: true,
+        groupBy: 3,
+        range: 'lastYear',
+      });
+    });
+
+    it('handles numeric values correctly', () => {
+      const result = parseReportURLParams({
+        from: 1738607400,
+        to: 1770229799,
+        group_by: 3,
+      });
+
+      expect(result.from).toBe(1738607400);
+      expect(result.to).toBe(1770229799);
+      expect(result.groupBy).toBe(3);
+    });
+  });
+
+  describe('round-trip conversion', () => {
+    it('maintains data integrity through generate and parse cycle', () => {
+      const original = {
+        from: 1738607400,
+        to: 1770229799,
+        businessHours: true,
+        groupBy: 3,
+        range: 'lastYear',
+      };
+
+      const urlParams = generateReportURLParams(original);
+      const parsed = parseReportURLParams(urlParams);
+
+      expect(parsed.from).toBe(original.from);
+      expect(parsed.to).toBe(original.to);
+      expect(parsed.businessHours).toBe(original.businessHours);
+      expect(parsed.groupBy).toBe(original.groupBy);
+      expect(parsed.range).toBe(original.range);
+    });
+  });
+
+  describe('parseFilterURLParams', () => {
+    it('parses all filter params as numbers', () => {
+      const result = parseFilterURLParams({
+        agent_id: '123',
+        inbox_id: '456',
+        team_id: '789',
+        sla_policy_id: '101',
+        rating: '4',
+      });
+
+      expect(result).toEqual({
+        agent_id: 123,
+        inbox_id: 456,
+        team_id: 789,
+        sla_policy_id: 101,
+        label: null,
+        rating: 4,
+      });
+    });
+
+    it('parses label as string', () => {
+      const result = parseFilterURLParams({
+        label: 'bug',
+      });
+
+      expect(result.label).toBe('bug');
+    });
+
+    it('returns null for missing parameters', () => {
+      const result = parseFilterURLParams({});
+
+      expect(result).toEqual({
+        agent_id: null,
+        inbox_id: null,
+        team_id: null,
+        sla_policy_id: null,
+        label: null,
+        rating: null,
+      });
+    });
+  });
+
+  describe('generateFilterURLParams', () => {
+    it('includes only non-null filter values', () => {
+      const params = generateFilterURLParams({
+        agent_id: 123,
+        inbox_id: null,
+        team_id: 456,
+        rating: null,
+      });
+
+      expect(params).toEqual({
+        agent_id: 123,
+        team_id: 456,
+      });
+    });
+
+    it('includes label when present', () => {
+      const params = generateFilterURLParams({
+        label: 'bug',
+      });
+
+      expect(params).toEqual({
+        label: 'bug',
+      });
+    });
+
+    it('returns empty object when all values are null', () => {
+      const params = generateFilterURLParams({
+        agent_id: null,
+        inbox_id: null,
+        team_id: null,
+      });
+
+      expect(params).toEqual({});
+    });
+  });
+
+  describe('generateCompleteURLParams', () => {
+    it('merges date and filter params', () => {
+      const params = generateCompleteURLParams({
+        from: 1738607400,
+        to: 1770229799,
+        range: 'last7days',
+        filters: {
+          agent_id: 123,
+          inbox_id: 456,
+        },
+      });
+
+      expect(params).toEqual({
+        from: 1738607400,
+        to: 1770229799,
+        range: 'last7days',
+        agent_id: 123,
+        inbox_id: 456,
+      });
+    });
+
+    it('handles empty filters', () => {
+      const params = generateCompleteURLParams({
+        from: 1738607400,
+        to: 1770229799,
+        range: 'last7days',
+        filters: {},
+      });
+
+      expect(params).toEqual({
+        from: 1738607400,
+        to: 1770229799,
+        range: 'last7days',
+      });
+    });
+
+    it('excludes null filter values', () => {
+      const params = generateCompleteURLParams({
+        from: 1738607400,
+        to: 1770229799,
+        filters: {
+          agent_id: 123,
+          inbox_id: null,
+          team_id: 456,
+        },
+      });
+
+      expect(params).toEqual({
+        from: 1738607400,
+        to: 1770229799,
+        agent_id: 123,
+        team_id: 456,
+      });
+    });
+  });
+});

app/javascript/dashboard/store/modules/labels.js

@@ -27,7 +27,7 @@ export const getters = {
       .sort((a, b) => a.title.localeCompare(b.title));
   },
   getLabelById: _state => id => {
-    return _state.records.find(record => record.id === Number(id));
+    return _state.records.find(record => record.id === Number(id)) || {};
   },
 };
 

app/jobs/conversation_reply_email_job.rb

@@ -3,6 +3,7 @@ class ConversationReplyEmailJob < ApplicationJob
 
   def perform(conversation_id, last_queued_id)
     conversation = Conversation.find(conversation_id)
+    return unless conversation.account.active?
 
     if conversation.messages.incoming&.last&.content_type == 'incoming_email'
       ConversationReplyMailer.with(account: conversation.account).reply_without_summary(conversation, last_queued_id).deliver_later

app/jobs/webhooks/tiktok_events_job.rb

@@ -54,7 +54,7 @@ class Webhooks::TiktokEventsJob < MutexApplicationJob
   # Receive real-time notifications if you send a message to a user.
   def im_send_msg
     # This can be either an echo message or a message sent directly via tiktok application
-    ::Tiktok::MessageService.new(channel: channel, content: content).perform
+    ::Tiktok::MessageService.new(channel: channel, content: content, outgoing_echo: true).perform
   end
 
   # Receive real-time notifications if a user outside the European Economic Area (EEA), Switzerland, or the UK sends a message to you.

app/jobs/webhooks/whatsapp_events_job.rb

@@ -9,6 +9,56 @@ class Webhooks::WhatsappEventsJob < ApplicationJob
       return
     end
 
+    if message_echo_event?(params)
+      handle_message_echo(channel, params)
+    else
+      handle_message_events(channel, params)
+    end
+  end
+
+  # Detects if the webhook is an SMB message echo event (message sent from WhatsApp Business app)
+  # This is part of WhatsApp coexistence feature where businesses can respond from both
+  # Chatwoot and the WhatsApp Business app, with messages synced to Chatwoot.
+  #
+  # Regular message payload (field: "messages"):
+  # {
+  #   "entry": [{
+  #     "changes": [{
+  #       "field": "messages",
+  #       "value": {
+  #         "contacts": [{ "wa_id": "919745786257", "profile": { "name": "Customer" } }],
+  #         "messages": [{ "from": "919745786257", "id": "wamid...", "text": { "body": "Hello" } }]
+  #       }
+  #     }]
+  #   }]
+  # }
+  #
+  # Echo message payload (field: "smb_message_echoes"):
+  # {
+  #   "entry": [{
+  #     "changes": [{
+  #       "field": "smb_message_echoes",
+  #       "value": {
+  #         "message_echoes": [{ "from": "971545296927", "to": "919745786257", "id": "wamid...", "text": { "body": "Hi" } }]
+  #       }
+  #     }]
+  #   }]
+  # }
+  #
+  # Key differences:
+  # - field: "smb_message_echoes" instead of "messages"
+  # - message_echoes[] instead of messages[]
+  # - "from" is the business number, "to" is the contact (reversed from regular messages)
+  # - No "contacts" array in echo payload
+  def message_echo_event?(params)
+    params.dig(:entry, 0, :changes, 0, :field) == 'smb_message_echoes'
+  end
+
+  def handle_message_echo(channel, params)
+    Whatsapp::IncomingMessageWhatsappCloudService.new(inbox: channel.inbox, params: params, outgoing_echo: true).perform
+  end
+
+  def handle_message_events(channel, params)
     case channel.provider
     when 'whatsapp_cloud'
       Whatsapp::IncomingMessageWhatsappCloudService.new(inbox: channel.inbox, params: params).perform

app/mailers/conversation_reply_mailer.rb

@@ -38,6 +38,7 @@ class ConversationReplyMailer < ApplicationMailer
     return unless smtp_config_set_or_development?
 
     init_conversation_attributes(message.conversation)
+
     @message = message
     prepare_mail(true)
   end

app/models/account.rb

@@ -29,6 +29,7 @@ class Account < ApplicationRecord
   include Featurable
   include CacheKeys
   include CaptainFeaturable
+  include AccountEmailRateLimitable
 
   SETTINGS_PARAMS_SCHEMA = {
     'type': 'object',

app/models/automation_rule.rb

@@ -41,8 +41,8 @@ class AutomationRule < ApplicationRecord
 
   def actions_attributes
     %w[send_message add_label remove_label send_email_to_team assign_team assign_agent send_webhook_event mute_conversation
-       send_attachment change_status resolve_conversation open_conversation snooze_conversation change_priority send_email_transcript
-       add_private_note].freeze
+       send_attachment change_status resolve_conversation open_conversation pending_conversation snooze_conversation change_priority
+       send_email_transcript add_private_note].freeze
   end
 
   def file_base_data

app/models/concerns/account_email_rate_limitable.rb

@@ -0,0 +1,49 @@
+module AccountEmailRateLimitable
+  extend ActiveSupport::Concern
+
+  OUTBOUND_EMAIL_TTL = 25.hours.to_i
+  EMAIL_LIMIT_CONFIG_KEY = 'ACCOUNT_EMAILS_LIMIT'.freeze
+
+  def email_rate_limit
+    account_limit || global_limit || default_limit
+  end
+
+  def emails_sent_today
+    Redis::Alfred.get(email_count_cache_key).to_i
+  end
+
+  def within_email_rate_limit?
+    return true if emails_sent_today < email_rate_limit
+
+    Rails.logger.warn("Account #{id} reached daily email rate limit of #{email_rate_limit}. Sent: #{emails_sent_today}")
+    false
+  end
+
+  def increment_email_sent_count
+    Redis::Alfred.incr(email_count_cache_key).tap do |count|
+      Redis::Alfred.expire(email_count_cache_key, OUTBOUND_EMAIL_TTL) if count == 1
+    end
+  end
+
+  private
+
+  def email_count_cache_key
+    @email_count_cache_key ||= format(
+      Redis::Alfred::ACCOUNT_OUTBOUND_EMAIL_COUNT_KEY,
+      account_id: id,
+      date: Time.zone.today.to_s
+    )
+  end
+
+  def account_limit
+    self[:limits]&.dig('emails')&.to_i
+  end
+
+  def global_limit
+    GlobalConfig.get(EMAIL_LIMIT_CONFIG_KEY)[EMAIL_LIMIT_CONFIG_KEY]&.to_i
+  end
+
+  def default_limit
+    ChatwootApp.max_limit.to_i
+  end
+end

app/models/message.rb

@@ -344,10 +344,11 @@ class Message < ApplicationRecord
     # if the sender is not a user, it's not a human response
     # if automation rule id is present, it's not a human response
     # if campaign id is present, it's not a human response
+    # external echo messages are responses sent from the native app (WhatsApp Business, Instagram)
     outgoing? &&
       content_attributes['automation_rule_id'].blank? &&
       additional_attributes['campaign_id'].blank? &&
-      sender.is_a?(User)
+      (sender.is_a?(User) || content_attributes['external_echo'].present?)
   end
 
   def bot_response?

app/services/action_service.rb

@@ -22,6 +22,10 @@ class ActionService
     @conversation.open!
   end
 
+  def pending_conversation(_params)
+    @conversation.pending!
+  end
+
   def change_status(status)
     @conversation.update!(status: status[0])
   end

app/services/messages/send_email_notification_service.rb

@@ -13,6 +13,7 @@ class Messages::SendEmailNotificationService
     return unless Redis::Alfred.set(conversation_mail_key, message.id, nx: true, ex: 1.hour.to_i)
 
     ConversationReplyEmailJob.set(wait: 2.minutes).perform_later(conversation.id, message.id)
+    message.account.increment_email_sent_count
   end
 
   private
@@ -20,6 +21,7 @@ class Messages::SendEmailNotificationService
   def should_send_email_notification?
     return false unless message.email_notifiable_message?
     return false if message.conversation.contact.email.blank?
+    return false unless message.account.within_email_rate_limit?
 
     email_reply_enabled?
   end

app/services/notification/email_notification_service.rb

@@ -7,15 +7,22 @@ class Notification::EmailNotificationService
     # don't send emails if user is not confirmed
     return if notification.user.confirmed_at.nil?
     return unless user_subscribed_to_notification?
+    return unless notification.account.within_email_rate_limit?
 
-    # TODO : Clean up whatever happening over here
-    # Segregate the mailers properly
-    AgentNotifications::ConversationNotificationsMailer.with(account: notification.account).public_send(notification
-      .notification_type.to_s, notification.primary_actor, notification.user, notification.secondary_actor).deliver_later
+    send_notification_email
+    notification.account.increment_email_sent_count
   end
 
   private
 
+  # TODO : Clean up whatever happening over here
+  # Segregate the mailers properly
+  def send_notification_email
+    AgentNotifications::ConversationNotificationsMailer.with(account: notification.account).public_send(
+      notification.notification_type.to_s, notification.primary_actor, notification.user, notification.secondary_actor
+    ).deliver_later
+  end
+
   def user_subscribed_to_notification?
     notification_setting = notification.user.notification_settings.find_by(account_id: notification.account.id)
     return true if notification_setting.public_send("email_#{notification.notification_type}?")

app/services/tiktok/message_service.rb

@@ -1,11 +1,10 @@
 class Tiktok::MessageService
   include Tiktok::MessagingHelpers
 
-  pattr_initialize [:channel!, :content!]
+  pattr_initialize [:channel!, :content!, :outgoing_echo]
 
   def perform
     if outgoing_message?
-      # Skip processing echo messages
       message = find_message(tt_conversation_id, tt_message_id)
       return if message.present?
     end
@@ -39,7 +38,7 @@ class Tiktok::MessageService
       updated_at: tt_message_time
     )
 
-    message.sender = contact_inbox.contact if incoming_message?
+    message.sender = contact_inbox.contact if incoming_message? && !outgoing_echo
     message.status = :delivered if outgoing_message?
 
     create_message_attachments(message)
@@ -91,6 +90,7 @@ class Tiktok::MessageService
     attributes = {}
     attributes[:in_reply_to_external_id] = tt_referenced_message_id if tt_referenced_message_id
     attributes[:is_unsupported] = true unless supported_message?
+    attributes[:external_echo] = true if outgoing_echo
     attributes
   end
 

app/services/whatsapp/facebook_api_client.rb

@@ -61,16 +61,36 @@ class Whatsapp::FacebookApiClient
   end
 
   def subscribe_waba_webhook(waba_id, callback_url, verify_token)
+    # Step 1: Subscribe app to WABA first (required before override)
+    # Meta requires the app to be subscribed before using override_callback_uri
+    # See: https://github.com/chatwoot/chatwoot/issues/13097
+    subscribe_app_to_waba(waba_id)
+
+    # Step 2: Override callback URL for this specific WABA
+    override_waba_callback(waba_id, callback_url, verify_token)
+  end
+
+  def subscribe_app_to_waba(waba_id)
+    response = HTTParty.post(
+      "#{BASE_URI}/#{@api_version}/#{waba_id}/subscribed_apps",
+      headers: request_headers
+    )
+
+    handle_response(response, 'App subscription to WABA failed')
+  end
+
+  def override_waba_callback(waba_id, callback_url, verify_token)
     response = HTTParty.post(
       "#{BASE_URI}/#{@api_version}/#{waba_id}/subscribed_apps",
       headers: request_headers,
       body: {
         override_callback_uri: callback_url,
-        verify_token: verify_token
+        verify_token: verify_token,
+        subscribed_fields: %w[messages smb_message_echoes]
       }.to_json
     )
 
-    handle_response(response, 'Webhook subscription failed')
+    handle_response(response, 'Webhook callback override failed')
   end
 
   def unsubscribe_waba_webhook(waba_id)

app/services/whatsapp/incoming_message_base_service.rb

@@ -4,18 +4,23 @@
 class Whatsapp::IncomingMessageBaseService
   include ::Whatsapp::IncomingMessageServiceHelpers
 
-  pattr_initialize [:inbox!, :params!]
+  pattr_initialize [:inbox!, :params!, :outgoing_echo]
 
   def perform
     processed_params
 
     if processed_params.try(:[], :statuses).present?
       process_statuses
-    elsif processed_params.try(:[], :messages).present?
+    elsif messages_data.present?
       process_messages
     end
   end
 
+  # Returns messages array for both regular messages and echo events
+  def messages_data
+    @processed_params&.dig(:messages) || @processed_params&.dig(:message_echoes)
+  end
+
   private
 
   def process_messages
@@ -26,7 +31,7 @@ class Whatsapp::IncomingMessageBaseService
     # Multiple webhook event can be received against the same message due to misconfigurations in the Meta
     # business manager account. While we have not found the core reason yet, the following line ensure that
     # there are no duplicate messages created.
-    return if find_message_by_source_id(@processed_params[:messages].first[:id]) || message_under_process?
+    return if find_message_by_source_id(messages_data.first[:id]) || message_under_process?
 
     cache_message_source_id_in_redis
     set_contact
@@ -57,7 +62,7 @@ class Whatsapp::IncomingMessageBaseService
   end
 
   def create_messages
-    message = @processed_params[:messages].first
+    message = messages_data.first
     log_error(message) && return if error_webhook_event?(message)
 
     process_in_reply_to(message)
@@ -67,20 +72,44 @@ class Whatsapp::IncomingMessageBaseService
 
   def create_contact_messages(message)
     message['contacts'].each do |contact|
-      create_message(contact)
+      # Pass source_id from parent message since contact objects don't have :id
+      create_message(contact, source_id: message[:id])
       attach_contact(contact)
       @message.save!
     end
   end
 
   def create_regular_message(message)
-    create_message(message)
+    create_message(message, source_id: message[:id])
     attach_files
     attach_location if message_type == 'location'
     @message.save!
   end
 
   def set_contact
+    if outgoing_echo
+      set_contact_from_echo
+    else
+      set_contact_from_message
+    end
+  end
+
+  def set_contact_from_echo
+    # For echo messages, contact phone is in the 'to' field
+    phone_number = messages_data.first[:to]
+    waid = processed_waid(phone_number)
+
+    contact_inbox = ::ContactInboxWithContactBuilder.new(
+      source_id: waid,
+      inbox: inbox,
+      contact_attributes: { name: "+#{phone_number}", phone_number: "+#{phone_number}" }
+    ).perform
+
+    @contact_inbox = contact_inbox
+    @contact = contact_inbox.contact
+  end
+
+  def set_contact_from_message
     contact_params = @processed_params[:contacts]&.first
     return if contact_params.blank?
 
@@ -89,7 +118,7 @@ class Whatsapp::IncomingMessageBaseService
     contact_inbox = ::ContactInboxWithContactBuilder.new(
       source_id: waid,
       inbox: inbox,
-      contact_attributes: { name: contact_params.dig(:profile, :name), phone_number: "+#{@processed_params[:messages].first[:from]}" }
+      contact_attributes: { name: contact_params.dig(:profile, :name), phone_number: "+#{messages_data.first[:from]}" }
     ).perform
 
     @contact_inbox = contact_inbox
@@ -115,7 +144,7 @@ class Whatsapp::IncomingMessageBaseService
   def attach_files
     return if %w[text button interactive location contacts].include?(message_type)
 
-    attachment_payload = @processed_params[:messages].first[message_type.to_sym]
+    attachment_payload = messages_data.first[message_type.to_sym]
     @message.content ||= attachment_payload[:caption]
 
     attachment_file = download_attachment_file(attachment_payload)
@@ -133,7 +162,7 @@ class Whatsapp::IncomingMessageBaseService
   end
 
   def attach_location
-    location = @processed_params[:messages].first['location']
+    location = messages_data.first['location']
     location_name = location['name'] ? "#{location['name']}, #{location['address']}" : ''
     @message.attachments.new(
       account_id: @message.account_id,
@@ -145,14 +174,17 @@ class Whatsapp::IncomingMessageBaseService
     )
   end
 
-  def create_message(message)
+  def create_message(message, source_id: nil)
     @message = @conversation.messages.build(
       content: message_content(message),
       account_id: @inbox.account_id,
       inbox_id: @inbox.id,
-      message_type: :incoming,
-      sender: @contact,
-      source_id: message[:id].to_s,
+      message_type: outgoing_echo ? :outgoing : :incoming,
+      # Set status to :delivered for echo messages to prevent SendReplyJob from trying to send them
+      status: outgoing_echo ? :delivered : :sent,
+      sender: outgoing_echo ? nil : @contact,
+      source_id: (source_id || message[:id]).to_s,
+      content_attributes: outgoing_echo ? { external_echo: true } : {},
       in_reply_to_external_id: @in_reply_to_external_id
     )
   end
@@ -189,7 +221,7 @@ class Whatsapp::IncomingMessageBaseService
   end
 
   def contact_name_matches_phone_number?
-    phone_number = "+#{@processed_params[:messages].first[:from]}"
+    phone_number = "+#{messages_data.first[:from]}"
     formatted_phone_number = TelephoneNumber.parse(phone_number).international_number
     @contact.name == phone_number || @contact.name == formatted_phone_number
   end

app/services/whatsapp/incoming_message_service_helpers.rb

@@ -21,7 +21,7 @@ module Whatsapp::IncomingMessageServiceHelpers
   end
 
   def message_type
-    @processed_params[:messages].first[:type]
+    messages_data.first[:type]
   end
 
   def message_content(message)
@@ -70,19 +70,19 @@ module Whatsapp::IncomingMessageServiceHelpers
   end
 
   def message_under_process?
-    key = format(Redis::RedisKeys::MESSAGE_SOURCE_KEY, id: @processed_params[:messages].first[:id])
+    key = format(Redis::RedisKeys::MESSAGE_SOURCE_KEY, id: messages_data.first[:id])
     Redis::Alfred.get(key)
   end
 
   def cache_message_source_id_in_redis
-    return if @processed_params.try(:[], :messages).blank?
+    return if messages_data.blank?
 
-    key = format(Redis::RedisKeys::MESSAGE_SOURCE_KEY, id: @processed_params[:messages].first[:id])
+    key = format(Redis::RedisKeys::MESSAGE_SOURCE_KEY, id: messages_data.first[:id])
     ::Redis::Alfred.setex(key, true)
   end
 
   def clear_message_source_id_from_redis
-    key = format(Redis::RedisKeys::MESSAGE_SOURCE_KEY, id: @processed_params[:messages].first[:id])
+    key = format(Redis::RedisKeys::MESSAGE_SOURCE_KEY, id: messages_data.first[:id])
     ::Redis::Alfred.delete(key)
   end
 end

config/installation_config.yml

@@ -107,6 +107,16 @@
   value:
   description: 'The support email address for your installation'
   locked: false
+- name: ACCOUNT_EMAILS_LIMIT
+  display_title: 'Account Email Sending Limit (Daily)'
+  description: 'Maximum number of non-channel emails an account can send per day'
+  value: 100
+  locked: false
+- name: ACCOUNT_EMAILS_PLAN_LIMITS
+  display_title: 'Account Email Plan Limits (Daily)'
+  description: 'Per-plan daily email sending limits as JSON'
+  value:
+  type: code
 # ------- End of Email Related Config ------- #
 
 # ------- Facebook Channel Related Config ------- #

config/routes.rb

@@ -445,6 +445,8 @@ Rails.application.routes.draw do
               get :conversation_traffic
               get :bot_metrics
               get :inbox_label_matrix
+              get :first_response_time_distribution
+              get :outgoing_messages_count
             end
           end
           resource :year_in_review, only: [:show]

db/migrate/20260130061021_add_index_to_reporting_events_for_response_distribution.rb

@@ -0,0 +1,11 @@
+class AddIndexToReportingEventsForResponseDistribution < ActiveRecord::Migration[7.1]
+  disable_ddl_transaction!
+
+  def change
+    add_index :reporting_events,
+              [:account_id, :name, :inbox_id, :created_at],
+              name: 'index_reporting_events_for_response_distribution',
+              algorithm: :concurrently,
+              if_not_exists: true
+  end
+end

db/schema.rb

@@ -10,7 +10,7 @@
 #
 # It's strongly recommended that you check this file into your version control system.
 
-ActiveRecord::Schema[7.1].define(version: 2026_01_20_121402) do
+ActiveRecord::Schema[7.1].define(version: 2026_01_30_061021) do
   # These extensions should be enabled to support this database
   enable_extension "pg_stat_statements"
   enable_extension "pg_trgm"
@@ -1115,6 +1115,7 @@ ActiveRecord::Schema[7.1].define(version: 2026_01_20_121402) do
     t.datetime "event_start_time", precision: nil
     t.datetime "event_end_time", precision: nil
     t.index ["account_id", "name", "created_at"], name: "reporting_events__account_id__name__created_at"
+    t.index ["account_id", "name", "inbox_id", "created_at"], name: "index_reporting_events_for_response_distribution"
     t.index ["account_id"], name: "index_reporting_events_on_account_id"
     t.index ["conversation_id"], name: "index_reporting_events_on_conversation_id"
     t.index ["created_at"], name: "index_reporting_events_on_created_at"

enterprise/app/fields/account_limits_field.rb

@@ -2,6 +2,9 @@ require 'administrate/field/base'
 
 class AccountLimitsField < Administrate::Field::Base
   def to_s
-    data.present? ? data.to_json : { agents: nil, inboxes: nil, captain_responses: nil, captain_documents: nil }.to_json
+    defaults = { agents: nil, inboxes: nil, captain_responses: nil, captain_documents: nil, emails: nil }
+    overrides = (data.presence || {}).to_h.symbolize_keys.compact
+
+    defaults.merge(overrides).to_json
   end
 end

enterprise/app/models/enterprise/account/plan_usage_and_limits.rb

@@ -1,4 +1,4 @@
-module Enterprise::Account::PlanUsageAndLimits
+module Enterprise::Account::PlanUsageAndLimits # rubocop:disable Metrics/ModuleLength
   CAPTAIN_RESPONSES = 'captain_responses'.freeze
   CAPTAIN_DOCUMENTS = 'captain_documents'.freeze
   CAPTAIN_RESPONSES_USAGE = 'captain_responses_usage'.freeze
@@ -32,6 +32,10 @@ module Enterprise::Account::PlanUsageAndLimits
     save
   end
 
+  def email_rate_limit
+    account_limit || plan_email_limit || global_limit || default_limit
+  end
+
   def subscribed_features
     plan_features = InstallationConfig.find_by(name: 'CHATWOOT_CLOUD_PLAN_FEATURES')&.value
     return [] if plan_features.blank?
@@ -68,6 +72,16 @@ module Enterprise::Account::PlanUsageAndLimits
     }
   end
 
+  def plan_email_limit
+    config = InstallationConfig.find_by(name: 'ACCOUNT_EMAILS_PLAN_LIMITS')&.value
+    return nil if config.blank? || plan_name.blank?
+
+    parsed = config.is_a?(String) ? JSON.parse(config) : config
+    parsed[plan_name.downcase]&.to_i
+  rescue StandardError
+    nil
+  end
+
   def default_captain_limits
     max_limits = { documents: ChatwootApp.max_limit, responses: ChatwootApp.max_limit }.with_indifferent_access
     zero_limits = { documents: 0, responses: 0 }.with_indifferent_access
@@ -119,7 +133,8 @@ module Enterprise::Account::PlanUsageAndLimits
         'inboxes' => { 'type': 'number' },
         'agents' => { 'type': 'number' },
         'captain_responses' => { 'type': 'number' },
-        'captain_documents' => { 'type': 'number' }
+        'captain_documents' => { 'type': 'number' },
+        'emails' => { 'type': 'number' }
       },
       'required' => [],
       'additionalProperties' => false

lib/redis/redis_keys.rb

@@ -49,4 +49,7 @@ module Redis::RedisKeys
   # Track conversation assignments to agents for rate limiting
   ASSIGNMENT_KEY = 'ASSIGNMENT::%<inbox_id>d::AGENT::%<agent_id>d::CONVERSATION::%<conversation_id>d'.freeze
   ASSIGNMENT_KEY_PATTERN = 'ASSIGNMENT::%<inbox_id>d::AGENT::%<agent_id>d::*'.freeze
+
+  ## Account Email Rate Limiting
+  ACCOUNT_OUTBOUND_EMAIL_COUNT_KEY = 'OUTBOUND_EMAIL_COUNT::%<account_id>d::%<date>s'.freeze
 end

spec/builders/v2/reports/first_response_time_distribution_builder_spec.rb

@@ -0,0 +1,145 @@
+require 'rails_helper'
+
+RSpec.describe V2::Reports::FirstResponseTimeDistributionBuilder do
+  let!(:account) { create(:account) }
+  let!(:web_widget_inbox) { create(:inbox, account: account, channel: create(:channel_widget, account: account)) }
+  let!(:email_inbox) { create(:inbox, account: account, channel: create(:channel_email, account: account)) }
+  let(:params) do
+    {
+      since: 1.week.ago.beginning_of_day.to_i.to_s,
+      until: Time.current.end_of_day.to_i.to_s
+    }
+  end
+  let(:builder) { described_class.new(account: account, params: params) }
+
+  describe '#build' do
+    subject(:report) { builder.build }
+
+    context 'when there are first response events across channels and time buckets' do
+      before do
+        # Web Widget: 0-1h bucket (30 minutes = 1800 seconds)
+        create(:reporting_event, account: account, inbox: web_widget_inbox, name: 'first_response',
+                                 value: 1_800, created_at: 2.days.ago)
+        # Web Widget: 1-4h bucket (2 hours = 7200 seconds)
+        create(:reporting_event, account: account, inbox: web_widget_inbox, name: 'first_response',
+                                 value: 7_200, created_at: 2.days.ago)
+        # Web Widget: 4-8h bucket (6 hours = 21600 seconds)
+        create(:reporting_event, account: account, inbox: web_widget_inbox, name: 'first_response',
+                                 value: 21_600, created_at: 3.days.ago)
+        # Email: 8-24h bucket (12 hours = 43200 seconds)
+        create(:reporting_event, account: account, inbox: email_inbox, name: 'first_response',
+                                 value: 43_200, created_at: 2.days.ago)
+        # Email: 24h+ bucket (48 hours = 172800 seconds)
+        create(:reporting_event, account: account, inbox: email_inbox, name: 'first_response',
+                                 value: 172_800, created_at: 1.day.ago)
+      end
+
+      it 'returns correct distribution for web widget channel' do
+        expect(report['Channel::WebWidget']).to eq({
+                                                     '0-1h' => 1,
+                                                     '1-4h' => 1,
+                                                     '4-8h' => 1,
+                                                     '8-24h' => 0,
+                                                     '24h+' => 0
+                                                   })
+      end
+
+      it 'returns correct distribution for email channel' do
+        expect(report['Channel::Email']).to eq({
+                                                 '0-1h' => 0,
+                                                 '1-4h' => 0,
+                                                 '4-8h' => 0,
+                                                 '8-24h' => 1,
+                                                 '24h+' => 1
+                                               })
+      end
+    end
+
+    context 'when filtering by date range' do
+      before do
+        create(:reporting_event, account: account, inbox: web_widget_inbox, name: 'first_response',
+                                 value: 1_800, created_at: 2.days.ago)
+        create(:reporting_event, account: account, inbox: web_widget_inbox, name: 'first_response',
+                                 value: 1_800, created_at: 2.weeks.ago)
+      end
+
+      it 'only counts events within the date range' do
+        expect(report['Channel::WebWidget']['0-1h']).to eq(1)
+      end
+    end
+
+    context 'when there are no first response events' do
+      it 'returns an empty hash' do
+        expect(report).to eq({})
+      end
+    end
+
+    context 'when events belong to another account' do
+      let(:other_account) { create(:account) }
+      let(:other_inbox) { create(:inbox, account: other_account) }
+
+      before do
+        create(:reporting_event, account: other_account, inbox: other_inbox, name: 'first_response',
+                                 value: 1_800, created_at: 2.days.ago)
+      end
+
+      it 'does not include events from other accounts' do
+        expect(report).to eq({})
+      end
+    end
+
+    context 'when events have different names' do
+      before do
+        create(:reporting_event, account: account, inbox: web_widget_inbox, name: 'first_response',
+                                 value: 1_800, created_at: 2.days.ago)
+        create(:reporting_event, account: account, inbox: web_widget_inbox, name: 'conversation_resolved',
+                                 value: 1_800, created_at: 2.days.ago)
+        create(:reporting_event, account: account, inbox: web_widget_inbox, name: 'reply_time',
+                                 value: 1_800, created_at: 2.days.ago)
+      end
+
+      it 'only counts first_response events' do
+        expect(report['Channel::WebWidget']['0-1h']).to eq(1)
+      end
+    end
+
+    context 'when no date range params are provided' do
+      let(:params) { {} }
+
+      before do
+        create(:reporting_event, account: account, inbox: web_widget_inbox, name: 'first_response',
+                                 value: 1_800, created_at: 2.days.ago)
+        create(:reporting_event, account: account, inbox: web_widget_inbox, name: 'first_response',
+                                 value: 1_800, created_at: 2.months.ago)
+      end
+
+      it 'returns all events without date filtering' do
+        expect(report['Channel::WebWidget']['0-1h']).to eq(2)
+      end
+    end
+
+    context 'with boundary values for time buckets' do
+      before do
+        # Exactly at 1 hour boundary (should be in 1-4h bucket)
+        create(:reporting_event, account: account, inbox: web_widget_inbox, name: 'first_response',
+                                 value: 3_600, created_at: 2.days.ago)
+        # Just under 1 hour (should be in 0-1h bucket)
+        create(:reporting_event, account: account, inbox: web_widget_inbox, name: 'first_response',
+                                 value: 3_599, created_at: 2.days.ago)
+        # Exactly at 24 hour boundary (should be in 24h+ bucket)
+        create(:reporting_event, account: account, inbox: web_widget_inbox, name: 'first_response',
+                                 value: 86_400, created_at: 2.days.ago)
+      end
+
+      it 'correctly assigns boundary values to buckets' do
+        expect(report['Channel::WebWidget']).to eq({
+                                                     '0-1h' => 1,
+                                                     '1-4h' => 1,
+                                                     '4-8h' => 0,
+                                                     '8-24h' => 0,
+                                                     '24h+' => 1
+                                                   })
+      end
+    end
+  end
+end

spec/controllers/api/v2/accounts/reports_controller_spec.rb

@@ -248,4 +248,178 @@ RSpec.describe Api::V2::Accounts::ReportsController, type: :request do
       end
     end
   end
+
+  describe 'GET /api/v2/accounts/{account.id}/reports/first_response_time_distribution' do
+    let!(:web_widget_inbox) { create(:inbox, account: account, channel: create(:channel_widget, account: account)) }
+
+    context 'when unauthenticated' do
+      it 'returns unauthorized' do
+        get "/api/v2/accounts/#{account.id}/reports/first_response_time_distribution"
+        expect(response).to have_http_status(:unauthorized)
+      end
+    end
+
+    context 'when authenticated as agent' do
+      it 'returns unauthorized' do
+        get "/api/v2/accounts/#{account.id}/reports/first_response_time_distribution",
+            headers: agent.create_new_auth_token, as: :json
+        expect(response).to have_http_status(:unauthorized)
+      end
+    end
+
+    context 'when authenticated as admin' do
+      before do
+        create(:reporting_event, account: account, inbox: web_widget_inbox, name: 'first_response',
+                                 value: 1_800, created_at: 2.days.ago)
+      end
+
+      it 'returns the first response time distribution' do
+        get "/api/v2/accounts/#{account.id}/reports/first_response_time_distribution",
+            params: { since: 1.week.ago.to_i.to_s, until: Time.current.to_i.to_s },
+            headers: admin.create_new_auth_token, as: :json
+
+        expect(response).to have_http_status(:success)
+
+        body = response.parsed_body
+        expect(body).to be_a(Hash)
+        expect(body['Channel::WebWidget']).to include('0-1h', '1-4h', '4-8h', '8-24h', '24h+')
+      end
+
+      it 'returns correct counts in buckets' do
+        get "/api/v2/accounts/#{account.id}/reports/first_response_time_distribution",
+            params: { since: 1.week.ago.to_i.to_s, until: Time.current.to_i.to_s },
+            headers: admin.create_new_auth_token, as: :json
+
+        body = response.parsed_body
+        expect(body['Channel::WebWidget']['0-1h']).to eq(1)
+      end
+    end
+  end
+
+  describe 'GET /api/v2/accounts/{account.id}/reports/outgoing_messages_count' do
+    let(:since_epoch) { 1.week.ago.to_i.to_s }
+    let(:until_epoch) { 1.day.from_now.to_i.to_s }
+
+    context 'when unauthenticated' do
+      it 'returns unauthorized' do
+        get "/api/v2/accounts/#{account.id}/reports/outgoing_messages_count",
+            params: { group_by: 'agent', since: since_epoch, until: until_epoch }
+        expect(response).to have_http_status(:unauthorized)
+      end
+    end
+
+    context 'when authenticated as agent' do
+      it 'returns unauthorized' do
+        get "/api/v2/accounts/#{account.id}/reports/outgoing_messages_count",
+            params: { group_by: 'agent', since: since_epoch, until: until_epoch },
+            headers: agent.create_new_auth_token, as: :json
+        expect(response).to have_http_status(:unauthorized)
+      end
+    end
+
+    context 'when authenticated as admin' do
+      let(:agent2) { create(:user, account: account, role: :agent) }
+      let(:team) { create(:team, account: account) }
+      let(:inbox2) { create(:inbox, account: account) }
+
+      # Separate conversations for agent and team grouping because
+      # model callbacks clear assignee_id when team is set.
+      before do
+        conv_agent = create(:conversation, account: account, inbox: inbox, assignee: agent)
+        conv_agent2 = create(:conversation, account: account, inbox: inbox2, assignee: agent2)
+        conv_team = create(:conversation, account: account, inbox: inbox, team: team)
+
+        create_list(:message, 3, account: account, conversation: conv_agent, inbox: inbox, message_type: :outgoing, sender: agent)
+        create_list(:message, 2, account: account, conversation: conv_agent2, inbox: inbox2, message_type: :outgoing, sender: agent2)
+        create_list(:message, 4, account: account, conversation: conv_team, inbox: inbox, message_type: :outgoing)
+        # incoming message should not be counted
+        create(:message, account: account, conversation: conv_agent, inbox: inbox, message_type: :incoming)
+      end
+
+      it 'returns unprocessable_entity for invalid group_by' do
+        get "/api/v2/accounts/#{account.id}/reports/outgoing_messages_count",
+            params: { group_by: 'invalid', since: since_epoch, until: until_epoch },
+            headers: admin.create_new_auth_token, as: :json
+
+        expect(response).to have_http_status(:unprocessable_entity)
+      end
+
+      it 'returns outgoing message counts grouped by agent' do
+        get "/api/v2/accounts/#{account.id}/reports/outgoing_messages_count",
+            params: { group_by: 'agent', since: since_epoch, until: until_epoch },
+            headers: admin.create_new_auth_token, as: :json
+
+        expect(response).to have_http_status(:success)
+        data = response.parsed_body
+        expect(data).to be_an(Array)
+
+        agent_entry = data.find { |e| e['id'] == agent.id }
+        agent2_entry = data.find { |e| e['id'] == agent2.id }
+        expect(agent_entry['outgoing_messages_count']).to eq(3)
+        expect(agent2_entry['outgoing_messages_count']).to eq(2)
+      end
+
+      it 'returns outgoing message counts grouped by team' do
+        get "/api/v2/accounts/#{account.id}/reports/outgoing_messages_count",
+            params: { group_by: 'team', since: since_epoch, until: until_epoch },
+            headers: admin.create_new_auth_token, as: :json
+
+        expect(response).to have_http_status(:success)
+        data = response.parsed_body
+        expect(data).to be_an(Array)
+        expect(data.length).to eq(1)
+        expect(data.first['id']).to eq(team.id)
+        expect(data.first['outgoing_messages_count']).to eq(4)
+      end
+
+      it 'returns outgoing message counts grouped by inbox' do
+        get "/api/v2/accounts/#{account.id}/reports/outgoing_messages_count",
+            params: { group_by: 'inbox', since: since_epoch, until: until_epoch },
+            headers: admin.create_new_auth_token, as: :json
+
+        expect(response).to have_http_status(:success)
+        data = response.parsed_body
+        expect(data).to be_an(Array)
+
+        inbox_entry = data.find { |e| e['id'] == inbox.id }
+        inbox2_entry = data.find { |e| e['id'] == inbox2.id }
+        expect(inbox_entry['outgoing_messages_count']).to eq(7)
+        expect(inbox2_entry['outgoing_messages_count']).to eq(2)
+      end
+
+      it 'returns outgoing message counts grouped by label' do
+        label = create(:label, account: account, title: 'support')
+        conversation = account.conversations.first
+        conversation.label_list.add('support')
+        conversation.save!
+
+        get "/api/v2/accounts/#{account.id}/reports/outgoing_messages_count",
+            params: { group_by: 'label', since: since_epoch, until: until_epoch },
+            headers: admin.create_new_auth_token, as: :json
+
+        expect(response).to have_http_status(:success)
+        data = response.parsed_body
+        expect(data).to be_an(Array)
+        expect(data.length).to eq(1)
+        expect(data.first['id']).to eq(label.id)
+        expect(data.first['name']).to eq('support')
+      end
+
+      it 'excludes bot messages when grouped by agent' do
+        bot = create(:agent_bot)
+        bot_conversation = create(:conversation, account: account, inbox: inbox)
+        create(:message, account: account, conversation: bot_conversation, inbox: inbox,
+                         message_type: :outgoing, sender: bot)
+
+        get "/api/v2/accounts/#{account.id}/reports/outgoing_messages_count",
+            params: { group_by: 'agent', since: since_epoch, until: until_epoch },
+            headers: admin.create_new_auth_token, as: :json
+
+        data = response.parsed_body
+        agent_entry = data.find { |e| e['id'] == agent.id }
+        # 3 from before block; bot message excluded (sender_type != 'User')
+        expect(agent_entry['outgoing_messages_count']).to eq(3)
+      end
+    end
+  end
 end

spec/models/concerns/account_email_rate_limitable_spec.rb

@@ -0,0 +1,63 @@
+require 'rails_helper'
+
+RSpec.describe AccountEmailRateLimitable do
+  let(:account) { create(:account) }
+
+  describe '#email_rate_limit' do
+    it 'returns account-level override when set' do
+      account.update!(limits: { 'emails' => 50 })
+      expect(account.email_rate_limit).to eq(50)
+    end
+
+    it 'returns global config when no account override' do
+      InstallationConfig.where(name: 'ACCOUNT_EMAILS_LIMIT').first_or_create(value: 200)
+      expect(account.email_rate_limit).to eq(200)
+    end
+
+    it 'returns account override over global config' do
+      InstallationConfig.where(name: 'ACCOUNT_EMAILS_LIMIT').first_or_create(value: 200)
+      account.update!(limits: { 'emails' => 50 })
+      expect(account.email_rate_limit).to eq(50)
+    end
+  end
+
+  describe '#within_email_rate_limit?' do
+    before do
+      account.update!(limits: { 'emails' => 2 })
+    end
+
+    it 'returns true when under limit' do
+      expect(account).to be_within_email_rate_limit
+    end
+
+    it 'returns false when at limit' do
+      2.times { account.increment_email_sent_count }
+      expect(account).not_to be_within_email_rate_limit
+    end
+  end
+
+  describe '#increment_email_sent_count' do
+    it 'increments the counter' do
+      expect { account.increment_email_sent_count }.to change(account, :emails_sent_today).by(1)
+    end
+
+    it 'sets TTL on first increment' do
+      key = format(Redis::Alfred::ACCOUNT_OUTBOUND_EMAIL_COUNT_KEY, account_id: account.id, date: Time.zone.today.to_s)
+      allow(Redis::Alfred).to receive(:incr).and_return(1)
+      allow(Redis::Alfred).to receive(:expire)
+
+      account.increment_email_sent_count
+
+      expect(Redis::Alfred).to have_received(:expire).with(key, AccountEmailRateLimitable::OUTBOUND_EMAIL_TTL)
+    end
+
+    it 'does not reset TTL on subsequent increments' do
+      allow(Redis::Alfred).to receive(:incr).and_return(2)
+      allow(Redis::Alfred).to receive(:expire)
+
+      account.increment_email_sent_count
+
+      expect(Redis::Alfred).not_to have_received(:expire)
+    end
+  end
+end

spec/services/messages/send_email_notification_service_spec.rb

@@ -99,6 +99,20 @@ describe Messages::SendEmailNotificationService do
         end
       end
 
+      context 'when account email rate limit is exceeded' do
+        let(:inbox) { create(:inbox, account: account, channel: create(:channel_widget, account: account, continuity_via_email: true)) }
+        let(:conversation) { create(:conversation, account: account, inbox: inbox) }
+
+        before do
+          conversation.contact.update!(email: 'test@example.com')
+          allow_any_instance_of(Account).to receive(:within_email_rate_limit?).and_return(false) # rubocop:disable RSpec/AnyInstance
+        end
+
+        it 'does not enqueue job' do
+          expect { service.perform }.not_to have_enqueued_job(ConversationReplyEmailJob)
+        end
+      end
+
       context 'when channel does not support email notifications' do
         let(:inbox) { create(:inbox, account: account, channel: create(:channel_sms, account: account)) }
         let(:conversation) { create(:conversation, account: account, inbox: inbox) }

spec/services/whatsapp/facebook_api_client_spec.rb

@@ -161,10 +161,23 @@ describe Whatsapp::FacebookApiClient do
 
     context 'when successful' do
       before do
+        # Step 1: Subscribe app to WABA (no body)
+        stub_request(:post, "https://graph.facebook.com/#{api_version}/#{waba_id}/subscribed_apps")
+          .with(
+            headers: { 'Authorization' => "Bearer #{access_token}", 'Content-Type' => 'application/json' }
+          )
+          .to_return(
+            status: 200,
+            body: { success: true }.to_json,
+            headers: { 'Content-Type' => 'application/json' }
+          )
+
+        # Step 2: Override callback URL (with body)
         stub_request(:post, "https://graph.facebook.com/#{api_version}/#{waba_id}/subscribed_apps")
           .with(
             headers: { 'Authorization' => "Bearer #{access_token}", 'Content-Type' => 'application/json' },
-            body: { override_callback_uri: callback_url, verify_token: verify_token }.to_json
+            body: { override_callback_uri: callback_url, verify_token: verify_token,
+                    subscribed_fields: %w[messages smb_message_echoes] }.to_json
           )
           .to_return(
             status: 200,
@@ -179,18 +192,45 @@ describe Whatsapp::FacebookApiClient do
       end
     end
 
-    context 'when failed' do
+    context 'when app subscription fails' do
       before do
         stub_request(:post, "https://graph.facebook.com/#{api_version}/#{waba_id}/subscribed_apps")
           .with(
-            headers: { 'Authorization' => "Bearer #{access_token}", 'Content-Type' => 'application/json' },
-            body: { override_callback_uri: callback_url, verify_token: verify_token }.to_json
+            headers: { 'Authorization' => "Bearer #{access_token}", 'Content-Type' => 'application/json' }
           )
-          .to_return(status: 400, body: { error: 'Webhook subscription failed' }.to_json)
+          .to_return(status: 400, body: { error: 'App subscription to WABA failed' }.to_json)
       end
 
       it 'raises an error' do
-        expect { api_client.subscribe_waba_webhook(waba_id, callback_url, verify_token) }.to raise_error(/Webhook subscription failed/)
+        expect { api_client.subscribe_waba_webhook(waba_id, callback_url, verify_token) }.to raise_error(/App subscription to WABA failed/)
+      end
+    end
+
+    context 'when callback override fails' do
+      before do
+        # Step 1 succeeds
+        stub_request(:post, "https://graph.facebook.com/#{api_version}/#{waba_id}/subscribed_apps")
+          .with(
+            headers: { 'Authorization' => "Bearer #{access_token}", 'Content-Type' => 'application/json' }
+          )
+          .to_return(
+            status: 200,
+            body: { success: true }.to_json,
+            headers: { 'Content-Type' => 'application/json' }
+          )
+
+        # Step 2 fails
+        stub_request(:post, "https://graph.facebook.com/#{api_version}/#{waba_id}/subscribed_apps")
+          .with(
+            headers: { 'Authorization' => "Bearer #{access_token}", 'Content-Type' => 'application/json' },
+            body: { override_callback_uri: callback_url, verify_token: verify_token,
+                    subscribed_fields: %w[messages smb_message_echoes] }.to_json
+          )
+          .to_return(status: 400, body: { error: 'Webhook callback override failed' }.to_json)
+      end
+
+      it 'raises an error' do
+        expect { api_client.subscribe_waba_webhook(waba_id, callback_url, verify_token) }.to raise_error(/Webhook callback override failed/)
       end
     end
   end

swagger/definitions/index.yml

@@ -225,6 +225,18 @@ agent_conversation_metrics:
   $ref: './resource/reports/conversation/agent.yml'
 channel_summary:
   $ref: './resource/reports/channel_summary.yml'
+first_response_time_distribution:
+  $ref: './resource/reports/first_response_time_distribution.yml'
+inbox_label_matrix:
+  $ref: './resource/reports/inbox_label_matrix.yml'
+outgoing_messages_count:
+  $ref: './resource/reports/outgoing_messages_count.yml'
+inbox_summary:
+  $ref: './resource/reports/inbox_summary.yml'
+agent_summary:
+  $ref: './resource/reports/agent_summary.yml'
+team_summary:
+  $ref: './resource/reports/team_summary.yml'
 
 contact_detail:
   $ref: ./resource/contact_detail.yml

swagger/definitions/resource/reports/agent_summary.yml

@@ -0,0 +1,39 @@
+type: array
+description: Agent summary report containing conversation statistics grouped by agent.
+items:
+  type: object
+  properties:
+    id:
+      type: number
+      description: The agent (user) ID
+    conversations_count:
+      type: number
+      description: Number of conversations assigned to the agent during the date range
+    resolved_conversations_count:
+      type: number
+      description: Number of conversations resolved by the agent during the date range
+    avg_resolution_time:
+      type: number
+      nullable: true
+      description: Average time (in seconds) to resolve conversations. Null if no data available.
+    avg_first_response_time:
+      type: number
+      nullable: true
+      description: Average time (in seconds) for the first response. Null if no data available.
+    avg_reply_time:
+      type: number
+      nullable: true
+      description: Average time (in seconds) between replies. Null if no data available.
+example:
+  - id: 1
+    conversations_count: 150
+    resolved_conversations_count: 120
+    avg_resolution_time: 3600
+    avg_first_response_time: 300
+    avg_reply_time: 600
+  - id: 2
+    conversations_count: 75
+    resolved_conversations_count: 60
+    avg_resolution_time: 1800
+    avg_first_response_time: 180
+    avg_reply_time: 420

swagger/definitions/resource/reports/first_response_time_distribution.yml

@@ -0,0 +1,34 @@
+type: object
+description: First response time distribution report grouped by channel type. Shows the count of conversations with first response times in different time buckets.
+additionalProperties:
+  type: object
+  description: First response time distribution for a specific channel type (e.g., Channel::WebWidget, Channel::Api)
+  properties:
+    0-1h:
+      type: number
+      description: Number of conversations with first response time less than 1 hour
+    1-4h:
+      type: number
+      description: Number of conversations with first response time between 1-4 hours
+    4-8h:
+      type: number
+      description: Number of conversations with first response time between 4-8 hours
+    8-24h:
+      type: number
+      description: Number of conversations with first response time between 8-24 hours
+    24h+:
+      type: number
+      description: Number of conversations with first response time greater than 24 hours
+example:
+  Channel::WebWidget:
+    0-1h: 150
+    1-4h: 80
+    4-8h: 45
+    8-24h: 30
+    24h+: 15
+  Channel::Api:
+    0-1h: 75
+    1-4h: 40
+    4-8h: 20
+    8-24h: 10
+    24h+: 5

swagger/definitions/resource/reports/inbox_label_matrix.yml

@@ -0,0 +1,50 @@
+type: object
+description: Inbox-label matrix report showing the count of conversations for each inbox-label combination.
+properties:
+  inboxes:
+    type: array
+    description: List of inboxes included in the report
+    items:
+      type: object
+      properties:
+        id:
+          type: number
+          description: The inbox ID
+        name:
+          type: string
+          description: The inbox name
+  labels:
+    type: array
+    description: List of labels included in the report
+    items:
+      type: object
+      properties:
+        id:
+          type: number
+          description: The label ID
+        title:
+          type: string
+          description: The label title
+  matrix:
+    type: array
+    description: 2D array where matrix[i][j] represents the count of conversations in inboxes[i] with labels[j]
+    items:
+      type: array
+      items:
+        type: number
+example:
+  inboxes:
+    - id: 1
+      name: Website Chat
+    - id: 2
+      name: Email Support
+  labels:
+    - id: 1
+      title: bug
+    - id: 2
+      title: feature-request
+    - id: 3
+      title: urgent
+  matrix:
+    - [10, 5, 3]
+    - [8, 12, 2]

swagger/definitions/resource/reports/inbox_summary.yml

@@ -0,0 +1,39 @@
+type: array
+description: Inbox summary report containing conversation statistics grouped by inbox.
+items:
+  type: object
+  properties:
+    id:
+      type: number
+      description: The inbox ID
+    conversations_count:
+      type: number
+      description: Number of conversations created in the inbox during the date range
+    resolved_conversations_count:
+      type: number
+      description: Number of conversations resolved in the inbox during the date range
+    avg_resolution_time:
+      type: number
+      nullable: true
+      description: Average time (in seconds) to resolve conversations. Null if no data available.
+    avg_first_response_time:
+      type: number
+      nullable: true
+      description: Average time (in seconds) for the first response. Null if no data available.
+    avg_reply_time:
+      type: number
+      nullable: true
+      description: Average time (in seconds) between replies. Null if no data available.
+example:
+  - id: 1
+    conversations_count: 150
+    resolved_conversations_count: 120
+    avg_resolution_time: 3600
+    avg_first_response_time: 300
+    avg_reply_time: 600
+  - id: 2
+    conversations_count: 75
+    resolved_conversations_count: 60
+    avg_resolution_time: 1800
+    avg_first_response_time: 180
+    avg_reply_time: 420

swagger/definitions/resource/reports/outgoing_messages_count.yml

@@ -0,0 +1,21 @@
+type: array
+description: Outgoing messages count report grouped by entity (agent, team, inbox, or label).
+items:
+  type: object
+  properties:
+    id:
+      type: number
+      description: The ID of the grouped entity (agent, team, inbox, or label).
+    name:
+      type: string
+      description: The name of the grouped entity.
+    outgoing_messages_count:
+      type: number
+      description: The total number of outgoing messages for this entity in the given time range.
+example:
+  - id: 1
+    name: Agent One
+    outgoing_messages_count: 42
+  - id: 2
+    name: Agent Two
+    outgoing_messages_count: 18

swagger/definitions/resource/reports/team_summary.yml

@@ -0,0 +1,39 @@
+type: array
+description: Team summary report containing conversation statistics grouped by team.
+items:
+  type: object
+  properties:
+    id:
+      type: number
+      description: The team ID
+    conversations_count:
+      type: number
+      description: Number of conversations assigned to the team during the date range
+    resolved_conversations_count:
+      type: number
+      description: Number of conversations resolved by the team during the date range
+    avg_resolution_time:
+      type: number
+      nullable: true
+      description: Average time (in seconds) to resolve conversations. Null if no data available.
+    avg_first_response_time:
+      type: number
+      nullable: true
+      description: Average time (in seconds) for the first response. Null if no data available.
+    avg_reply_time:
+      type: number
+      nullable: true
+      description: Average time (in seconds) between replies. Null if no data available.
+example:
+  - id: 1
+    conversations_count: 250
+    resolved_conversations_count: 200
+    avg_resolution_time: 2800
+    avg_first_response_time: 240
+    avg_reply_time: 500
+  - id: 2
+    conversations_count: 180
+    resolved_conversations_count: 150
+    avg_resolution_time: 2400
+    avg_first_response_time: 200
+    avg_reply_time: 450

swagger/index.html

@@ -18,6 +18,6 @@
   </head>
   <body>
     <redoc spec-url='/swagger/swagger.json'></redoc>
-    <script src="https://cdn.jsdelivr.net/npm/redoc@next/bundles/redoc.standalone.js"> </script>
+    <script src="https://cdn.jsdelivr.net/npm/redoc@2.1.5/bundles/redoc.standalone.js"> </script>
   </body>
 </html>

swagger/paths/application/reports/agent_summary.yml

@@ -0,0 +1,23 @@
+tags:
+  - Reports
+operationId: get-agent-summary-report
+summary: Get conversation statistics grouped by agent
+security:
+  - userApiKey: []
+description: |
+  Get conversation statistics grouped by agent for a given date range.
+  Returns metrics for each agent including conversation counts, resolution counts,
+  average first response time, average resolution time, and average reply time.
+responses:
+  '200':
+    description: Success
+    content:
+      application/json:
+        schema:
+          $ref: '#/components/schemas/agent_summary'
+  '403':
+    description: Access denied
+    content:
+      application/json:
+        schema:
+          $ref: '#/components/schemas/bad_request_error'

swagger/paths/application/reports/first_response_time_distribution.yml

@@ -0,0 +1,24 @@
+tags:
+  - Reports
+operationId: get-first-response-time-distribution
+summary: Get first response time distribution by channel
+security:
+  - userApiKey: []
+description: |
+  Get the distribution of first response times grouped by channel type.
+  Returns conversation counts in different time buckets (0-1h, 1-4h, 4-8h, 8-24h, 24h+) for each channel type.
+
+  **Note:** This API endpoint is available only in Chatwoot version 4.11.0 and above.
+responses:
+  '200':
+    description: Success
+    content:
+      application/json:
+        schema:
+          $ref: '#/components/schemas/first_response_time_distribution'
+  '403':
+    description: Access denied
+    content:
+      application/json:
+        schema:
+          $ref: '#/components/schemas/bad_request_error'

swagger/paths/application/reports/inbox_label_matrix.yml

@@ -0,0 +1,25 @@
+tags:
+  - Reports
+operationId: get-inbox-label-matrix
+summary: Get inbox-label matrix report
+security:
+  - userApiKey: []
+description: |
+  Get a matrix showing the count of conversations for each inbox-label combination.
+  Returns a list of inboxes, labels, and a 2D matrix where each cell contains the count of conversations
+  in a specific inbox that have a specific label applied.
+
+  **Note:** This API endpoint is available only in Chatwoot version 4.11.0 and above.
+responses:
+  '200':
+    description: Success
+    content:
+      application/json:
+        schema:
+          $ref: '#/components/schemas/inbox_label_matrix'
+  '403':
+    description: Access denied
+    content:
+      application/json:
+        schema:
+          $ref: '#/components/schemas/bad_request_error'

swagger/paths/application/reports/inbox_summary.yml

@@ -0,0 +1,23 @@
+tags:
+  - Reports
+operationId: get-inbox-summary-report
+summary: Get conversation statistics grouped by inbox
+security:
+  - userApiKey: []
+description: |
+  Get conversation statistics grouped by inbox for a given date range.
+  Returns metrics for each inbox including conversation counts, resolution counts,
+  average first response time, average resolution time, and average reply time.
+responses:
+  '200':
+    description: Success
+    content:
+      application/json:
+        schema:
+          $ref: '#/components/schemas/inbox_summary'
+  '403':
+    description: Access denied
+    content:
+      application/json:
+        schema:
+          $ref: '#/components/schemas/bad_request_error'

swagger/paths/application/reports/outgoing_messages_count.yml

@@ -0,0 +1,36 @@
+tags:
+  - Reports
+operationId: get-outgoing-messages-count
+summary: Get outgoing messages count grouped by entity
+security:
+  - userApiKey: []
+description: |
+  Get the count of outgoing messages grouped by a specified entity (agent, team, inbox, or label).
+  When grouped by agent, messages sent by bots (AgentBot, Captain::Assistant) are excluded.
+
+  **Note:** This API endpoint is available only in Chatwoot version 4.11.0 and above.
+parameters:
+  - in: query
+    name: group_by
+    required: true
+    schema:
+      type: string
+      enum:
+        - agent
+        - team
+        - inbox
+        - label
+    description: The entity to group outgoing message counts by.
+responses:
+  '200':
+    description: Success
+    content:
+      application/json:
+        schema:
+          $ref: '#/components/schemas/outgoing_messages_count'
+  '403':
+    description: Access denied
+    content:
+      application/json:
+        schema:
+          $ref: '#/components/schemas/bad_request_error'

swagger/paths/application/reports/team_summary.yml

@@ -0,0 +1,23 @@
+tags:
+  - Reports
+operationId: get-team-summary-report
+summary: Get conversation statistics grouped by team
+security:
+  - userApiKey: []
+description: |
+  Get conversation statistics grouped by team for a given date range.
+  Returns metrics for each team including conversation counts, resolution counts,
+  average first response time, average resolution time, and average reply time.
+responses:
+  '200':
+    description: Success
+    content:
+      application/json:
+        schema:
+          $ref: '#/components/schemas/team_summary'
+  '403':
+    description: Access denied
+    content:
+      application/json:
+        schema:
+          $ref: '#/components/schemas/bad_request_error'

swagger/paths/index.yml

@@ -641,6 +641,23 @@
 
 # Channel summary report (Available in 4.10.0+)
 /api/v2/accounts/{account_id}/summary_reports/channel:
+  parameters:
+    - $ref: '#/components/parameters/account_id'
+    - in: query
+      name: since
+      schema:
+        type: string
+      description: The timestamp from where report should start (Unix timestamp).
+    - in: query
+      name: until
+      schema:
+        type: string
+      description: The timestamp from where report should stop (Unix timestamp).
+  get:
+    $ref: './application/reports/channel_summary.yml'
+
+# Inbox summary report
+/api/v2/accounts/{account_id}/summary_reports/inbox:
   parameters:
     - $ref: '#/components/parameters/account_id'
     - in: query
@@ -657,9 +674,118 @@
       name: business_hours
       schema:
         type: boolean
-      description: Whether to filter by business hours.
+      description: Whether to calculate metrics using business hours only.
   get:
-    $ref: './application/reports/channel_summary.yml'
+    $ref: './application/reports/inbox_summary.yml'
+
+# Agent summary report
+/api/v2/accounts/{account_id}/summary_reports/agent:
+  parameters:
+    - $ref: '#/components/parameters/account_id'
+    - in: query
+      name: since
+      schema:
+        type: string
+      description: The timestamp from where report should start (Unix timestamp).
+    - in: query
+      name: until
+      schema:
+        type: string
+      description: The timestamp from where report should stop (Unix timestamp).
+    - in: query
+      name: business_hours
+      schema:
+        type: boolean
+      description: Whether to calculate metrics using business hours only.
+  get:
+    $ref: './application/reports/agent_summary.yml'
+
+# Team summary report
+/api/v2/accounts/{account_id}/summary_reports/team:
+  parameters:
+    - $ref: '#/components/parameters/account_id'
+    - in: query
+      name: since
+      schema:
+        type: string
+      description: The timestamp from where report should start (Unix timestamp).
+    - in: query
+      name: until
+      schema:
+        type: string
+      description: The timestamp from where report should stop (Unix timestamp).
+    - in: query
+      name: business_hours
+      schema:
+        type: boolean
+      description: Whether to calculate metrics using business hours only.
+  get:
+    $ref: './application/reports/team_summary.yml'
+
+# First response time distribution report
+/api/v2/accounts/{account_id}/reports/first_response_time_distribution:
+  parameters:
+    - $ref: '#/components/parameters/account_id'
+    - in: query
+      name: since
+      schema:
+        type: string
+      description: The timestamp from where report should start (Unix timestamp).
+    - in: query
+      name: until
+      schema:
+        type: string
+      description: The timestamp from where report should stop (Unix timestamp).
+  get:
+    $ref: './application/reports/first_response_time_distribution.yml'
+
+# Inbox-label matrix report
+/api/v2/accounts/{account_id}/reports/inbox_label_matrix:
+  parameters:
+    - $ref: '#/components/parameters/account_id'
+    - in: query
+      name: since
+      schema:
+        type: string
+      description: The timestamp from where report should start (Unix timestamp).
+    - in: query
+      name: until
+      schema:
+        type: string
+      description: The timestamp from where report should stop (Unix timestamp).
+    - in: query
+      name: inbox_ids
+      schema:
+        type: array
+        items:
+          type: integer
+      description: Filter by specific inbox IDs.
+    - in: query
+      name: label_ids
+      schema:
+        type: array
+        items:
+          type: integer
+      description: Filter by specific label IDs.
+  get:
+    $ref: './application/reports/inbox_label_matrix.yml'
+
+# Outgoing messages count report
+/api/v2/accounts/{account_id}/reports/outgoing_messages_count:
+  parameters:
+    - $ref: '#/components/parameters/account_id'
+    - in: query
+      name: since
+      schema:
+        type: string
+      description: The timestamp from where report should start (Unix timestamp).
+    - in: query
+      name: until
+      schema:
+        type: string
+      description: The timestamp from where report should stop (Unix timestamp).
+  get:
+    $ref: './application/reports/outgoing_messages_count.yml'
 
 # Conversations Messages
 /accounts/{account_id}/conversations/{conversation_id}/messages:

swagger/swagger.json

@@ -7890,14 +7890,6 @@
             "type": "string"
           },
           "description": "The timestamp from where report should stop (Unix timestamp)."
-        },
-        {
-          "in": "query",
-          "name": "business_hours",
-          "schema": {
-            "type": "boolean"
-          },
-          "description": "Whether to filter by business hours."
         }
       ],
       "get": {
@@ -7946,6 +7938,417 @@
         }
       }
     },
+    "/api/v2/accounts/{account_id}/summary_reports/inbox": {
+      "parameters": [
+        {
+          "$ref": "#/components/parameters/account_id"
+        },
+        {
+          "in": "query",
+          "name": "since",
+          "schema": {
+            "type": "string"
+          },
+          "description": "The timestamp from where report should start (Unix timestamp)."
+        },
+        {
+          "in": "query",
+          "name": "until",
+          "schema": {
+            "type": "string"
+          },
+          "description": "The timestamp from where report should stop (Unix timestamp)."
+        },
+        {
+          "in": "query",
+          "name": "business_hours",
+          "schema": {
+            "type": "boolean"
+          },
+          "description": "Whether to calculate metrics using business hours only."
+        }
+      ],
+      "get": {
+        "tags": [
+          "Reports"
+        ],
+        "operationId": "get-inbox-summary-report",
+        "summary": "Get conversation statistics grouped by inbox",
+        "security": [
+          {
+            "userApiKey": []
+          }
+        ],
+        "description": "Get conversation statistics grouped by inbox for a given date range.\nReturns metrics for each inbox including conversation counts, resolution counts,\naverage first response time, average resolution time, and average reply time.\n",
+        "responses": {
+          "200": {
+            "description": "Success",
+            "content": {
+              "application/json": {
+                "schema": {
+                  "$ref": "#/components/schemas/inbox_summary"
+                }
+              }
+            }
+          },
+          "403": {
+            "description": "Access denied",
+            "content": {
+              "application/json": {
+                "schema": {
+                  "$ref": "#/components/schemas/bad_request_error"
+                }
+              }
+            }
+          }
+        }
+      }
+    },
+    "/api/v2/accounts/{account_id}/summary_reports/agent": {
+      "parameters": [
+        {
+          "$ref": "#/components/parameters/account_id"
+        },
+        {
+          "in": "query",
+          "name": "since",
+          "schema": {
+            "type": "string"
+          },
+          "description": "The timestamp from where report should start (Unix timestamp)."
+        },
+        {
+          "in": "query",
+          "name": "until",
+          "schema": {
+            "type": "string"
+          },
+          "description": "The timestamp from where report should stop (Unix timestamp)."
+        },
+        {
+          "in": "query",
+          "name": "business_hours",
+          "schema": {
+            "type": "boolean"
+          },
+          "description": "Whether to calculate metrics using business hours only."
+        }
+      ],
+      "get": {
+        "tags": [
+          "Reports"
+        ],
+        "operationId": "get-agent-summary-report",
+        "summary": "Get conversation statistics grouped by agent",
+        "security": [
+          {
+            "userApiKey": []
+          }
+        ],
+        "description": "Get conversation statistics grouped by agent for a given date range.\nReturns metrics for each agent including conversation counts, resolution counts,\naverage first response time, average resolution time, and average reply time.\n",
+        "responses": {
+          "200": {
+            "description": "Success",
+            "content": {
+              "application/json": {
+                "schema": {
+                  "$ref": "#/components/schemas/agent_summary"
+                }
+              }
+            }
+          },
+          "403": {
+            "description": "Access denied",
+            "content": {
+              "application/json": {
+                "schema": {
+                  "$ref": "#/components/schemas/bad_request_error"
+                }
+              }
+            }
+          }
+        }
+      }
+    },
+    "/api/v2/accounts/{account_id}/summary_reports/team": {
+      "parameters": [
+        {
+          "$ref": "#/components/parameters/account_id"
+        },
+        {
+          "in": "query",
+          "name": "since",
+          "schema": {
+            "type": "string"
+          },
+          "description": "The timestamp from where report should start (Unix timestamp)."
+        },
+        {
+          "in": "query",
+          "name": "until",
+          "schema": {
+            "type": "string"
+          },
+          "description": "The timestamp from where report should stop (Unix timestamp)."
+        },
+        {
+          "in": "query",
+          "name": "business_hours",
+          "schema": {
+            "type": "boolean"
+          },
+          "description": "Whether to calculate metrics using business hours only."
+        }
+      ],
+      "get": {
+        "tags": [
+          "Reports"
+        ],
+        "operationId": "get-team-summary-report",
+        "summary": "Get conversation statistics grouped by team",
+        "security": [
+          {
+            "userApiKey": []
+          }
+        ],
+        "description": "Get conversation statistics grouped by team for a given date range.\nReturns metrics for each team including conversation counts, resolution counts,\naverage first response time, average resolution time, and average reply time.\n",
+        "responses": {
+          "200": {
+            "description": "Success",
+            "content": {
+              "application/json": {
+                "schema": {
+                  "$ref": "#/components/schemas/team_summary"
+                }
+              }
+            }
+          },
+          "403": {
+            "description": "Access denied",
+            "content": {
+              "application/json": {
+                "schema": {
+                  "$ref": "#/components/schemas/bad_request_error"
+                }
+              }
+            }
+          }
+        }
+      }
+    },
+    "/api/v2/accounts/{account_id}/reports/first_response_time_distribution": {
+      "parameters": [
+        {
+          "$ref": "#/components/parameters/account_id"
+        },
+        {
+          "in": "query",
+          "name": "since",
+          "schema": {
+            "type": "string"
+          },
+          "description": "The timestamp from where report should start (Unix timestamp)."
+        },
+        {
+          "in": "query",
+          "name": "until",
+          "schema": {
+            "type": "string"
+          },
+          "description": "The timestamp from where report should stop (Unix timestamp)."
+        }
+      ],
+      "get": {
+        "tags": [
+          "Reports"
+        ],
+        "operationId": "get-first-response-time-distribution",
+        "summary": "Get first response time distribution by channel",
+        "security": [
+          {
+            "userApiKey": []
+          }
+        ],
+        "description": "Get the distribution of first response times grouped by channel type.\nReturns conversation counts in different time buckets (0-1h, 1-4h, 4-8h, 8-24h, 24h+) for each channel type.\n\n**Note:** This API endpoint is available only in Chatwoot version 4.11.0 and above.\n",
+        "responses": {
+          "200": {
+            "description": "Success",
+            "content": {
+              "application/json": {
+                "schema": {
+                  "$ref": "#/components/schemas/first_response_time_distribution"
+                }
+              }
+            }
+          },
+          "403": {
+            "description": "Access denied",
+            "content": {
+              "application/json": {
+                "schema": {
+                  "$ref": "#/components/schemas/bad_request_error"
+                }
+              }
+            }
+          }
+        }
+      }
+    },
+    "/api/v2/accounts/{account_id}/reports/inbox_label_matrix": {
+      "parameters": [
+        {
+          "$ref": "#/components/parameters/account_id"
+        },
+        {
+          "in": "query",
+          "name": "since",
+          "schema": {
+            "type": "string"
+          },
+          "description": "The timestamp from where report should start (Unix timestamp)."
+        },
+        {
+          "in": "query",
+          "name": "until",
+          "schema": {
+            "type": "string"
+          },
+          "description": "The timestamp from where report should stop (Unix timestamp)."
+        },
+        {
+          "in": "query",
+          "name": "inbox_ids",
+          "schema": {
+            "type": "array",
+            "items": {
+              "type": "integer"
+            }
+          },
+          "description": "Filter by specific inbox IDs."
+        },
+        {
+          "in": "query",
+          "name": "label_ids",
+          "schema": {
+            "type": "array",
+            "items": {
+              "type": "integer"
+            }
+          },
+          "description": "Filter by specific label IDs."
+        }
+      ],
+      "get": {
+        "tags": [
+          "Reports"
+        ],
+        "operationId": "get-inbox-label-matrix",
+        "summary": "Get inbox-label matrix report",
+        "security": [
+          {
+            "userApiKey": []
+          }
+        ],
+        "description": "Get a matrix showing the count of conversations for each inbox-label combination.\nReturns a list of inboxes, labels, and a 2D matrix where each cell contains the count of conversations\nin a specific inbox that have a specific label applied.\n\n**Note:** This API endpoint is available only in Chatwoot version 4.11.0 and above.\n",
+        "responses": {
+          "200": {
+            "description": "Success",
+            "content": {
+              "application/json": {
+                "schema": {
+                  "$ref": "#/components/schemas/inbox_label_matrix"
+                }
+              }
+            }
+          },
+          "403": {
+            "description": "Access denied",
+            "content": {
+              "application/json": {
+                "schema": {
+                  "$ref": "#/components/schemas/bad_request_error"
+                }
+              }
+            }
+          }
+        }
+      }
+    },
+    "/api/v2/accounts/{account_id}/reports/outgoing_messages_count": {
+      "parameters": [
+        {
+          "$ref": "#/components/parameters/account_id"
+        },
+        {
+          "in": "query",
+          "name": "since",
+          "schema": {
+            "type": "string"
+          },
+          "description": "The timestamp from where report should start (Unix timestamp)."
+        },
+        {
+          "in": "query",
+          "name": "until",
+          "schema": {
+            "type": "string"
+          },
+          "description": "The timestamp from where report should stop (Unix timestamp)."
+        }
+      ],
+      "get": {
+        "tags": [
+          "Reports"
+        ],
+        "operationId": "get-outgoing-messages-count",
+        "summary": "Get outgoing messages count grouped by entity",
+        "security": [
+          {
+            "userApiKey": []
+          }
+        ],
+        "description": "Get the count of outgoing messages grouped by a specified entity (agent, team, inbox, or label).\nWhen grouped by agent, messages sent by bots (AgentBot, Captain::Assistant) are excluded.\n\n**Note:** This API endpoint is available only in Chatwoot version 4.11.0 and above.\n",
+        "parameters": [
+          {
+            "in": "query",
+            "name": "group_by",
+            "required": true,
+            "schema": {
+              "type": "string",
+              "enum": [
+                "agent",
+                "team",
+                "inbox",
+                "label"
+              ]
+            },
+            "description": "The entity to group outgoing message counts by."
+          }
+        ],
+        "responses": {
+          "200": {
+            "description": "Success",
+            "content": {
+              "application/json": {
+                "schema": {
+                  "$ref": "#/components/schemas/outgoing_messages_count"
+                }
+              }
+            }
+          },
+          "403": {
+            "description": "Access denied",
+            "content": {
+              "application/json": {
+                "schema": {
+                  "$ref": "#/components/schemas/bad_request_error"
+                }
+              }
+            }
+          }
+        }
+      }
+    },
     "/accounts/{account_id}/conversations/{conversation_id}/messages": {
       "parameters": [
         {
@@ -11781,6 +12184,335 @@
           }
         }
       },
+      "first_response_time_distribution": {
+        "type": "object",
+        "description": "First response time distribution report grouped by channel type. Shows the count of conversations with first response times in different time buckets.",
+        "additionalProperties": {
+          "type": "object",
+          "description": "First response time distribution for a specific channel type (e.g., Channel::WebWidget, Channel::Api)",
+          "properties": {
+            "0-1h": {
+              "type": "number",
+              "description": "Number of conversations with first response time less than 1 hour"
+            },
+            "1-4h": {
+              "type": "number",
+              "description": "Number of conversations with first response time between 1-4 hours"
+            },
+            "4-8h": {
+              "type": "number",
+              "description": "Number of conversations with first response time between 4-8 hours"
+            },
+            "8-24h": {
+              "type": "number",
+              "description": "Number of conversations with first response time between 8-24 hours"
+            },
+            "24h+": {
+              "type": "number",
+              "description": "Number of conversations with first response time greater than 24 hours"
+            }
+          }
+        },
+        "example": {
+          "Channel::WebWidget": {
+            "0-1h": 150,
+            "1-4h": 80,
+            "4-8h": 45,
+            "8-24h": 30,
+            "24h+": 15
+          },
+          "Channel::Api": {
+            "0-1h": 75,
+            "1-4h": 40,
+            "4-8h": 20,
+            "8-24h": 10,
+            "24h+": 5
+          }
+        }
+      },
+      "inbox_label_matrix": {
+        "type": "object",
+        "description": "Inbox-label matrix report showing the count of conversations for each inbox-label combination.",
+        "properties": {
+          "inboxes": {
+            "type": "array",
+            "description": "List of inboxes included in the report",
+            "items": {
+              "type": "object",
+              "properties": {
+                "id": {
+                  "type": "number",
+                  "description": "The inbox ID"
+                },
+                "name": {
+                  "type": "string",
+                  "description": "The inbox name"
+                }
+              }
+            }
+          },
+          "labels": {
+            "type": "array",
+            "description": "List of labels included in the report",
+            "items": {
+              "type": "object",
+              "properties": {
+                "id": {
+                  "type": "number",
+                  "description": "The label ID"
+                },
+                "title": {
+                  "type": "string",
+                  "description": "The label title"
+                }
+              }
+            }
+          },
+          "matrix": {
+            "type": "array",
+            "description": "2D array where matrix[i][j] represents the count of conversations in inboxes[i] with labels[j]",
+            "items": {
+              "type": "array",
+              "items": {
+                "type": "number"
+              }
+            }
+          }
+        },
+        "example": {
+          "inboxes": [
+            {
+              "id": 1,
+              "name": "Website Chat"
+            },
+            {
+              "id": 2,
+              "name": "Email Support"
+            }
+          ],
+          "labels": [
+            {
+              "id": 1,
+              "title": "bug"
+            },
+            {
+              "id": 2,
+              "title": "feature-request"
+            },
+            {
+              "id": 3,
+              "title": "urgent"
+            }
+          ],
+          "matrix": [
+            [
+              10,
+              5,
+              3
+            ],
+            [
+              8,
+              12,
+              2
+            ]
+          ]
+        }
+      },
+      "outgoing_messages_count": {
+        "type": "array",
+        "description": "Outgoing messages count report grouped by entity (agent, team, inbox, or label).",
+        "items": {
+          "type": "object",
+          "properties": {
+            "id": {
+              "type": "number",
+              "description": "The ID of the grouped entity (agent, team, inbox, or label)."
+            },
+            "name": {
+              "type": "string",
+              "description": "The name of the grouped entity."
+            },
+            "outgoing_messages_count": {
+              "type": "number",
+              "description": "The total number of outgoing messages for this entity in the given time range."
+            }
+          }
+        },
+        "example": [
+          {
+            "id": 1,
+            "name": "Agent One",
+            "outgoing_messages_count": 42
+          },
+          {
+            "id": 2,
+            "name": "Agent Two",
+            "outgoing_messages_count": 18
+          }
+        ]
+      },
+      "inbox_summary": {
+        "type": "array",
+        "description": "Inbox summary report containing conversation statistics grouped by inbox.",
+        "items": {
+          "type": "object",
+          "properties": {
+            "id": {
+              "type": "number",
+              "description": "The inbox ID"
+            },
+            "conversations_count": {
+              "type": "number",
+              "description": "Number of conversations created in the inbox during the date range"
+            },
+            "resolved_conversations_count": {
+              "type": "number",
+              "description": "Number of conversations resolved in the inbox during the date range"
+            },
+            "avg_resolution_time": {
+              "type": "number",
+              "nullable": true,
+              "description": "Average time (in seconds) to resolve conversations. Null if no data available."
+            },
+            "avg_first_response_time": {
+              "type": "number",
+              "nullable": true,
+              "description": "Average time (in seconds) for the first response. Null if no data available."
+            },
+            "avg_reply_time": {
+              "type": "number",
+              "nullable": true,
+              "description": "Average time (in seconds) between replies. Null if no data available."
+            }
+          }
+        },
+        "example": [
+          {
+            "id": 1,
+            "conversations_count": 150,
+            "resolved_conversations_count": 120,
+            "avg_resolution_time": 3600,
+            "avg_first_response_time": 300,
+            "avg_reply_time": 600
+          },
+          {
+            "id": 2,
+            "conversations_count": 75,
+            "resolved_conversations_count": 60,
+            "avg_resolution_time": 1800,
+            "avg_first_response_time": 180,
+            "avg_reply_time": 420
+          }
+        ]
+      },
+      "agent_summary": {
+        "type": "array",
+        "description": "Agent summary report containing conversation statistics grouped by agent.",
+        "items": {
+          "type": "object",
+          "properties": {
+            "id": {
+              "type": "number",
+              "description": "The agent (user) ID"
+            },
+            "conversations_count": {
+              "type": "number",
+              "description": "Number of conversations assigned to the agent during the date range"
+            },
+            "resolved_conversations_count": {
+              "type": "number",
+              "description": "Number of conversations resolved by the agent during the date range"
+            },
+            "avg_resolution_time": {
+              "type": "number",
+              "nullable": true,
+              "description": "Average time (in seconds) to resolve conversations. Null if no data available."
+            },
+            "avg_first_response_time": {
+              "type": "number",
+              "nullable": true,
+              "description": "Average time (in seconds) for the first response. Null if no data available."
+            },
+            "avg_reply_time": {
+              "type": "number",
+              "nullable": true,
+              "description": "Average time (in seconds) between replies. Null if no data available."
+            }
+          }
+        },
+        "example": [
+          {
+            "id": 1,
+            "conversations_count": 150,
+            "resolved_conversations_count": 120,
+            "avg_resolution_time": 3600,
+            "avg_first_response_time": 300,
+            "avg_reply_time": 600
+          },
+          {
+            "id": 2,
+            "conversations_count": 75,
+            "resolved_conversations_count": 60,
+            "avg_resolution_time": 1800,
+            "avg_first_response_time": 180,
+            "avg_reply_time": 420
+          }
+        ]
+      },
+      "team_summary": {
+        "type": "array",
+        "description": "Team summary report containing conversation statistics grouped by team.",
+        "items": {
+          "type": "object",
+          "properties": {
+            "id": {
+              "type": "number",
+              "description": "The team ID"
+            },
+            "conversations_count": {
+              "type": "number",
+              "description": "Number of conversations assigned to the team during the date range"
+            },
+            "resolved_conversations_count": {
+              "type": "number",
+              "description": "Number of conversations resolved by the team during the date range"
+            },
+            "avg_resolution_time": {
+              "type": "number",
+              "nullable": true,
+              "description": "Average time (in seconds) to resolve conversations. Null if no data available."
+            },
+            "avg_first_response_time": {
+              "type": "number",
+              "nullable": true,
+              "description": "Average time (in seconds) for the first response. Null if no data available."
+            },
+            "avg_reply_time": {
+              "type": "number",
+              "nullable": true,
+              "description": "Average time (in seconds) between replies. Null if no data available."
+            }
+          }
+        },
+        "example": [
+          {
+            "id": 1,
+            "conversations_count": 250,
+            "resolved_conversations_count": 200,
+            "avg_resolution_time": 2800,
+            "avg_first_response_time": 240,
+            "avg_reply_time": 500
+          },
+          {
+            "id": 2,
+            "conversations_count": 180,
+            "resolved_conversations_count": 150,
+            "avg_resolution_time": 2400,
+            "avg_first_response_time": 200,
+            "avg_reply_time": 450
+          }
+        ]
+      },
       "contact_detail": {
         "type": "object",
         "properties": {

swagger/tag_groups/application_swagger.json

@@ -6433,14 +6433,6 @@
             "type": "string"
           },
           "description": "The timestamp from where report should stop (Unix timestamp)."
-        },
-        {
-          "in": "query",
-          "name": "business_hours",
-          "schema": {
-            "type": "boolean"
-          },
-          "description": "Whether to filter by business hours."
         }
       ],
       "get": {
@@ -6488,6 +6480,417 @@
           }
         }
       }
+    },
+    "/api/v2/accounts/{account_id}/summary_reports/inbox": {
+      "parameters": [
+        {
+          "$ref": "#/components/parameters/account_id"
+        },
+        {
+          "in": "query",
+          "name": "since",
+          "schema": {
+            "type": "string"
+          },
+          "description": "The timestamp from where report should start (Unix timestamp)."
+        },
+        {
+          "in": "query",
+          "name": "until",
+          "schema": {
+            "type": "string"
+          },
+          "description": "The timestamp from where report should stop (Unix timestamp)."
+        },
+        {
+          "in": "query",
+          "name": "business_hours",
+          "schema": {
+            "type": "boolean"
+          },
+          "description": "Whether to calculate metrics using business hours only."
+        }
+      ],
+      "get": {
+        "tags": [
+          "Reports"
+        ],
+        "operationId": "get-inbox-summary-report",
+        "summary": "Get conversation statistics grouped by inbox",
+        "security": [
+          {
+            "userApiKey": []
+          }
+        ],
+        "description": "Get conversation statistics grouped by inbox for a given date range.\nReturns metrics for each inbox including conversation counts, resolution counts,\naverage first response time, average resolution time, and average reply time.\n",
+        "responses": {
+          "200": {
+            "description": "Success",
+            "content": {
+              "application/json": {
+                "schema": {
+                  "$ref": "#/components/schemas/inbox_summary"
+                }
+              }
+            }
+          },
+          "403": {
+            "description": "Access denied",
+            "content": {
+              "application/json": {
+                "schema": {
+                  "$ref": "#/components/schemas/bad_request_error"
+                }
+              }
+            }
+          }
+        }
+      }
+    },
+    "/api/v2/accounts/{account_id}/summary_reports/agent": {
+      "parameters": [
+        {
+          "$ref": "#/components/parameters/account_id"
+        },
+        {
+          "in": "query",
+          "name": "since",
+          "schema": {
+            "type": "string"
+          },
+          "description": "The timestamp from where report should start (Unix timestamp)."
+        },
+        {
+          "in": "query",
+          "name": "until",
+          "schema": {
+            "type": "string"
+          },
+          "description": "The timestamp from where report should stop (Unix timestamp)."
+        },
+        {
+          "in": "query",
+          "name": "business_hours",
+          "schema": {
+            "type": "boolean"
+          },
+          "description": "Whether to calculate metrics using business hours only."
+        }
+      ],
+      "get": {
+        "tags": [
+          "Reports"
+        ],
+        "operationId": "get-agent-summary-report",
+        "summary": "Get conversation statistics grouped by agent",
+        "security": [
+          {
+            "userApiKey": []
+          }
+        ],
+        "description": "Get conversation statistics grouped by agent for a given date range.\nReturns metrics for each agent including conversation counts, resolution counts,\naverage first response time, average resolution time, and average reply time.\n",
+        "responses": {
+          "200": {
+            "description": "Success",
+            "content": {
+              "application/json": {
+                "schema": {
+                  "$ref": "#/components/schemas/agent_summary"
+                }
+              }
+            }
+          },
+          "403": {
+            "description": "Access denied",
+            "content": {
+              "application/json": {
+                "schema": {
+                  "$ref": "#/components/schemas/bad_request_error"
+                }
+              }
+            }
+          }
+        }
+      }
+    },
+    "/api/v2/accounts/{account_id}/summary_reports/team": {
+      "parameters": [
+        {
+          "$ref": "#/components/parameters/account_id"
+        },
+        {
+          "in": "query",
+          "name": "since",
+          "schema": {
+            "type": "string"
+          },
+          "description": "The timestamp from where report should start (Unix timestamp)."
+        },
+        {
+          "in": "query",
+          "name": "until",
+          "schema": {
+            "type": "string"
+          },
+          "description": "The timestamp from where report should stop (Unix timestamp)."
+        },
+        {
+          "in": "query",
+          "name": "business_hours",
+          "schema": {
+            "type": "boolean"
+          },
+          "description": "Whether to calculate metrics using business hours only."
+        }
+      ],
+      "get": {
+        "tags": [
+          "Reports"
+        ],
+        "operationId": "get-team-summary-report",
+        "summary": "Get conversation statistics grouped by team",
+        "security": [
+          {
+            "userApiKey": []
+          }
+        ],
+        "description": "Get conversation statistics grouped by team for a given date range.\nReturns metrics for each team including conversation counts, resolution counts,\naverage first response time, average resolution time, and average reply time.\n",
+        "responses": {
+          "200": {
+            "description": "Success",
+            "content": {
+              "application/json": {
+                "schema": {
+                  "$ref": "#/components/schemas/team_summary"
+                }
+              }
+            }
+          },
+          "403": {
+            "description": "Access denied",
+            "content": {
+              "application/json": {
+                "schema": {
+                  "$ref": "#/components/schemas/bad_request_error"
+                }
+              }
+            }
+          }
+        }
+      }
+    },
+    "/api/v2/accounts/{account_id}/reports/first_response_time_distribution": {
+      "parameters": [
+        {
+          "$ref": "#/components/parameters/account_id"
+        },
+        {
+          "in": "query",
+          "name": "since",
+          "schema": {
+            "type": "string"
+          },
+          "description": "The timestamp from where report should start (Unix timestamp)."
+        },
+        {
+          "in": "query",
+          "name": "until",
+          "schema": {
+            "type": "string"
+          },
+          "description": "The timestamp from where report should stop (Unix timestamp)."
+        }
+      ],
+      "get": {
+        "tags": [
+          "Reports"
+        ],
+        "operationId": "get-first-response-time-distribution",
+        "summary": "Get first response time distribution by channel",
+        "security": [
+          {
+            "userApiKey": []
+          }
+        ],
+        "description": "Get the distribution of first response times grouped by channel type.\nReturns conversation counts in different time buckets (0-1h, 1-4h, 4-8h, 8-24h, 24h+) for each channel type.\n\n**Note:** This API endpoint is available only in Chatwoot version 4.11.0 and above.\n",
+        "responses": {
+          "200": {
+            "description": "Success",
+            "content": {
+              "application/json": {
+                "schema": {
+                  "$ref": "#/components/schemas/first_response_time_distribution"
+                }
+              }
+            }
+          },
+          "403": {
+            "description": "Access denied",
+            "content": {
+              "application/json": {
+                "schema": {
+                  "$ref": "#/components/schemas/bad_request_error"
+                }
+              }
+            }
+          }
+        }
+      }
+    },
+    "/api/v2/accounts/{account_id}/reports/inbox_label_matrix": {
+      "parameters": [
+        {
+          "$ref": "#/components/parameters/account_id"
+        },
+        {
+          "in": "query",
+          "name": "since",
+          "schema": {
+            "type": "string"
+          },
+          "description": "The timestamp from where report should start (Unix timestamp)."
+        },
+        {
+          "in": "query",
+          "name": "until",
+          "schema": {
+            "type": "string"
+          },
+          "description": "The timestamp from where report should stop (Unix timestamp)."
+        },
+        {
+          "in": "query",
+          "name": "inbox_ids",
+          "schema": {
+            "type": "array",
+            "items": {
+              "type": "integer"
+            }
+          },
+          "description": "Filter by specific inbox IDs."
+        },
+        {
+          "in": "query",
+          "name": "label_ids",
+          "schema": {
+            "type": "array",
+            "items": {
+              "type": "integer"
+            }
+          },
+          "description": "Filter by specific label IDs."
+        }
+      ],
+      "get": {
+        "tags": [
+          "Reports"
+        ],
+        "operationId": "get-inbox-label-matrix",
+        "summary": "Get inbox-label matrix report",
+        "security": [
+          {
+            "userApiKey": []
+          }
+        ],
+        "description": "Get a matrix showing the count of conversations for each inbox-label combination.\nReturns a list of inboxes, labels, and a 2D matrix where each cell contains the count of conversations\nin a specific inbox that have a specific label applied.\n\n**Note:** This API endpoint is available only in Chatwoot version 4.11.0 and above.\n",
+        "responses": {
+          "200": {
+            "description": "Success",
+            "content": {
+              "application/json": {
+                "schema": {
+                  "$ref": "#/components/schemas/inbox_label_matrix"
+                }
+              }
+            }
+          },
+          "403": {
+            "description": "Access denied",
+            "content": {
+              "application/json": {
+                "schema": {
+                  "$ref": "#/components/schemas/bad_request_error"
+                }
+              }
+            }
+          }
+        }
+      }
+    },
+    "/api/v2/accounts/{account_id}/reports/outgoing_messages_count": {
+      "parameters": [
+        {
+          "$ref": "#/components/parameters/account_id"
+        },
+        {
+          "in": "query",
+          "name": "since",
+          "schema": {
+            "type": "string"
+          },
+          "description": "The timestamp from where report should start (Unix timestamp)."
+        },
+        {
+          "in": "query",
+          "name": "until",
+          "schema": {
+            "type": "string"
+          },
+          "description": "The timestamp from where report should stop (Unix timestamp)."
+        }
+      ],
+      "get": {
+        "tags": [
+          "Reports"
+        ],
+        "operationId": "get-outgoing-messages-count",
+        "summary": "Get outgoing messages count grouped by entity",
+        "security": [
+          {
+            "userApiKey": []
+          }
+        ],
+        "description": "Get the count of outgoing messages grouped by a specified entity (agent, team, inbox, or label).\nWhen grouped by agent, messages sent by bots (AgentBot, Captain::Assistant) are excluded.\n\n**Note:** This API endpoint is available only in Chatwoot version 4.11.0 and above.\n",
+        "parameters": [
+          {
+            "in": "query",
+            "name": "group_by",
+            "required": true,
+            "schema": {
+              "type": "string",
+              "enum": [
+                "agent",
+                "team",
+                "inbox",
+                "label"
+              ]
+            },
+            "description": "The entity to group outgoing message counts by."
+          }
+        ],
+        "responses": {
+          "200": {
+            "description": "Success",
+            "content": {
+              "application/json": {
+                "schema": {
+                  "$ref": "#/components/schemas/outgoing_messages_count"
+                }
+              }
+            }
+          },
+          "403": {
+            "description": "Access denied",
+            "content": {
+              "application/json": {
+                "schema": {
+                  "$ref": "#/components/schemas/bad_request_error"
+                }
+              }
+            }
+          }
+        }
+      }
     }
   },
   "components": {
@@ -10288,6 +10691,335 @@
           }
         }
       },
+      "first_response_time_distribution": {
+        "type": "object",
+        "description": "First response time distribution report grouped by channel type. Shows the count of conversations with first response times in different time buckets.",
+        "additionalProperties": {
+          "type": "object",
+          "description": "First response time distribution for a specific channel type (e.g., Channel::WebWidget, Channel::Api)",
+          "properties": {
+            "0-1h": {
+              "type": "number",
+              "description": "Number of conversations with first response time less than 1 hour"
+            },
+            "1-4h": {
+              "type": "number",
+              "description": "Number of conversations with first response time between 1-4 hours"
+            },
+            "4-8h": {
+              "type": "number",
+              "description": "Number of conversations with first response time between 4-8 hours"
+            },
+            "8-24h": {
+              "type": "number",
+              "description": "Number of conversations with first response time between 8-24 hours"
+            },
+            "24h+": {
+              "type": "number",
+              "description": "Number of conversations with first response time greater than 24 hours"
+            }
+          }
+        },
+        "example": {
+          "Channel::WebWidget": {
+            "0-1h": 150,
+            "1-4h": 80,
+            "4-8h": 45,
+            "8-24h": 30,
+            "24h+": 15
+          },
+          "Channel::Api": {
+            "0-1h": 75,
+            "1-4h": 40,
+            "4-8h": 20,
+            "8-24h": 10,
+            "24h+": 5
+          }
+        }
+      },
+      "inbox_label_matrix": {
+        "type": "object",
+        "description": "Inbox-label matrix report showing the count of conversations for each inbox-label combination.",
+        "properties": {
+          "inboxes": {
+            "type": "array",
+            "description": "List of inboxes included in the report",
+            "items": {
+              "type": "object",
+              "properties": {
+                "id": {
+                  "type": "number",
+                  "description": "The inbox ID"
+                },
+                "name": {
+                  "type": "string",
+                  "description": "The inbox name"
+                }
+              }
+            }
+          },
+          "labels": {
+            "type": "array",
+            "description": "List of labels included in the report",
+            "items": {
+              "type": "object",
+              "properties": {
+                "id": {
+                  "type": "number",
+                  "description": "The label ID"
+                },
+                "title": {
+                  "type": "string",
+                  "description": "The label title"
+                }
+              }
+            }
+          },
+          "matrix": {
+            "type": "array",
+            "description": "2D array where matrix[i][j] represents the count of conversations in inboxes[i] with labels[j]",
+            "items": {
+              "type": "array",
+              "items": {
+                "type": "number"
+              }
+            }
+          }
+        },
+        "example": {
+          "inboxes": [
+            {
+              "id": 1,
+              "name": "Website Chat"
+            },
+            {
+              "id": 2,
+              "name": "Email Support"
+            }
+          ],
+          "labels": [
+            {
+              "id": 1,
+              "title": "bug"
+            },
+            {
+              "id": 2,
+              "title": "feature-request"
+            },
+            {
+              "id": 3,
+              "title": "urgent"
+            }
+          ],
+          "matrix": [
+            [
+              10,
+              5,
+              3
+            ],
+            [
+              8,
+              12,
+              2
+            ]
+          ]
+        }
+      },
+      "outgoing_messages_count": {
+        "type": "array",
+        "description": "Outgoing messages count report grouped by entity (agent, team, inbox, or label).",
+        "items": {
+          "type": "object",
+          "properties": {
+            "id": {
+              "type": "number",
+              "description": "The ID of the grouped entity (agent, team, inbox, or label)."
+            },
+            "name": {
+              "type": "string",
+              "description": "The name of the grouped entity."
+            },
+            "outgoing_messages_count": {
+              "type": "number",
+              "description": "The total number of outgoing messages for this entity in the given time range."
+            }
+          }
+        },
+        "example": [
+          {
+            "id": 1,
+            "name": "Agent One",
+            "outgoing_messages_count": 42
+          },
+          {
+            "id": 2,
+            "name": "Agent Two",
+            "outgoing_messages_count": 18
+          }
+        ]
+      },
+      "inbox_summary": {
+        "type": "array",
+        "description": "Inbox summary report containing conversation statistics grouped by inbox.",
+        "items": {
+          "type": "object",
+          "properties": {
+            "id": {
+              "type": "number",
+              "description": "The inbox ID"
+            },
+            "conversations_count": {
+              "type": "number",
+              "description": "Number of conversations created in the inbox during the date range"
+            },
+            "resolved_conversations_count": {
+              "type": "number",
+              "description": "Number of conversations resolved in the inbox during the date range"
+            },
+            "avg_resolution_time": {
+              "type": "number",
+              "nullable": true,
+              "description": "Average time (in seconds) to resolve conversations. Null if no data available."
+            },
+            "avg_first_response_time": {
+              "type": "number",
+              "nullable": true,
+              "description": "Average time (in seconds) for the first response. Null if no data available."
+            },
+            "avg_reply_time": {
+              "type": "number",
+              "nullable": true,
+              "description": "Average time (in seconds) between replies. Null if no data available."
+            }
+          }
+        },
+        "example": [
+          {
+            "id": 1,
+            "conversations_count": 150,
+            "resolved_conversations_count": 120,
+            "avg_resolution_time": 3600,
+            "avg_first_response_time": 300,
+            "avg_reply_time": 600
+          },
+          {
+            "id": 2,
+            "conversations_count": 75,
+            "resolved_conversations_count": 60,
+            "avg_resolution_time": 1800,
+            "avg_first_response_time": 180,
+            "avg_reply_time": 420
+          }
+        ]
+      },
+      "agent_summary": {
+        "type": "array",
+        "description": "Agent summary report containing conversation statistics grouped by agent.",
+        "items": {
+          "type": "object",
+          "properties": {
+            "id": {
+              "type": "number",
+              "description": "The agent (user) ID"
+            },
+            "conversations_count": {
+              "type": "number",
+              "description": "Number of conversations assigned to the agent during the date range"
+            },
+            "resolved_conversations_count": {
+              "type": "number",
+              "description": "Number of conversations resolved by the agent during the date range"
+            },
+            "avg_resolution_time": {
+              "type": "number",
+              "nullable": true,
+              "description": "Average time (in seconds) to resolve conversations. Null if no data available."
+            },
+            "avg_first_response_time": {
+              "type": "number",
+              "nullable": true,
+              "description": "Average time (in seconds) for the first response. Null if no data available."
+            },
+            "avg_reply_time": {
+              "type": "number",
+              "nullable": true,
+              "description": "Average time (in seconds) between replies. Null if no data available."
+            }
+          }
+        },
+        "example": [
+          {
+            "id": 1,
+            "conversations_count": 150,
+            "resolved_conversations_count": 120,
+            "avg_resolution_time": 3600,
+            "avg_first_response_time": 300,
+            "avg_reply_time": 600
+          },
+          {
+            "id": 2,
+            "conversations_count": 75,
+            "resolved_conversations_count": 60,
+            "avg_resolution_time": 1800,
+            "avg_first_response_time": 180,
+            "avg_reply_time": 420
+          }
+        ]
+      },
+      "team_summary": {
+        "type": "array",
+        "description": "Team summary report containing conversation statistics grouped by team.",
+        "items": {
+          "type": "object",
+          "properties": {
+            "id": {
+              "type": "number",
+              "description": "The team ID"
+            },
+            "conversations_count": {
+              "type": "number",
+              "description": "Number of conversations assigned to the team during the date range"
+            },
+            "resolved_conversations_count": {
+              "type": "number",
+              "description": "Number of conversations resolved by the team during the date range"
+            },
+            "avg_resolution_time": {
+              "type": "number",
+              "nullable": true,
+              "description": "Average time (in seconds) to resolve conversations. Null if no data available."
+            },
+            "avg_first_response_time": {
+              "type": "number",
+              "nullable": true,
+              "description": "Average time (in seconds) for the first response. Null if no data available."
+            },
+            "avg_reply_time": {
+              "type": "number",
+              "nullable": true,
+              "description": "Average time (in seconds) between replies. Null if no data available."
+            }
+          }
+        },
+        "example": [
+          {
+            "id": 1,
+            "conversations_count": 250,
+            "resolved_conversations_count": 200,
+            "avg_resolution_time": 2800,
+            "avg_first_response_time": 240,
+            "avg_reply_time": 500
+          },
+          {
+            "id": 2,
+            "conversations_count": 180,
+            "resolved_conversations_count": 150,
+            "avg_resolution_time": 2400,
+            "avg_first_response_time": 200,
+            "avg_reply_time": 450
+          }
+        ]
+      },
       "contact_detail": {
         "type": "object",
         "properties": {