diff --git a/catalog-rest-service/src/main/resources/ui/src/components/app-bar/Suggestions.tsx b/catalog-rest-service/src/main/resources/ui/src/components/app-bar/Suggestions.tsx
index aeaba1001d1..2ec771ee1b9 100644
--- a/catalog-rest-service/src/main/resources/ui/src/components/app-bar/Suggestions.tsx
+++ b/catalog-rest-service/src/main/resources/ui/src/components/app-bar/Suggestions.tsx
@@ -21,6 +21,7 @@ import { Link } from 'react-router-dom';
import { getSuggestions } from '../../axiosAPIs/miscAPI';
import { SearchIndex } from '../../enums/search.enum';
import { serviceTypeLogo } from '../../utils/ServiceUtils';
+import SVGIcons, { Icons } from '../../utils/SvgUtils';
import { getEntityLink } from '../../utils/TableUtils';
type SuggestionProp = {
@@ -84,24 +85,31 @@ const Suggestions = ({ searchText, isOpen, setIsOpen }: SuggestionProp) => {
const getGroupLabel = (index: string) => {
let label = '';
+ let icon = '';
switch (index) {
case SearchIndex.TOPIC:
label = 'Topics';
+ icon = Icons.TOPIC_GREY;
break;
case SearchIndex.DASHBOARD:
label = 'Dashboards';
+ icon = Icons.DASHBOARD_GREY;
break;
case SearchIndex.TABLE:
default:
label = 'Tables';
+ icon = Icons.TABLE_GREY;
break;
}
return (
-
{label}
+
);
};
diff --git a/catalog-rest-service/src/main/resources/ui/src/pages/explore/explore.constants.ts b/catalog-rest-service/src/main/resources/ui/src/pages/explore/explore.constants.ts
index ba356eff70f..d031d3e9192 100644
--- a/catalog-rest-service/src/main/resources/ui/src/pages/explore/explore.constants.ts
+++ b/catalog-rest-service/src/main/resources/ui/src/pages/explore/explore.constants.ts
@@ -23,6 +23,7 @@ import {
topicSortingFields,
} from '../../constants/constants';
import { SearchIndex } from '../../enums/search.enum';
+import { Icons } from '../../utils/SvgUtils';
export const getBucketList = (buckets: Array) => {
let bucketList: Array = [...tiers];
@@ -67,6 +68,7 @@ export const tabsInfo = [
sortField: tableSortingFields[0].value,
tab: 1,
path: 'tables',
+ icon: Icons.TABLE_GREY,
},
{
label: 'Topics',
@@ -75,6 +77,7 @@ export const tabsInfo = [
sortField: topicSortingFields[0].value,
tab: 2,
path: 'topics',
+ icon: Icons.TOPIC_GREY,
},
{
label: 'Dashboards',
@@ -83,5 +86,6 @@ export const tabsInfo = [
sortField: topicSortingFields[0].value,
tab: 3,
path: 'dashboards',
+ icon: Icons.DASHBOARD_GREY,
},
];
diff --git a/catalog-rest-service/src/main/resources/ui/src/pages/explore/index.tsx b/catalog-rest-service/src/main/resources/ui/src/pages/explore/index.tsx
index e20eb3317a0..524c4768311 100644
--- a/catalog-rest-service/src/main/resources/ui/src/pages/explore/index.tsx
+++ b/catalog-rest-service/src/main/resources/ui/src/pages/explore/index.tsx
@@ -46,6 +46,7 @@ import { formatDataResponse } from '../../utils/APIUtils';
import { getCountBadge } from '../../utils/CommonUtils';
import { getFilterString } from '../../utils/FilterUtils';
import { dropdownIcon as DropDownIcon } from '../../utils/svgconstant';
+import SVGIcons from '../../utils/SvgUtils';
import { getAggrWithDefaultValue, tabsInfo } from './explore.constants';
import { Params } from './explore.interface';
@@ -469,6 +470,11 @@ const ExplorePage: React.FC = (): React.ReactElement => {
onClick={() => {
onTabChange(tab.tab);
}}>
+
{tab.label}
{getTabCount(tab.index)}