yujunjun/OpenMetadata
1
0
Fork 0
mirror of https://github.com/open-metadata/OpenMetadata.git synced 2025-10-31 18:48:35 +00:00
Code Issues Packages Projects Releases Wiki Activity

Added entity icons on explore tabs and suggestion dropdown (#436)

Browse Source
This commit is contained in:
Sachin Chaurasiya 2021-09-08 17:19:26 +05:30 committed by GitHub
parent bdad904e82
commit 297fdaea8d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 19 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
catalog-rest-service/src/main/resources/ui/src/components/app-bar/Suggestions.tsx
View File

@ -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 (
<p className="tw-px-2 tw-py-2 tw-text-grey-muted tw-text-xs">{label}</p>
<div className="tw-flex tw-gap-2 tw-px-2 tw-py-2">
<SVGIcons alt="icon" className="tw-h-4 tw-w-4" icon={icon} />
<p className="tw-text-grey-muted tw-text-xs">{label}</p>
</div>
);
};

4
catalog-rest-service/src/main/resources/ui/src/pages/explore/explore.constants.ts
View File

@ -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<Bucket>) => {
let bucketList: Array<Bucket> = [...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,
},
];

6
catalog-rest-service/src/main/resources/ui/src/pages/explore/index.tsx
View File

@ -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);
}}>
<SVGIcons
alt="icon"
className="tw-h-4 tw-w-4 tw-mr-2"
icon={tab.icon}
/>
{tab.label}
{getTabCount(tab.index)}
</button>