diff --git a/app/javascript/dashboard/api/slaReports.js b/app/javascript/dashboard/api/slaReports.js
index c187c58a3..36a3a895c 100644
--- a/app/javascript/dashboard/api/slaReports.js
+++ b/app/javascript/dashboard/api/slaReports.js
@@ -13,6 +13,7 @@ class SLAReportsAPI extends ApiClient {
     inbox_id,
     team_id,
     sla_policy_id,
+    label_list,
     page,
   } = {}) {
     return axios.get(this.url, {
@@ -23,6 +24,7 @@ class SLAReportsAPI extends ApiClient {
         inbox_id,
         team_id,
         sla_policy_id,
+        label_list,
         page,
       },
     });
@@ -54,6 +56,7 @@ class SLAReportsAPI extends ApiClient {
     assigned_agent_id,
     inbox_id,
     team_id,
+    label_list,
     sla_policy_id,
   } = {}) {
     return axios.get(`${this.url}/metrics`, {
@@ -62,6 +65,7 @@ class SLAReportsAPI extends ApiClient {
         until: to,
         assigned_agent_id,
         inbox_id,
+        label_list,
         team_id,
         sla_policy_id,
       },
diff --git a/app/javascript/dashboard/api/specs/slaReports.spec.js b/app/javascript/dashboard/api/specs/slaReports.spec.js
index 51ac8bfe4..e69f527b2 100644
--- a/app/javascript/dashboard/api/specs/slaReports.spec.js
+++ b/app/javascript/dashboard/api/specs/slaReports.spec.js
@@ -35,6 +35,7 @@ describe('#SLAReports API', () => {
         inbox_id: 1,
         team_id: 1,
         sla_policy_id: 1,
+        label_list: ['label1'],
       });
       expect(axiosMock.get).toHaveBeenCalledWith('/api/v1/applied_slas', {
         params: {
@@ -45,6 +46,7 @@ describe('#SLAReports API', () => {
           inbox_id: 1,
           team_id: 1,
           sla_policy_id: 1,
+          label_list: ['label1'],
         },
       });
     });
@@ -56,6 +58,7 @@ describe('#SLAReports API', () => {
         inbox_id: 1,
         team_id: 1,
         sla_policy_id: 1,
+        label_list: ['label1'],
       });
       expect(axiosMock.get).toHaveBeenCalledWith(
         '/api/v1/applied_slas/metrics',
@@ -67,6 +70,7 @@ describe('#SLAReports API', () => {
             inbox_id: 1,
             team_id: 1,
             sla_policy_id: 1,
+            label_list: ['label1'],
           },
         }
       );
diff --git a/app/javascript/dashboard/assets/scss/_date-picker.scss b/app/javascript/dashboard/assets/scss/_date-picker.scss
index 2132d5fd5..60c24b421 100644
--- a/app/javascript/dashboard/assets/scss/_date-picker.scss
+++ b/app/javascript/dashboard/assets/scss/_date-picker.scss
@@ -1,6 +1,13 @@
 @import '~vue2-datepicker/scss/index';
 
 .date-picker {
+  // To be removed one SLA reports date picker is created
+  &.small {
+    .mx-input {
+      @apply h-8 text-sm;
+    }
+  }
+
   &.no-margin {
     .mx-input {
       @apply mb-0;
diff --git a/app/javascript/dashboard/assets/scss/plugins/_multiselect.scss b/app/javascript/dashboard/assets/scss/plugins/_multiselect.scss
index 9170715e0..99b006045 100644
--- a/app/javascript/dashboard/assets/scss/plugins/_multiselect.scss
+++ b/app/javascript/dashboard/assets/scss/plugins/_multiselect.scss
@@ -153,6 +153,29 @@
 }
 
 .multiselect-wrap--small {
+  // To be removed one SLA reports date picker is created
+  &.tiny {
+    .multiselect.no-margin {
+      @apply min-h-[32px];
+    }
+
+    .multiselect__select {
+      @apply min-h-[32px] h-8;
+
+      &::before {
+        @apply top-[60%];
+      }
+    }
+
+    .multiselect__tags {
+      @apply min-h-[32px] max-h-[32px];
+
+      .multiselect__single {
+        @apply pt-1 pb-1;
+      }
+    }
+  }
+
   .multiselect__tags,
   .multiselect__input,
   .multiselect {
diff --git a/app/javascript/dashboard/components/widgets/TableFooterPagination.vue b/app/javascript/dashboard/components/widgets/TableFooterPagination.vue
index c048b2eb7..38ebdc69c 100644
--- a/app/javascript/dashboard/components/widgets/TableFooterPagination.vue
+++ b/app/javascript/dashboard/components/widgets/TableFooterPagination.vue
@@ -82,7 +82,7 @@
 </template>
 
 <script setup>
-import { computed, defineEmits } from 'vue';
+import { computed } from 'vue';
 
 // Props
 const props = defineProps({
diff --git a/app/javascript/dashboard/components/widgets/conversation/components/SLACardLabel.vue b/app/javascript/dashboard/components/widgets/conversation/components/SLACardLabel.vue
index e5514910c..bdffc7e78 100644
--- a/app/javascript/dashboard/components/widgets/conversation/components/SLACardLabel.vue
+++ b/app/javascript/dashboard/components/widgets/conversation/components/SLACardLabel.vue
@@ -5,10 +5,10 @@
     :class="showExtendedInfo ? 'h-[26px] rounded-lg' : 'rounded h-5'"
   >
     <div
+      v-on-clickaway="closeSlaPopover"
       class="flex items-center w-full truncate"
       :class="showExtendedInfo ? 'px-1.5' : 'px-2 gap-1'"
       @mouseover="openSlaPopover()"
-      @mouseleave="closeSlaPopover()"
     >
       <div
         class="flex items-center gap-1"
@@ -42,7 +42,7 @@
     </div>
     <SLA-popover-card
       v-if="showSlaPopoverCard"
-      :all-missed-slas="slaEvents"
+      :sla-missed-events="slaEvents"
       class="right-0 top-7"
     />
   </div>
@@ -51,6 +51,7 @@
 <script>
 import { evaluateSLAStatus } from '../helpers/SLAHelper';
 import SLAPopoverCard from './SLAPopoverCard.vue';
+import { mixin as clickaway } from 'vue-clickaway';
 
 const REFRESH_INTERVAL = 60000;
 
@@ -58,6 +59,7 @@ export default {
   components: {
     SLAPopoverCard,
   },
+  mixins: [clickaway],
   props: {
     chat: {
       type: Object,
diff --git a/app/javascript/dashboard/components/widgets/conversation/components/SLAEventItem.vue b/app/javascript/dashboard/components/widgets/conversation/components/SLAEventItem.vue
new file mode 100644
index 000000000..3affa52c8
--- /dev/null
+++ b/app/javascript/dashboard/components/widgets/conversation/components/SLAEventItem.vue
@@ -0,0 +1,35 @@
+<script setup>
+import { format, fromUnixTime } from 'date-fns';
+
+defineProps({
+  label: {
+    type: String,
+    required: true,
+  },
+  items: {
+    type: Array,
+    required: true,
+  },
+});
+const formatDate = timestamp =>
+  format(fromUnixTime(timestamp), 'MMM dd, yyyy, hh:mm a');
+</script>
+<template>
+  <div class="flex justify-between w-full">
+    <span
+      class="text-sm sticky top-0 h-fit font-normal tracking-[-0.6%] min-w-[140px] truncate text-slate-600 dark:text-slate-200"
+    >
+      {{ label }}
+    </span>
+    <div class="flex flex-col w-full gap-2">
+      <span
+        v-for="item in items"
+        :key="item.id"
+        class="text-sm font-normal text-slate-900 dark:text-slate-25 text-right tabular-nums"
+      >
+        {{ formatDate(item.created_at) }}
+      </span>
+      <slot name="showMore" />
+    </div>
+  </div>
+</template>
diff --git a/app/javascript/dashboard/components/widgets/conversation/components/SLAPopoverCard.vue b/app/javascript/dashboard/components/widgets/conversation/components/SLAPopoverCard.vue
index 0b457cb9a..479e2794f 100644
--- a/app/javascript/dashboard/components/widgets/conversation/components/SLAPopoverCard.vue
+++ b/app/javascript/dashboard/components/widgets/conversation/components/SLAPopoverCard.vue
@@ -1,45 +1,85 @@
 <script setup>
-import { format, fromUnixTime } from 'date-fns';
+import { ref, computed } from 'vue';
 
-defineProps({
-  allMissedSlas: {
+import wootConstants from 'dashboard/constants/globals';
+import SLAEventItem from './SLAEventItem.vue';
+
+const { SLA_MISS_TYPES } = wootConstants;
+
+const props = defineProps({
+  slaMissedEvents: {
     type: Array,
-    default: () => [],
+    required: true,
   },
 });
 
-const formatDate = timestamp => format(fromUnixTime(timestamp), 'PP');
+const shouldShowAllNrts = ref(false);
 
-const upperCase = str => str.toUpperCase();
+const frtMisses = computed(() =>
+  props.slaMissedEvents.filter(
+    slaEvent => slaEvent.event_type === SLA_MISS_TYPES.FRT
+  )
+);
+const nrtMisses = computed(() => {
+  const missedEvents = props.slaMissedEvents.filter(
+    slaEvent => slaEvent.event_type === SLA_MISS_TYPES.NRT
+  );
+  return shouldShowAllNrts.value ? missedEvents : missedEvents.slice(0, 6);
+});
+const rtMisses = computed(() =>
+  props.slaMissedEvents.filter(
+    slaEvent => slaEvent.event_type === SLA_MISS_TYPES.RT
+  )
+);
+
+const shouldShowMoreNRTButton = computed(() => nrtMisses.value.length > 6);
+const toggleShowAllNRT = () => {
+  shouldShowAllNrts.value = !shouldShowAllNrts.value;
+};
 </script>
 <template>
   <div
-    class="absolute flex flex-col items-start bg-[#fdfdfd] dark:bg-slate-800 z-50 p-4 border border-solid border-slate-75 dark:border-slate-700 w-[384px] rounded-xl gap-4"
+    class="absolute flex flex-col items-start bg-[#fdfdfd] dark:bg-slate-800 z-50 p-4 border border-solid border-slate-75 dark:border-slate-700 w-[384px] rounded-xl gap-4 max-h-96 overflow-auto"
   >
-    <div
-      v-for="missedSLA in allMissedSlas"
-      :key="missedSLA.id"
-      class="flex items-center justify-between w-full"
+    <span class="text-sm font-medium text-slate-900 dark:text-slate-25">
+      {{ $t('SLA.EVENTS.TITLE') }}
+    </span>
+    <SLA-event-item
+      v-if="frtMisses.length"
+      :label="$t('SLA.EVENTS.FRT')"
+      :items="frtMisses"
+    />
+    <SLA-event-item
+      v-if="nrtMisses.length"
+      :label="$t('SLA.EVENTS.NRT')"
+      :items="nrtMisses"
     >
-      <span
-        class="text-sm font-normal tracking-[-0.6%] w-[140px] truncate text-slate-900 dark:text-slate-50"
-      >
-        {{
-          $t(
-            `CONVERSATION.HEADER.SLA_POPOVER.${upperCase(missedSLA.event_type)}`
-          )
-        }}
-      </span>
-      <span
-        class="text-sm font-normal tracking-[-0.6%] text-slate-600 dark:text-slate-200"
-      >
-        {{ $t('CONVERSATION.HEADER.SLA_POPOVER.MISSED') }}
-      </span>
-      <span
-        class="text-sm font-normal tracking-[-0.6%] text-slate-900 dark:text-slate-50"
-      >
-        {{ formatDate(missedSLA.created_at) }}
-      </span>
-    </div>
+      <template #showMore>
+        <div
+          v-if="shouldShowMoreNRTButton"
+          class="flex flex-col items-end w-full"
+        >
+          <woot-button
+            size="small"
+            :icon="!shouldShowAllNrts ? 'plus-sign' : ''"
+            variant="link"
+            color-scheme="secondary"
+            class="hover:!no-underline !gap-1 hover:!bg-transparent dark:hover:!bg-transparent"
+            @click="toggleShowAllNRT"
+          >
+            {{
+              shouldShowAllNrts
+                ? $t('SLA.EVENTS.HIDE', { count: nrtMisses.length })
+                : $t('SLA.EVENTS.SHOW_MORE', { count: nrtMisses.length })
+            }}
+          </woot-button>
+        </div>
+      </template>
+    </SLA-event-item>
+    <SLA-event-item
+      v-if="rtMisses.length"
+      :label="$t('SLA.EVENTS.RT')"
+      :items="rtMisses"
+    />
   </div>
 </template>
diff --git a/app/javascript/dashboard/constants/globals.js b/app/javascript/dashboard/constants/globals.js
index b8014ce6c..fe28c9d88 100644
--- a/app/javascript/dashboard/constants/globals.js
+++ b/app/javascript/dashboard/constants/globals.js
@@ -59,5 +59,10 @@ export default {
     TYPE: 'type',
     SORT_ORDER: 'sort_order',
   },
+  SLA_MISS_TYPES: {
+    FRT: 'frt',
+    NRT: 'nrt',
+    RT: 'rt',
+  },
 };
 export const DEFAULT_REDIRECT_URL = '/app/';
diff --git a/app/javascript/dashboard/i18n/locale/en/conversation.json b/app/javascript/dashboard/i18n/locale/en/conversation.json
index 42aa7b4a4..d6ea8f83d 100644
--- a/app/javascript/dashboard/i18n/locale/en/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/en/conversation.json
@@ -71,12 +71,6 @@
         "RT": "RT {status}",
         "MISSED": "missed",
         "DUE": "due"
-      },
-      "SLA_POPOVER": {
-        "FRT": "First Response Time",
-        "NRT": "Next Response Time",
-        "RT": "Resolution Time",
-        "MISSED": "missed on"
       }
     },
     "RESOLVE_DROPDOWN": {
diff --git a/app/javascript/dashboard/i18n/locale/en/report.json b/app/javascript/dashboard/i18n/locale/en/report.json
index 7a4bf60ad..172e5501d 100644
--- a/app/javascript/dashboard/i18n/locale/en/report.json
+++ b/app/javascript/dashboard/i18n/locale/en/report.json
@@ -138,7 +138,11 @@
         "groupBy": "Year"
       }
     ],
-    "BUSINESS_HOURS": "Business Hours"
+    "BUSINESS_HOURS": "Business Hours",
+    "FILTER_ACTIONS": {
+      "CLEAR_FILTER": "Clear filter",
+      "EMPTY_LIST": "No results found"
+    }
   },
   "AGENT_REPORTS": {
     "HEADER": "Agents Overview",
@@ -512,6 +516,26 @@
     "LOADING": "Loading SLA data...",
     "DOWNLOAD_SLA_REPORTS": "Download SLA reports",
     "DOWNLOAD_FAILED": "Failed to download SLA Reports",
+    "DROPDOWN": {
+      "ADD_FIlTER": "Add filter",
+      "CLEAR_ALL": "Clear all",
+      "CLEAR_FILTER": "Clear filter",
+      "EMPTY_LIST": "No results found",
+      "NO_FILTER": "No filters available",
+      "SEARCH": "Search filter",
+      "INPUT_PLACEHOLDER": {
+        "SLA": "SLA name",
+        "AGENTS": "Agent name",
+        "INBOXES": "Inbox name",
+        "LABELS": "Label name",
+        "TEAMS": "Team name"
+      },
+      "SLA": "SLA Policy",
+      "INBOXES": "Inbox",
+      "AGENTS": "Agent",
+      "LABELS": "Label",
+      "TEAMS": "Team"
+    },
     "METRICS": {
       "HIT_RATE": {
         "LABEL": "Hit Rate",
diff --git a/app/javascript/dashboard/i18n/locale/en/sla.json b/app/javascript/dashboard/i18n/locale/en/sla.json
index d47e89c05..ce6e3d17e 100644
--- a/app/javascript/dashboard/i18n/locale/en/sla.json
+++ b/app/javascript/dashboard/i18n/locale/en/sla.json
@@ -83,6 +83,14 @@
         "YES": "Yes, Delete ",
         "NO": "No, Keep "
       }
+    },
+    "EVENTS": {
+      "TITLE": "SLA Misses",
+      "FRT": "First response time",
+      "NRT": "Next response time",
+      "RT": "Resolution time",
+      "SHOW_MORE": "{count} more",
+      "HIDE": "Hide {count} rows"
     }
   }
-}
\ No newline at end of file
+}
diff --git a/app/javascript/dashboard/routes/dashboard/settings/reports/SLAReports.vue b/app/javascript/dashboard/routes/dashboard/settings/reports/SLAReports.vue
index 9fe790c97..3c12a4527 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/reports/SLAReports.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/reports/SLAReports.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="flex flex-col flex-1 px-4 pt-4 overflow-auto">
+  <div class="flex flex-col flex-1 gap-6 px-4 pt-4 overflow-auto">
     <SLAReportFilters @filter-change="onFilterChange" />
     <woot-button
       color-scheme="success"
@@ -44,8 +44,15 @@ export default {
   data() {
     return {
       pageNumber: 1,
-      from: 0,
-      to: 0,
+      activeFilter: {
+        from: 0,
+        to: 0,
+        assigned_agent_id: null,
+        inbox_id: null,
+        team_id: null,
+        sla_policy_id: null,
+        label_list: null,
+      },
     };
   },
   computed: {
@@ -57,6 +64,11 @@ export default {
     }),
   },
   mounted() {
+    this.$store.dispatch('agents/get');
+    this.$store.dispatch('inboxes/get');
+    this.$store.dispatch('teams/get');
+    this.$store.dispatch('labels/get');
+    this.$store.dispatch('sla/get');
     this.fetchSLAMetrics();
     this.fetchSLAReports();
   },
@@ -64,22 +76,17 @@ export default {
     fetchSLAReports({ pageNumber } = {}) {
       this.$store.dispatch('slaReports/get', {
         page: pageNumber || this.pageNumber,
-        from: this.from,
-        to: this.to,
+        ...this.activeFilter,
       });
     },
     fetchSLAMetrics() {
-      this.$store.dispatch('slaReports/getMetrics', {
-        from: this.from,
-        to: this.to,
-      });
+      this.$store.dispatch('slaReports/getMetrics', this.activeFilter);
     },
     onPageChange(pageNumber) {
       this.fetchSLAReports({ pageNumber });
     },
-    onFilterChange({ from, to }) {
-      this.from = from;
-      this.to = to;
+    onFilterChange(params) {
+      this.activeFilter = params;
       this.fetchSLAReports();
       this.fetchSLAMetrics();
     },
diff --git a/app/javascript/dashboard/routes/dashboard/settings/reports/components/Filters/v3/ActiveFilterChip.vue b/app/javascript/dashboard/routes/dashboard/settings/reports/components/Filters/v3/ActiveFilterChip.vue
new file mode 100644
index 000000000..67046acc4
--- /dev/null
+++ b/app/javascript/dashboard/routes/dashboard/settings/reports/components/Filters/v3/ActiveFilterChip.vue
@@ -0,0 +1,74 @@
+<script setup>
+import FilterButton from './FilterButton.vue';
+import FilterListDropdown from './FilterListDropdown.vue';
+
+const props = defineProps({
+  name: {
+    type: String,
+    required: true,
+  },
+  id: {
+    type: Number,
+    required: true,
+  },
+  type: {
+    type: String,
+    required: true,
+  },
+  options: {
+    type: Array,
+    default: () => [],
+  },
+  activeFilterType: {
+    type: String,
+    default: '',
+  },
+  showMenu: {
+    type: Boolean,
+    default: false,
+  },
+  placeholder: {
+    type: String,
+    default: '',
+  },
+  enableSearch: {
+    type: Boolean,
+    default: false,
+  },
+});
+
+const emit = defineEmits([
+  'toggleDropdown',
+  'removeFilter',
+  'addFilter',
+  'closeDropdown',
+]);
+const toggleDropdown = () => emit('toggleDropdown', props.type);
+const removeFilter = () => emit('removeFilter', props.type);
+const addFilter = item => emit('addFilter', item);
+const closeDropdown = () => emit('closeDropdown');
+</script>
+
+<template>
+  <filter-button
+    right-icon="chevron-down"
+    :button-text="name"
+    class="bg-slate-50 dark:bg-slate-800 hover:bg-slate-75 dark:hover:bg-slate-800"
+    @click="toggleDropdown"
+  >
+    <template v-if="showMenu && activeFilterType === type" #dropdown>
+      <filter-list-dropdown
+        v-if="options"
+        v-on-clickaway="closeDropdown"
+        show-clear-filter
+        :list-items="options"
+        :active-filter-id="id"
+        :input-placeholder="placeholder"
+        :enable-search="enableSearch"
+        class="flex flex-col w-[240px] overflow-y-auto left-0 md:left-auto md:right-0 top-10"
+        @click="addFilter"
+        @removeFilter="removeFilter"
+      />
+    </template>
+  </filter-button>
+</template>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/reports/components/Filters/v3/AddFilterChip.vue b/app/javascript/dashboard/routes/dashboard/settings/reports/components/Filters/v3/AddFilterChip.vue
new file mode 100644
index 000000000..48a1c2701
--- /dev/null
+++ b/app/javascript/dashboard/routes/dashboard/settings/reports/components/Filters/v3/AddFilterChip.vue
@@ -0,0 +1,98 @@
+<script setup>
+import FilterButton from './FilterButton.vue';
+import FilterListDropdown from './FilterListDropdown.vue';
+import FilterListItemButton from './FilterListItemButton.vue';
+import FilterDropdownEmptyState from './FilterDropdownEmptyState.vue';
+
+import { ref } from 'vue';
+
+defineProps({
+  name: {
+    type: String,
+    required: true,
+  },
+  menuOption: {
+    type: Array,
+    default: () => [],
+  },
+  showMenu: {
+    type: Boolean,
+    default: false,
+  },
+  placeholderI18nKey: {
+    type: String,
+    default: '',
+  },
+  enableSearch: {
+    type: Boolean,
+    default: true,
+  },
+  emptyStateMessage: {
+    type: String,
+    default: '',
+  },
+});
+
+const hoveredItemId = ref(null);
+
+const showSubMenu = id => {
+  hoveredItemId.value = id;
+};
+
+const hideSubMenu = () => {
+  hoveredItemId.value = null;
+};
+
+const isHovered = id => hoveredItemId.value === id;
+
+const emit = defineEmits(['toggleDropdown', 'addFilter', 'closeDropdown']);
+const toggleDropdown = () => emit('toggleDropdown');
+const addFilter = item => {
+  emit('addFilter', item);
+  hideSubMenu();
+};
+const closeDropdown = () => {
+  hideSubMenu();
+  emit('closeDropdown');
+};
+</script>
+
+<template>
+  <filter-button :button-text="name" left-icon="filter" @click="toggleDropdown">
+    <!-- Dropdown with search and sub-dropdown -->
+    <template v-if="showMenu" #dropdown>
+      <filter-list-dropdown
+        v-on-clickaway="closeDropdown"
+        class="left-0 md:right-0 top-10"
+      >
+        <template #listItem>
+          <filter-dropdown-empty-state
+            v-if="!menuOption.length"
+            :message="emptyStateMessage"
+          />
+          <filter-list-item-button
+            v-for="item in menuOption"
+            :key="item.id"
+            :button-text="item.name"
+            @mouseenter="showSubMenu(item.id)"
+            @mouseleave="hideSubMenu"
+            @focus="showSubMenu(item.id)"
+          >
+            <!-- Submenu with search and clear button  -->
+            <template v-if="item.options && isHovered(item.id)" #dropdown>
+              <filter-list-dropdown
+                :list-items="item.options"
+                :input-placeholder="
+                  $t(`${placeholderI18nKey}.${item.type.toUpperCase()}`)
+                "
+                :enable-search="enableSearch"
+                class="flex flex-col w-[216px] overflow-y-auto top-0 left-36"
+                @click="addFilter"
+              />
+            </template>
+          </filter-list-item-button>
+        </template>
+      </filter-list-dropdown>
+    </template>
+  </filter-button>
+</template>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/reports/components/Filters/v3/FilterButton.vue b/app/javascript/dashboard/routes/dashboard/settings/reports/components/Filters/v3/FilterButton.vue
index 2c9784705..3bbfb415c 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/reports/components/Filters/v3/FilterButton.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/reports/components/Filters/v3/FilterButton.vue
@@ -4,23 +4,44 @@ defineProps({
     type: String,
     default: '',
   },
+  rightIcon: {
+    type: String,
+    default: '',
+  },
+  leftIcon: {
+    type: String,
+    default: '',
+  },
 });
 </script>
 <template>
   <button
-    class="inline-flex relative items-center p-1.5 w-fit h-8 gap-1.5 bg-white dark:bg-slate-900 rounded-lg hover:bg-slate-50 dark:hover:bg-slate-800 active:bg-slate-75 dark:active:bg-slate-800"
+    class="inline-flex relative items-center p-1.5 w-fit h-8 gap-1.5 rounded-lg hover:bg-slate-50 dark:hover:bg-slate-800 active:bg-slate-75 dark:active:bg-slate-800"
     @click="$emit('click')"
   >
-    <slot name="leftIcon" />
+    <slot name="leftIcon">
+      <fluent-icon
+        v-if="leftIcon"
+        :icon="leftIcon"
+        size="18"
+        class="flex-shrink-0 text-slate-900 dark:text-slate-50"
+      />
+    </slot>
     <span
       v-if="buttonText"
-      class="text-sm font-medium text-slate-900 dark:text-slate-50"
+      class="text-sm font-medium truncate text-slate-900 dark:text-slate-50"
     >
       {{ buttonText }}
     </span>
-    <slot name="rightIcon" />
-    <div v-if="$slots.dropdown" class="absolute right-0 top-10" @click.stop>
-      <slot name="dropdown" />
-    </div>
+    <slot name="rightIcon">
+      <fluent-icon
+        v-if="rightIcon"
+        :icon="rightIcon"
+        size="18"
+        class="flex-shrink-0 text-slate-900 dark:text-slate-50"
+      />
+    </slot>
+
+    <slot name="dropdown" />
   </button>
 </template>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/reports/components/Filters/v3/FilterDropdownSearch.vue b/app/javascript/dashboard/routes/dashboard/settings/reports/components/Filters/v3/FilterDropdownSearch.vue
index ee090edf4..558816deb 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/reports/components/Filters/v3/FilterDropdownSearch.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/reports/components/Filters/v3/FilterDropdownSearch.vue
@@ -1,9 +1,5 @@
 <script setup>
 defineProps({
-  buttonText: {
-    type: String,
-    default: '',
-  },
   inputValue: {
     type: String,
     default: '',
@@ -12,13 +8,17 @@ defineProps({
     type: String,
     default: '',
   },
+  showClearFilter: {
+    type: Boolean,
+    default: false,
+  },
 });
 </script>
 <template>
   <div
     class="flex items-center justify-between h-10 min-h-[40px] sticky top-0 bg-white z-10 dark:bg-slate-800 gap-2 px-3 border-b rounded-t-xl border-slate-50 dark:border-slate-700"
   >
-    <div class="flex items-center gap-2">
+    <div class="flex items-center w-full gap-2">
       <fluent-icon
         icon="search"
         size="18"
@@ -32,14 +32,16 @@ defineProps({
         @input="$emit('input', $event.target.value)"
       />
     </div>
+    <!-- Clear filter button -->
     <woot-button
+      v-if="!inputValue && showClearFilter"
       size="small"
       variant="clear"
       color-scheme="primary"
       class="!px-1 !py-1.5"
       @click="$emit('click')"
     >
-      {{ buttonText }}
+      {{ $t('REPORT.FILTER_ACTIONS.CLEAR_FILTER') }}
     </woot-button>
   </div>
 </template>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/reports/components/Filters/v3/FilterListDropdown.vue b/app/javascript/dashboard/routes/dashboard/settings/reports/components/Filters/v3/FilterListDropdown.vue
index fbb07db77..1a0543af3 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/reports/components/Filters/v3/FilterListDropdown.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/reports/components/Filters/v3/FilterListDropdown.vue
@@ -14,18 +14,18 @@ const props = defineProps({
     type: Boolean,
     default: false,
   },
-  inputButtonText: {
-    type: String,
-    default: '',
-  },
-  emptyListMessage: {
-    type: String,
-    default: '',
-  },
   inputPlaceholder: {
     type: String,
     default: '',
   },
+  activeFilterId: {
+    type: Number,
+    default: null,
+  },
+  showClearFilter: {
+    type: Boolean,
+    default: false,
+  },
 });
 
 const searchTerm = ref('');
@@ -42,29 +42,36 @@ const filteredListItems = computed(() => {
 const isDropdownListEmpty = computed(() => {
   return !filteredListItems.value.length;
 });
+
+const isFilterActive = id => {
+  if (!props.activeFilterId) return false;
+  return id === props.activeFilterId;
+};
 </script>
 <template>
   <div
-    class="z-20 w-40 bg-white border shadow dark:bg-slate-800 rounded-xl border-slate-50 dark:border-slate-700/50 max-h-72"
+    class="absolute z-20 w-40 bg-white border shadow dark:bg-slate-800 rounded-xl border-slate-50 dark:border-slate-700/50 max-h-[400px]"
+    @click.stop
   >
     <slot name="search">
       <filter-dropdown-search
         v-if="enableSearch && listItems.length"
-        :button-text="inputButtonText"
         :input-value="searchTerm"
         :input-placeholder="inputPlaceholder"
+        :show-clear-filter="showClearFilter"
         @input="onSearch"
-        @click="onSearch('')"
+        @click="$emit('removeFilter')"
       />
     </slot>
     <slot name="listItem">
       <filter-dropdown-empty-state
         v-if="isDropdownListEmpty"
-        :message="emptyListMessage"
+        :message="$t('REPORT.FILTER_ACTIONS.EMPTY_LIST')"
       />
       <filter-list-item-button
         v-for="item in filteredListItems"
         :key="item.id"
+        :is-active="isFilterActive(item.id)"
         :button-text="item.name"
         @click="$emit('click', item)"
       />
diff --git a/app/javascript/dashboard/routes/dashboard/settings/reports/components/Filters/v3/FilterListItemButton.vue b/app/javascript/dashboard/routes/dashboard/settings/reports/components/Filters/v3/FilterListItemButton.vue
index 2fb99980a..3566686e1 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/reports/components/Filters/v3/FilterListItemButton.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/reports/components/Filters/v3/FilterListItemButton.vue
@@ -13,7 +13,7 @@ defineProps({
 <template>
   <button
     class="relative inline-flex items-center justify-start w-full p-3 border-0 rounded-none first:rounded-t-xl last:rounded-b-xl h-11 hover:bg-slate-50 dark:hover:bg-slate-700 active:bg-slate-75 dark:active:bg-slate-800"
-    @click="$emit('click')"
+    @click.stop="$emit('click')"
     @mouseenter="$emit('mouseenter')"
     @mouseleave="$emit('mouseleave')"
     @focus="$emit('focus')"
diff --git a/app/javascript/dashboard/routes/dashboard/settings/reports/components/SLA/SLAFilter.vue b/app/javascript/dashboard/routes/dashboard/settings/reports/components/SLA/SLAFilter.vue
new file mode 100644
index 000000000..80163ecd7
--- /dev/null
+++ b/app/javascript/dashboard/routes/dashboard/settings/reports/components/SLA/SLAFilter.vue
@@ -0,0 +1,210 @@
+<template>
+  <div
+    class="flex flex-col flex-wrap items-start gap-2 md:items-center md:flex-nowrap md:flex-row"
+  >
+    <!-- Active filters section -->
+    <div v-if="hasActiveFilters" class="flex flex-wrap gap-2 md:flex-nowrap">
+      <active-filter-chip
+        v-for="filter in activeFilters"
+        v-bind="filter"
+        :key="filter.type"
+        :placeholder="
+          $t(
+            `SLA_REPORTS.DROPDOWN.INPUT_PLACEHOLDER.${filter.type.toUpperCase()}`
+          )
+        "
+        :active-filter-type="activeFilterType"
+        :show-menu="showSubDropdownMenu"
+        enable-search
+        @toggleDropdown="openActiveFilterDropdown"
+        @closeDropdown="closeActiveFilterDropdown"
+        @addFilter="addFilter"
+        @removeFilter="removeFilter"
+      />
+    </div>
+    <!-- Dividing line between Active filters and Add filter button -->
+    <div
+      v-if="hasActiveFilters && !isAllFilterSelected"
+      class="w-full h-px border md:w-px md:h-5 border-slate-75 dark:border-slate-800"
+    />
+    <!-- Add filter and clear filter button -->
+    <div class="flex items-center gap-2">
+      <add-filter-chip
+        v-if="!isAllFilterSelected"
+        placeholder-i18n-key="SLA_REPORTS.DROPDOWN.INPUT_PLACEHOLDER"
+        :name="$t('SLA_REPORTS.DROPDOWN.ADD_FIlTER')"
+        :menu-option="filterListMenuItems"
+        :show-menu="showDropdownMenu"
+        :empty-state-message="$t('SLA_REPORTS.DROPDOWN.NO_FILTER')"
+        @toggleDropdown="showDropdown"
+        @closeDropdown="closeDropdown"
+        @addFilter="addFilter"
+      />
+
+      <!-- Dividing line between Add filter and Clear all filter button -->
+      <div
+        v-if="hasActiveFilters"
+        class="w-px h-5 border border-slate-75 dark:border-slate-800"
+      />
+      <!-- Clear all filter button -->
+      <filter-button
+        v-if="hasActiveFilters"
+        :button-text="$t('SLA_REPORTS.DROPDOWN.CLEAR_ALL')"
+        @click="clearAllFilters"
+      />
+    </div>
+  </div>
+</template>
+
+<script>
+import { mapGetters } from 'vuex';
+import {
+  buildFilterList,
+  getActiveFilter,
+  getFilterType,
+} from './helpers/SLAFilterHelpers';
+import FilterButton from '../Filters/v3/FilterButton.vue';
+import ActiveFilterChip from '../Filters/v3/ActiveFilterChip.vue';
+import AddFilterChip from '../Filters/v3/AddFilterChip.vue';
+
+export default {
+  components: {
+    FilterButton,
+    ActiveFilterChip,
+    AddFilterChip,
+  },
+  data() {
+    return {
+      showDropdownMenu: false,
+      showSubDropdownMenu: false,
+      activeFilterType: '',
+      appliedFilters: {
+        assigned_agent_id: null,
+        inbox_id: null,
+        team_id: null,
+        sla_policy_id: null,
+        label_list: null,
+      },
+    };
+  },
+  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),
+        }));
+    },
+    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('filter-change', this.appliedFilters);
+      this.resetDropdown();
+    },
+    removeFilter(type) {
+      const filterKey = getFilterType(type, 'typeToKey');
+      this.appliedFilters[filterKey] = null;
+      this.$emit('filter-change', this.appliedFilters);
+    },
+    clearAllFilters() {
+      this.appliedFilters = {
+        assigned_agent_id: null,
+        inbox_id: null,
+        team_id: null,
+        sla_policy_id: null,
+        label_list: null,
+      };
+      this.$emit('filter-change', 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();
+    },
+  },
+};
+</script>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/reports/components/SLA/SLAReportFilters.vue b/app/javascript/dashboard/routes/dashboard/settings/reports/components/SLA/SLAReportFilters.vue
index 5748366b6..123a921fc 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/reports/components/SLA/SLAReportFilters.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/reports/components/SLA/SLAReportFilters.vue
@@ -1,22 +1,25 @@
 <template>
-  <div class="flex flex-col md:flex-row justify-between mb-4">
-    <div class="md:grid flex flex-col filter-container gap-3 w-full">
-      <reports-filters-date-range @on-range-change="onDateRangeChange" />
-      <woot-date-range-picker
-        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"
-      />
-    </div>
+  <div class="flex flex-col flex-wrap w-full gap-3 md:flex-row">
+    <reports-filters-date-range
+      class="sm:min-w-[200px] tiny h-8"
+      @on-range-change="onDateRangeChange"
+    />
+    <woot-date-range-picker
+      v-if="isDateRangeSelected"
+      show-range
+      class="no-margin auto-width sm:min-w-[240px] small h-8"
+      :value="customDateRange"
+      :confirm-text="$t('REPORT.CUSTOM_DATE_RANGE.CONFIRM')"
+      :placeholder="$t('REPORT.CUSTOM_DATE_RANGE.PLACEHOLDER')"
+      @change="onCustomDateRangeChange"
+    />
+    <SLA-filter @filter-change="emitFilterChange" />
   </div>
 </template>
 <script>
 import WootDateRangePicker from 'dashboard/components/ui/DateRangePicker.vue';
 import ReportsFiltersDateRange from '../Filters/DateRange.vue';
+import SLAFilter from '../SLA/SLAFilter.vue';
 import subDays from 'date-fns/subDays';
 import { DATE_RANGE_OPTIONS } from '../../constants';
 import { getUnixStartOfDay, getUnixEndOfDay } from 'helpers/DateHelper';
@@ -25,6 +28,7 @@ export default {
   components: {
     WootDateRangePicker,
     ReportsFiltersDateRange,
+    SLAFilter,
   },
 
   data() {
@@ -70,8 +74,13 @@ export default {
       this.$emit('filter-change', {
         from,
         to,
+        ...this.selectedGroupByFilter,
       });
     },
+    emitFilterChange(params) {
+      this.selectedGroupByFilter = params;
+      this.emitChange();
+    },
     onDateRangeChange(selectedRange) {
       this.selectedDateRange = selectedRange;
       this.emitChange();
@@ -83,9 +92,3 @@ export default {
   },
 };
 </script>
-
-<style scoped>
-.filter-container {
-  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
-}
-</style>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/reports/components/SLA/SLAViewDetails.vue b/app/javascript/dashboard/routes/dashboard/settings/reports/components/SLA/SLAViewDetails.vue
index 72bc4749a..cdeda0af2 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/reports/components/SLA/SLAViewDetails.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/reports/components/SLA/SLAViewDetails.vue
@@ -13,7 +13,7 @@
         </woot-button>
         <SLA-popover-card
           v-if="showSlaPopoverCard"
-          :all-missed-slas="slaEvents"
+          :sla-missed-events="slaEvents"
           class="right-0"
         />
       </div>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/reports/components/SLA/helpers/SLAFilterHelpers.js b/app/javascript/dashboard/routes/dashboard/settings/reports/components/SLA/helpers/SLAFilterHelpers.js
new file mode 100644
index 000000000..cac7e93c3
--- /dev/null
+++ b/app/javascript/dashboard/routes/dashboard/settings/reports/components/SLA/helpers/SLAFilterHelpers.js
@@ -0,0 +1,37 @@
+export const buildFilterList = (items, type) =>
+  // Build the filter list for the dropdown
+  items.map(item => ({
+    id: item.id,
+    name: type === 'labels' ? item.title : item.name,
+    type,
+  }));
+
+export const getActiveFilter = (filters, type, key) => {
+  // Method is used to get the active filter from the filter list
+  return filters.find(filterItem =>
+    type === 'labels'
+      ? filterItem.title === key
+      : filterItem.id.toString() === key.toString()
+  );
+};
+
+export const getFilterType = (input, direction) => {
+  // Method is used to map the filter key to the filter type
+  const filterMap = {
+    keyToType: {
+      assigned_agent_id: 'agents',
+      inbox_id: 'inboxes',
+      team_id: 'teams',
+      sla_policy_id: 'sla',
+      label_list: 'labels',
+    },
+    typeToKey: {
+      agents: 'assigned_agent_id',
+      inboxes: 'inbox_id',
+      teams: 'team_id',
+      sla: 'sla_policy_id',
+      labels: 'label_list',
+    },
+  };
+  return filterMap[direction][input];
+};
diff --git a/app/javascript/packs/application.js b/app/javascript/packs/application.js
index 7c6fb5d93..5029c9e76 100644
--- a/app/javascript/packs/application.js
+++ b/app/javascript/packs/application.js
@@ -31,6 +31,7 @@ import VueDOMPurifyHTML from 'vue-dompurify-html';
 import { domPurifyConfig } from '../shared/helpers/HTMLSanitizer';
 import AnalyticsPlugin from '../dashboard/helper/AnalyticsHelper/plugin';
 import resizeDirective from '../dashboard/helper/directives/resize.js';
+import { directive as onClickaway } from 'vue-clickaway';
 
 Vue.config.env = process.env;
 
@@ -78,7 +79,9 @@ Vue.component('multiselect', Multiselect);
 Vue.component('woot-switch', WootSwitch);
 Vue.component('woot-wizard', WootWizard);
 Vue.component('fluent-icon', FluentIcon);
+
 Vue.directive('resize', resizeDirective);
+Vue.directive('on-clickaway', onClickaway);
 
 const i18nConfig = new VueI18n({
   locale: 'en',
diff --git a/app/javascript/sdk/sdk.js b/app/javascript/sdk/sdk.js
index 313bbb88a..95d132258 100644
--- a/app/javascript/sdk/sdk.js
+++ b/app/javascript/sdk/sdk.js
@@ -23,6 +23,7 @@ export const SDK_CSS = `
 
 .woot-widget-holder iframe {
   border: 0;
+  color-scheme: normal;
   height: 100% !important;
   width: 100% !important;
   max-height: 100vh !important;
diff --git a/app/services/imap/base_fetch_email_service.rb b/app/services/imap/base_fetch_email_service.rb
index 4f49dc980..1af3bdb5d 100644
--- a/app/services/imap/base_fetch_email_service.rb
+++ b/app/services/imap/base_fetch_email_service.rb
@@ -3,10 +3,17 @@ require 'net/imap'
 class Imap::BaseFetchEmailService
   pattr_initialize [:channel!]
 
-  def perform
+  def fetch_emails
     # Override this method
   end
 
+  def perform
+    inbound_emails = fetch_emails
+    terminate_imap_connection
+
+    inbound_emails
+  end
+
   private
 
   def authentication_type
@@ -105,6 +112,13 @@ class Imap::BaseFetchEmailService
     imap
   end
 
+  def terminate_imap_connection
+    imap_client.logout
+  rescue Net::IMAP::Error => e
+    Rails.logger.info "Logout failed for #{channel.email} - #{e.message}."
+    imap_client.disconnect
+  end
+
   def build_mail_from_string(raw_email_content)
     Mail.read_from_string(raw_email_content)
   end
diff --git a/app/services/imap/fetch_email_service.rb b/app/services/imap/fetch_email_service.rb
index f6d8de774..f602b3375 100644
--- a/app/services/imap/fetch_email_service.rb
+++ b/app/services/imap/fetch_email_service.rb
@@ -1,5 +1,5 @@
 class Imap::FetchEmailService < Imap::BaseFetchEmailService
-  def perform
+  def fetch_emails
     fetch_mail_for_channel
   end
 
diff --git a/app/services/imap/microsoft_fetch_email_service.rb b/app/services/imap/microsoft_fetch_email_service.rb
index b6d3c03b8..ed3eb20f1 100644
--- a/app/services/imap/microsoft_fetch_email_service.rb
+++ b/app/services/imap/microsoft_fetch_email_service.rb
@@ -1,5 +1,5 @@
 class Imap::MicrosoftFetchEmailService < Imap::BaseFetchEmailService
-  def perform
+  def fetch_emails
     return if channel.provider_config['access_token'].blank?
 
     fetch_mail_for_channel
diff --git a/enterprise/app/models/applied_sla.rb b/enterprise/app/models/applied_sla.rb
index 0ae634536..6adeee036 100644
--- a/enterprise/app/models/applied_sla.rb
+++ b/enterprise/app/models/applied_sla.rb
@@ -30,14 +30,14 @@ class AppliedSla < ApplicationRecord
   enum sla_status: { active: 0, hit: 1, missed: 2, active_with_misses: 3 }
 
   scope :filter_by_date_range, ->(range) { where(created_at: range) if range.present? }
-  scope :filter_by_inbox_id, ->(inbox_id) { where(inbox_id: inbox_id) if inbox_id.present? }
-  scope :filter_by_team_id, ->(team_id) { where(team_id: team_id) if team_id.present? }
+  scope :filter_by_inbox_id, ->(inbox_id) { joins(:conversation).where(conversations: { inbox_id: inbox_id }) if inbox_id.present? }
+  scope :filter_by_team_id, ->(team_id) { joins(:conversation).where(conversations: { team_id: team_id }) if team_id.present? }
   scope :filter_by_sla_policy_id, ->(sla_policy_id) { where(sla_policy_id: sla_policy_id) if sla_policy_id.present? }
-  scope :filter_by_label_list, ->(label_list) { joins(:conversation).where(conversations: { cached_label_list: label_list }) if label_list.present? }
+  scope :filter_by_label_list, lambda { |label_list|
+                                 joins(:conversation).where('conversations.cached_label_list LIKE ?', "%#{label_list}%") if label_list.present?
+                               }
   scope :filter_by_assigned_agent_id, lambda { |assigned_agent_id|
-                                        if assigned_agent_id.present?
-                                          joins(:conversation).where(conversations: { assigned_agent_id: assigned_agent_id })
-                                        end
+                                        joins(:conversation).where(conversations: { assignee_id: assigned_agent_id }) if assigned_agent_id.present?
                                       }
   scope :missed, -> { where(sla_status: %i[missed active_with_misses]) }
 
diff --git a/spec/enterprise/controllers/api/v1/accounts/applied_slas_controller_spec.rb b/spec/enterprise/controllers/api/v1/accounts/applied_slas_controller_spec.rb
index 34389dad4..423f65711 100644
--- a/spec/enterprise/controllers/api/v1/accounts/applied_slas_controller_spec.rb
+++ b/spec/enterprise/controllers/api/v1/accounts/applied_slas_controller_spec.rb
@@ -92,7 +92,7 @@ RSpec.describe 'Applied SLAs API', type: :request do
         create(:applied_sla, sla_policy: sla_policy1, conversation: conversation3, created_at: 3.days.ago)
 
         get "/api/v1/accounts/#{account.id}/applied_slas/metrics",
-            params: { label_list: ['label1'] },
+            params: { label_list: 'label1' },
             headers: administrator.create_new_auth_token
         expect(response).to have_http_status(:success)
         body = JSON.parse(response.body)
@@ -205,7 +205,7 @@ RSpec.describe 'Applied SLAs API', type: :request do
         create(:applied_sla, sla_policy: sla_policy1, conversation: conversation3, created_at: 3.days.ago, sla_status: 'missed')
 
         get "/api/v1/accounts/#{account.id}/applied_slas",
-            params: { label_list: ['label1'] },
+            params: { label_list: 'label1' },
             headers: administrator.create_new_auth_token
         expect(response).to have_http_status(:success)
         body = JSON.parse(response.body)
diff --git a/spec/services/imap/fetch_email_service_spec.rb b/spec/services/imap/fetch_email_service_spec.rb
index 28a173951..46336bf0f 100644
--- a/spec/services/imap/fetch_email_service_spec.rb
+++ b/spec/services/imap/fetch_email_service_spec.rb
@@ -30,6 +30,7 @@ RSpec.describe Imap::FetchEmailService do
           allow(imap).to receive(:search).with(%w[SINCE 25-Oct-2020]).and_return([1])
           allow(imap).to receive(:fetch).with([1], 'BODY.PEEK[HEADER]').and_return([email_header])
           allow(imap).to receive(:fetch).with(1, 'RFC822').and_return([imap_fetch_mail])
+          allow(imap).to receive(:logout)
 
           result = described_class.new(channel: imap_email_channel).perform
 
@@ -39,6 +40,7 @@ RSpec.describe Imap::FetchEmailService do
           expect(imap).to have_received(:fetch).with([1], 'BODY.PEEK[HEADER]')
           expect(imap).to have_received(:fetch).with(1, 'RFC822')
           expect(logger).to have_received(:info).with("[IMAP::FETCH_EMAIL_SERVICE] Fetching mails from #{imap_email_channel.email}, found 1.")
+          expect(imap).to have_received(:logout)
         end
       end
 
@@ -51,6 +53,7 @@ RSpec.describe Imap::FetchEmailService do
 
           allow(imap).to receive(:search).with(%w[SINCE 25-Oct-2020]).and_return([1])
           allow(imap).to receive(:fetch).with([1], 'BODY.PEEK[HEADER]').and_return([email_header])
+          allow(imap).to receive(:logout)
 
           result = described_class.new(channel: imap_email_channel).perform
 
diff --git a/spec/services/imap/microsoft_fetch_email_service_spec.rb b/spec/services/imap/microsoft_fetch_email_service_spec.rb
index 8f79b86b5..3a13ce0c6 100644
--- a/spec/services/imap/microsoft_fetch_email_service_spec.rb
+++ b/spec/services/imap/microsoft_fetch_email_service_spec.rb
@@ -35,6 +35,7 @@ RSpec.describe Imap::MicrosoftFetchEmailService do
           allow(imap).to receive(:search).with(%w[SINCE 25-Oct-2020]).and_return([1])
           allow(imap).to receive(:fetch).with([1], 'BODY.PEEK[HEADER]').and_return([email_header])
           allow(imap).to receive(:fetch).with(1, 'RFC822').and_return([imap_fetch_mail])
+          allow(imap).to receive(:logout)
 
           result = described_class.new(channel: microsoft_channel).perform