diff --git a/frontend/app/components/Dashboard/components/DashboardList/DashboardList.tsx b/frontend/app/components/Dashboard/components/DashboardList/DashboardList.tsx
index 93649babf..5ce208da8 100644
--- a/frontend/app/components/Dashboard/components/DashboardList/DashboardList.tsx
+++ b/frontend/app/components/Dashboard/components/DashboardList/DashboardList.tsx
@@ -2,21 +2,11 @@ import { observer } from 'mobx-react-lite';
 import React from 'react';
 import { NoContent, Pagination } from 'UI';
 import { useStore } from 'App/mstore';
-import { getRE } from 'App/utils';
+import { filterList } from 'App/utils';
 import { sliceListPerPage } from 'App/utils';
 import AnimatedSVG, { ICONS } from 'Shared/AnimatedSVG/AnimatedSVG';
 import DashboardListItem from './DashboardListItem';
 
-const filterList = <T extends Record<string, any>>(list: T[], searchQuery: string): T[] => {
-  const filterRE = getRE(searchQuery, 'i');
-  console.log(filterRE)
-  let _list = list.filter((w: T) => {
-      console.log(w.name, w.owner, w.description, filterRE.test(w.name))
-      return filterRE.test(w.name) || filterRE.test(w.owner) || filterRE.test(w.description);
-  });
-  return _list
-}
-
 function DashboardList() {
     const { dashboardStore } = useStore();
     const [shownDashboards, setDashboards] = React.useState([]);
@@ -24,7 +14,7 @@ function DashboardList() {
     const dashboardsSearch = dashboardStore.dashboardsSearch;
 
     React.useEffect(() => {
-      setDashboards(filterList(dashboards, dashboardsSearch))
+      setDashboards(filterList(dashboards, dashboardsSearch, ['name', 'owner', 'description']))
     }, [dashboardsSearch])
     
     const list = dashboardsSearch !== '' ? shownDashboards : dashboards;
diff --git a/frontend/app/components/Dashboard/components/MetricsList/MetricsList.tsx b/frontend/app/components/Dashboard/components/MetricsList/MetricsList.tsx
index 2b236564e..166be1b40 100644
--- a/frontend/app/components/Dashboard/components/MetricsList/MetricsList.tsx
+++ b/frontend/app/components/Dashboard/components/MetricsList/MetricsList.tsx
@@ -2,24 +2,24 @@ import { useObserver } from 'mobx-react-lite';
 import React, { useEffect } from 'react';
 import { NoContent, Pagination } from 'UI';
 import { useStore } from 'App/mstore';
-import { getRE } from 'App/utils';
+import { getRE, filterList } from 'App/utils';
 import MetricListItem from '../MetricListItem';
 import { sliceListPerPage } from 'App/utils';
 import AnimatedSVG, { ICONS } from 'Shared/AnimatedSVG/AnimatedSVG';
+import { IWidget } from 'App/mstore/types/widget';
 
 function MetricsList() {
     const { metricStore } = useStore();
     const metrics = useObserver(() => metricStore.metrics);
     const metricsSearch = useObserver(() => metricStore.metricsSearch);
-    const filterList = <T extends Record<string, any>>(list: T[]): T[] => {
-        const filterRE = getRE(metricsSearch, 'i');
-        let _list = list.filter((w: T) => {
-            const dashbaordNames = w.dashboards.map((d: any) => d.name).join(' ');
-            return filterRE.test(w.name) || filterRE.test(w.metricType) || filterRE.test(w.owner) || filterRE.test(dashbaordNames);
-        });
-        return _list
+
+    const filterByDashboard = (item: IWidget, searchRE: RegExp) => {
+        const dashboardsStr = item.dashboards.map((d: any) => d.name).join(' ')
+        return searchRE.test(dashboardsStr)
     }
-    const list = metricsSearch !== '' ? filterList(metrics) : metrics;
+    const list = metricsSearch !== '' 
+    ? filterList(metrics, metricsSearch, ['name', 'metricType', 'owner'], filterByDashboard) 
+    : metrics;
     const lenth = list.length;
 
     useEffect(() => {
diff --git a/frontend/app/utils.ts b/frontend/app/utils.ts
index d0bfb9b56..7694f245a 100644
--- a/frontend/app/utils.ts
+++ b/frontend/app/utils.ts
@@ -53,7 +53,7 @@ export const cutURL = (url, prefix = '.../') => `${prefix + url.split('/').slice
 
 export const escapeRegExp = (string) => string.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
 
-export function getRE(string, options) {
+export function getRE(string: string, options: string) {
     let re;
     try {
         re = new RegExp(string, options);
@@ -63,6 +63,19 @@ export function getRE(string, options) {
     return re;
 }
 
+export const filterList = <T extends Record<string, any>>(
+    list: T[], 
+    searchQuery: string, 
+    testKeys: string[], 
+    searchCb?: (listItem: T, query: string | RegExp
+) => boolean): T[] => {
+    const filterRE = getRE(searchQuery, 'i');
+    let _list = list.filter((listItem: T) => {
+        return testKeys.some((key) => filterRE.test(listItem[key]) || searchCb?.(listItem, filterRE));
+    });
+    return _list
+  }
+
 export const getStateColor = (state) => {
     switch (state) {
         case 'passed':