diff --git a/web/components/views/applied-filters/filter-item-map.tsx b/web/components/views/applied-filters/filter-item-map.tsx
index c821ea696..d79ff0438 100644
--- a/web/components/views/applied-filters/filter-item-map.tsx
+++ b/web/components/views/applied-filters/filter-item-map.tsx
@@ -1,4 +1,5 @@
 import { FC, useMemo } from "react";
+import { observer } from "mobx-react";
 // components
 import { ViewAppliedFiltersItem } from "./";
 // hooks
@@ -13,7 +14,7 @@ type TViewAppliedFiltersItemMap = {
   filterValue: string[];
 };
 
-export const ViewAppliedFiltersItemMap: FC<TViewAppliedFiltersItemMap> = (props) => {
+export const ViewAppliedFiltersItemMap: FC<TViewAppliedFiltersItemMap> = observer((props) => {
   const { workspaceSlug, projectId, filterKey, filterValue } = props;
   // hooks
   const viewFilterStore = useViewFilter(workspaceSlug, projectId);
@@ -23,7 +24,7 @@ export const ViewAppliedFiltersItemMap: FC<TViewAppliedFiltersItemMap> = (props)
     [viewFilterStore, filterKey]
   );
 
-  const propertyVisibleCount = 5;
+  const propertyVisibleCount = 3;
 
   if (!filterValue) return <></>;
 
@@ -54,4 +55,4 @@ export const ViewAppliedFiltersItemMap: FC<TViewAppliedFiltersItemMap> = (props)
       </div>
     </div>
   );
-};
+});
diff --git a/web/components/views/applied-filters/filter-item.tsx b/web/components/views/applied-filters/filter-item.tsx
index 6d2382a3b..fc943d1ce 100644
--- a/web/components/views/applied-filters/filter-item.tsx
+++ b/web/components/views/applied-filters/filter-item.tsx
@@ -1,8 +1,11 @@
 import { FC } from "react";
+import { observer } from "mobx-react";
+// hooks
+import { useViewFilter } from "hooks/user-view-filters";
+// icons
 import { ImagePlus } from "lucide-react";
 // types
 import { IIssueFilterOptions } from "@plane/types";
-import { useViewFilter } from "hooks/user-view-filters";
 
 type TViewAppliedFiltersItem = {
   workspaceSlug: string;
@@ -11,7 +14,7 @@ type TViewAppliedFiltersItem = {
   propertyId: string;
 };
 
-export const ViewAppliedFiltersItem: FC<TViewAppliedFiltersItem> = (props) => {
+export const ViewAppliedFiltersItem: FC<TViewAppliedFiltersItem> = observer((props) => {
   const { workspaceSlug, projectId, filterKey, propertyId } = props;
   // hooks
   const viewFilterHelper = useViewFilter(workspaceSlug, projectId);
@@ -29,4 +32,4 @@ export const ViewAppliedFiltersItem: FC<TViewAppliedFiltersItem> = (props) => {
       <div className="text-xs">{propertyDetail?.label || propertyId}</div>
     </div>
   );
-};
+});