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

Add default icons for domains and data product (#23633)

Browse Source
This commit is contained in:
Ushran Gouhar 2025-09-30 17:39:26 +05:30 committed by GitHub
parent 9738a64b6f
commit f093042245
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
4 changed files with 29 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
openmetadata-ui/src/main/resources/ui/src/components/Domain/AddDomainForm/AddDomainForm.component.tsx
View File

@ -36,6 +36,10 @@ import {
} from '../../../utils/DomainUtils';
import { generateFormFields, getField } from '../../../utils/formUtils';
import { checkPermission } from '../../../utils/PermissionsUtils';
import {
DEFAULT_DATA_PRODUCT_ICON,
DEFAULT_DOMAIN_ICON,
} from '../../common/IconPicker';
import '../domain.less';
import { DomainFormType } from '../DomainPage.interface';
import { AddDomainFormProps } from './AddDomainForm.interface';
@ -74,6 +78,10 @@ const AddDomainForm = ({
allowUrl: true,
placeholder: t('label.icon-url'),
backgroundColor: selectedColor,
defaultIcon:
type === DomainFormType.DATA_PRODUCT
? DEFAULT_DATA_PRODUCT_ICON
: DEFAULT_DOMAIN_ICON,
},
formItemLayout: FormItemLayout.HORIZONTAL,
formItemProps: {

12
openmetadata-ui/src/main/resources/ui/src/components/common/IconPicker/IconPicker.constants.ts
View File

@ -56,7 +56,17 @@ import {
} from '@untitledui/icons';
import { IconDefinition } from './IconPicker.interface';
export const DEFAULT_ICON = 'Cube01';
export const DEFAULT_ICON_NAME = 'Cube01';
export const DEFAULT_DOMAIN_ICON: IconDefinition = {
name: 'Globe01',
component: Globe01,
category: 'default',
};
export const DEFAULT_DATA_PRODUCT_ICON: IconDefinition = {
name: 'Cube01',
component: Cube01,
category: 'default',
};
export const AVAILABLE_ICONS: IconDefinition[] = [
{ name: 'Cube01', component: Cube01, category: 'default' },

1
openmetadata-ui/src/main/resources/ui/src/components/common/IconPicker/IconPicker.interface.ts
View File

@ -37,4 +37,5 @@ export interface MUIIconPickerProps {
allowUrl?: boolean;
backgroundColor?: string;
toolTip?: ReactNode;
defaultIcon?: IconDefinition;
}

16
openmetadata-ui/src/main/resources/ui/src/components/common/IconPicker/MUIIconPicker.tsx
View File

@ -27,7 +27,7 @@ import { FC, useEffect, useRef, useState } from 'react';
import { useTranslation } from 'react-i18next';
import { renderIcon } from '../../../utils/IconUtils';
import { useSearch } from '../atoms/navigation/useSearch';
import { AVAILABLE_ICONS, DEFAULT_ICON } from './IconPicker.constants';
import { AVAILABLE_ICONS, DEFAULT_ICON_NAME } from './IconPicker.constants';
import {
IconPickerTabValue,
IconPickerValue,
@ -42,6 +42,7 @@ const MUIIconPicker: FC<MUIIconPickerProps> = ({
placeholder = 'Enter icon URL',
value,
toolTip,
defaultIcon,
onChange,
}) => {
const theme = useTheme();
@ -49,10 +50,11 @@ const MUIIconPicker: FC<MUIIconPickerProps> = ({
const anchorRef = useRef<HTMLDivElement>(null);
const [open, setOpen] = useState(false);
const [searchQuery, setSearchQuery] = useState('');
const resolvedIconName = defaultIcon?.name || DEFAULT_ICON_NAME;
const parseValue = (val: string | IconPickerValue | undefined) => {
if (!val) {
return { type: 'icons' as IconPickerTabValue, value: DEFAULT_ICON };
return { type: 'icons' as IconPickerTabValue, value: resolvedIconName };
}
if (typeof val === 'string') {
if (val.startsWith('http') || val.startsWith('/')) {
@ -241,7 +243,7 @@ const MUIIconPicker: FC<MUIIconPickerProps> = ({
</Box>
<Box
aria-label={`Select icon ${DEFAULT_ICON}`}
aria-label={`Select icon ${resolvedIconName}`}
role="button"
sx={{
position: 'relative',
@ -255,7 +257,7 @@ const MUIIconPicker: FC<MUIIconPickerProps> = ({
transition: 'all 0.2s',
backgroundColor: 'transparent',
color:
selectedIcon === DEFAULT_ICON
selectedIcon === resolvedIconName
? theme.palette.primary?.main
: theme.palette.grey?.[700],
'&:hover': {
@ -264,14 +266,14 @@ const MUIIconPicker: FC<MUIIconPickerProps> = ({
mb: 2,
}}
tabIndex={0}
onClick={() => handleIconSelect(DEFAULT_ICON)}
onClick={() => handleIconSelect(resolvedIconName)}
onKeyDown={(e) => {
if (e.key === 'Enter' || e.key === ' ') {
e.preventDefault();
handleIconSelect(DEFAULT_ICON);
handleIconSelect(resolvedIconName);
}
}}>
{AVAILABLE_ICONS[0].component({
{(defaultIcon?.component || AVAILABLE_ICONS[0].component)({
size: 20,
style: { display: 'block', strokeWidth: 1.25 },
})}