diff --git a/frontend/app/components/shared/Filters/FilterAutoComplete/AutocompleteModal.tsx b/frontend/app/components/shared/Filters/FilterAutoComplete/AutocompleteModal.tsx
index d3321ea77..43e7a18e6 100644
--- a/frontend/app/components/shared/Filters/FilterAutoComplete/AutocompleteModal.tsx
+++ b/frontend/app/components/shared/Filters/FilterAutoComplete/AutocompleteModal.tsx
@@ -1,6 +1,7 @@
 import React, { useRef, useState } from 'react';
 import { Button, Checkbox, Input } from 'antd';
 import cn from 'classnames';
+import { Loader } from 'UI';
 import OutsideClickDetectingDiv from '../../OutsideClickDetectingDiv';
 
 export function AutocompleteModal({
@@ -11,11 +12,12 @@ export function AutocompleteModal({
   loadOptions,
   options,
   isLoading,
+  placeholder,
 }: {
   values: string[];
   onClose: () => void;
   onApply: (values: string[]) => void;
-  handleFocus: () => void;
+  handleFocus?: () => void;
   loadOptions: (query: string) => void;
   options: { value: string; label: string }[];
   placeholder?: string;
@@ -70,36 +72,40 @@ export function AutocompleteModal({
         onFocus={handleFocus}
         loading={isLoading}
         onChange={(e) => handleInputChange(e.target.value)}
+        placeholder={placeholder}
       />
-
-      <div
-        className={'flex flex-col gap-2 overflow-y-auto py-2'}
-        style={{ maxHeight: 200 }}
-      >
-        {sortedOptions.map((item) => (
+      <Loader loading={isLoading}>
+        <>
           <div
-            key={item.value}
-            onClick={() => onSelectOption(item)}
-            className={
-              'cursor-pointer w-full py-1 hover:bg-active-blue rounded px-2'
-            }
+            className={'flex flex-col gap-2 overflow-y-auto py-2'}
+            style={{ maxHeight: 200 }}
           >
-            <Checkbox checked={isSelected(item)} /> {item.label}
+            {sortedOptions.map((item) => (
+              <div
+                key={item.value}
+                onClick={() => onSelectOption(item)}
+                className={
+                  'cursor-pointer w-full py-1 hover:bg-active-blue rounded px-2'
+                }
+              >
+                <Checkbox checked={isSelected(item)} /> {item.label}
+              </div>
+            ))}
           </div>
-        ))}
-      </div>
-      {query.length ? (
-        <div className={'border-y border-y-gray-light py-2'}>
-          <div
-            className={
-              'rounded cursor-pointer text-blue hover:bg-active-blue px-2 py-1'
-            }
-            onClick={() => onApply([query])}
-          >
-            Apply "{query}"
-          </div>
-        </div>
-      ) : null}
+          {query.length ? (
+            <div className={'border-y border-y-gray-light py-2'}>
+              <div
+                className={
+                  'rounded cursor-pointer text-blue hover:bg-active-blue px-2 py-1'
+                }
+                onClick={() => onApply([query])}
+              >
+                Apply "{query}"
+              </div>
+            </div>
+          ) : null}
+        </>
+      </Loader>
       <div className={'flex gap-2 items-center pt-2'}>
         <Button type={'primary'} onClick={applyValues}>
           Apply
@@ -151,9 +157,9 @@ export function AutoCompleteContainer(props: Props) {
                 : props.value[0]}
             </div>
             {props.value.length > 1 ? (
-              props.value.length === 2 ? (
-                <>
-                  or
+              <>
+                or
+                {props.value.length === 2 ? (
                   <div
                     className={
                       'rounded-xl bg-gray-lighter leading-none px-1 py-0.5'
@@ -163,16 +169,16 @@ export function AutoCompleteContainer(props: Props) {
                       ? props.mapValues(props.value[1])
                       : props.value[1]}
                   </div>
-                </>
-              ) : (
-                <div
-                  className={
-                    'rounded-xl bg-gray-lighter leading-none px-1 py-0.5'
-                  }
-                >
-                  + {props.value.length - 1} More
-                </div>
-              )
+                ) : (
+                  <div
+                    className={
+                      'rounded-xl bg-gray-lighter leading-none px-1 py-0.5'
+                    }
+                  >
+                    + {props.value.length - 1} More
+                  </div>
+                )}
+              </>
             ) : null}
           </>
         ) : (
diff --git a/frontend/app/components/shared/Filters/FilterAutoComplete/FilterAutoComplete.tsx b/frontend/app/components/shared/Filters/FilterAutoComplete/FilterAutoComplete.tsx
index 6e9431dc0..95098ee69 100644
--- a/frontend/app/components/shared/Filters/FilterAutoComplete/FilterAutoComplete.tsx
+++ b/frontend/app/components/shared/Filters/FilterAutoComplete/FilterAutoComplete.tsx
@@ -43,6 +43,7 @@ interface Props {
   icon?: string;
   hideOrText?: boolean;
   onApplyValues: (values: string[]) => void;
+  modalProps?: Record<string, any>
 }
 
 const FilterAutoComplete = observer(
@@ -51,7 +52,8 @@ const FilterAutoComplete = observer(
     onClose,
     onApply,
     values,
-  }: { params: any, values: string[], onClose: () => void, onApply: (values: string[]) => void }) => {
+    placeholder,
+  }: { params: any, values: string[], onClose: () => void, onApply: (values: string[]) => void, placeholder?: string }) => {
     const [options, setOptions] = useState<{ value: string; label: string }[]>(
       []
     );
@@ -128,6 +130,7 @@ const FilterAutoComplete = observer(
       loadOptions={handleInputChange}
       options={options}
       isLoading={loading}
+      placeholder={placeholder}
     />
   }
 );
diff --git a/frontend/app/components/shared/Filters/FilterItem/FilterItem.tsx b/frontend/app/components/shared/Filters/FilterItem/FilterItem.tsx
index 2d06c41a9..698fc9bde 100644
--- a/frontend/app/components/shared/Filters/FilterItem/FilterItem.tsx
+++ b/frontend/app/components/shared/Filters/FilterItem/FilterItem.tsx
@@ -42,7 +42,7 @@ function FilterItem(props: Props) {
   const replaceFilter = (filter: any) => {
     props.onUpdate({
       ...filter,
-      value: [''],
+      value: filter.value,
       filters: filter.filters ? filter.filters.map((i: any) => ({...i, value: ['']})) : [],
     });
   };
diff --git a/frontend/app/components/shared/Filters/FilterModal/FilterModal.tsx b/frontend/app/components/shared/Filters/FilterModal/FilterModal.tsx
index 96ff1c1ff..0be8d843b 100644
--- a/frontend/app/components/shared/Filters/FilterModal/FilterModal.tsx
+++ b/frontend/app/components/shared/Filters/FilterModal/FilterModal.tsx
@@ -247,7 +247,7 @@ function FilterModal(props: Props) {
                   className={cn(
                     'flex items-center p-2 cursor-pointer gap-1 rounded-lg hover:bg-active-blue'
                   )}
-                  onClick={() => onFilterClick({ ...filter, value: [''] })}
+                  onClick={() => onFilterClick({ ...filter })}
                 >
                   {filter.category ? <div style={{ width: 150 }} className={'text-disabled-text w-full flex justify-between items-center'}>
                     <span>{filter.category}</span>
diff --git a/frontend/app/components/shared/Filters/FilterSelection/FilterSelection.tsx b/frontend/app/components/shared/Filters/FilterSelection/FilterSelection.tsx
index be87b59bd..74ccac3c7 100644
--- a/frontend/app/components/shared/Filters/FilterSelection/FilterSelection.tsx
+++ b/frontend/app/components/shared/Filters/FilterSelection/FilterSelection.tsx
@@ -38,6 +38,8 @@ function FilterSelection(props: Props) {
     onFilterClick(filter);
     setShowModal(false);
   }
+
+  const label = filter?.category === 'Issue' ? 'Issue' : filter?.label;
   return (
     <div className="relative flex-shrink-0">
       <OutsideClickDetectingDiv
@@ -74,7 +76,7 @@ function FilterSelection(props: Props) {
               className="overflow-hidden whitespace-nowrap text-ellipsis mr-auto truncate"
               style={{ textOverflow: 'ellipsis' }}
             >
-              {filter.label}
+              {label}
             </div>
           </div>
         )}
diff --git a/frontend/app/components/shared/Filters/FilterValue/FilterValue.tsx b/frontend/app/components/shared/Filters/FilterValue/FilterValue.tsx
index d56f5ebb1..7fad2ca33 100644
--- a/frontend/app/components/shared/Filters/FilterValue/FilterValue.tsx
+++ b/frontend/app/components/shared/Filters/FilterValue/FilterValue.tsx
@@ -18,6 +18,7 @@ interface Props {
 }
 function FilterValue(props: Props) {
   const { filter } = props;
+  const isEvent = filter.isEvent;
   const [durationValues, setDurationValues] = useState({
     minDuration: filter.value[0],
     maxDuration: filter.value.length > 1 ? filter.value[1] : filter.value[0],
@@ -113,17 +114,18 @@ function FilterValue(props: Props) {
     )
     switch (filter.type) {
       case FilterType.NUMBER_MULTIPLE:
-        return <BaseFilterLocalAutoComplete type="number" />;
+        return <BaseFilterLocalAutoComplete type="number" placeholder={filter.placeholder} />;
       case FilterType.NUMBER:
         return (
           <BaseFilterLocalAutoComplete
             type="number"
             allowDecimals={false}
             isMultiple={false}
+            placeholder={filter.placeholder}
           />
         );
       case FilterType.STRING:
-        return <BaseFilterLocalAutoComplete />;
+        return <BaseFilterLocalAutoComplete placeholder={filter.placeholder} />;
       case FilterType.DROPDOWN:
         return (
           <BaseDropDown />
@@ -137,6 +139,7 @@ function FilterValue(props: Props) {
             onRemoveValue={(ind) => onRemoveValue(ind)}
             showCloseButton={showCloseButton}
             showOrButton={showOrButton}
+            placeholder={filter.placeholder}
           />
         );
       case FilterType.DURATION:
@@ -164,6 +167,7 @@ function FilterValue(props: Props) {
             placeholder={filter.placeholder}
             onSelect={(e, item, index) => onChange(e, item, index)}
             icon={filter.icon}
+            modalProps={{ placeholder: isEvent ? 'Search event' : 'Filter by'}}
           />
         );
     }
diff --git a/frontend/app/components/shared/Filters/FilterValueDropdown/FilterValueDropdown.tsx b/frontend/app/components/shared/Filters/FilterValueDropdown/FilterValueDropdown.tsx
index 1ad7a3c14..72b6f0198 100644
--- a/frontend/app/components/shared/Filters/FilterValueDropdown/FilterValueDropdown.tsx
+++ b/frontend/app/components/shared/Filters/FilterValueDropdown/FilterValueDropdown.tsx
@@ -1,7 +1,5 @@
 import React from 'react';
-import { Icon } from 'UI';
 import { AutoCompleteContainer, AutocompleteModal } from "../FilterAutoComplete/AutocompleteModal";
-import stl from './FilterValueDropdown.module.css';
 
 interface Props {
   options: any[];
@@ -28,6 +26,7 @@ function FilterValueDropdown(props: Props) {
       onApply={onApply}
       loadOptions={setQuery}
       options={filteredOptions}
+      isLoading={false}
     />
   );
 }
diff --git a/frontend/app/mstore/searchStore.ts b/frontend/app/mstore/searchStore.ts
index f8767e97f..dab983d79 100644
--- a/frontend/app/mstore/searchStore.ts
+++ b/frontend/app/mstore/searchStore.ts
@@ -244,6 +244,7 @@ class SearchStore {
   addFilter(filter: any) {
     const index = filter.isEvent ? -1 : this.instance.filters.findIndex((i: FilterItem) => i.key === filter.key);
 
+    console.log(filter)
     filter.value = checkFilterValue(filter.value);
     filter.filters = filter.filters
       ? filter.filters.map((subFilter: any) => ({
diff --git a/frontend/app/types/filter/newFilter.js b/frontend/app/types/filter/newFilter.js
index 1e60e0f8a..93f6d830c 100644
--- a/frontend/app/types/filter/newFilter.js
+++ b/frontend/app/types/filter/newFilter.js
@@ -1,6 +1,6 @@
 import {
-  clickSelectorOperators
-} from 'App/constants/filterOptions';
+  clickSelectorOperators, issueOptions
+} from "App/constants/filterOptions";
 import Record from 'Types/Record';
 import { FilterType, FilterKey, FilterCategory } from './filterType';
 import filterOptions, { countries, platformOptions } from 'App/constants';
@@ -86,6 +86,18 @@ export const mobileFilters = [
   }
 ];
 
+const issueFilters = issueOptions.map((i) => ({
+  key: `${FilterKey.ISSUE}_${i.value}`,
+  type: FilterType.ISSUE,
+  category: FilterCategory.ISSUE,
+  label: i.label,
+  value: i.value,
+  placeholder: 'Select an issue',
+  operator: 'is',
+  operatorOptions: filterOptions.getOperatorsByKeys(['is', 'isAny', 'isNot']),
+  icon: 'filters/click',
+  options: filterOptions.issueOptions,
+}));
 export const filters = [
   ...mobileFilters,
   {
@@ -431,6 +443,7 @@ export const filters = [
     icon: 'filters/click',
     options: filterOptions.issueOptions
   },
+  ...issueFilters,
   {
     key: FilterKey.USER_OS,
     type: FilterType.MULTIPLE,
@@ -884,7 +897,7 @@ export const clickmapFilter = {
 
 const mapFilters = (list) => {
   return list.reduce((acc, filter) => {
-    filter.value = [''];
+    filter.value = filter.value ? [filter.value] : [''];
     acc[filter.key] = filter;
     return acc;
   }, {});