mirror of
https://github.com/open-metadata/OpenMetadata.git
synced 2025-12-24 22:18:41 +00:00
Fix: Tags editor issues (#3362)
This commit is contained in:
parent
d7ec9e4ded
commit
08bf0344a7
@ -25,7 +25,11 @@ import { Operation } from '../../generated/entity/policies/policy';
|
||||
import { LabelType, State } from '../../generated/type/tagLabel';
|
||||
import UserCard from '../../pages/teams/UserCard';
|
||||
import SVGIcons from '../../utils/SvgUtils';
|
||||
import { getTagCategories, getTaglist } from '../../utils/TagsUtils';
|
||||
import {
|
||||
getTagCategories,
|
||||
getTaglist,
|
||||
getTagOptionsFromFQN,
|
||||
} from '../../utils/TagsUtils';
|
||||
import { Button } from '../buttons/Button/Button';
|
||||
import Avatar from '../common/avatar/Avatar';
|
||||
import Description from '../common/description/Description';
|
||||
@ -299,7 +303,7 @@ const GlossaryDetails = ({ isHasAccess, glossary, updateGlossary }: props) => {
|
||||
selectedTags={getSelectedTags()}
|
||||
showTags={false}
|
||||
size="small"
|
||||
tagList={tagList}
|
||||
tagList={getTagOptionsFromFQN(tagList)}
|
||||
type="label"
|
||||
onCancel={() => {
|
||||
handleTagSelection();
|
||||
|
||||
@ -31,7 +31,11 @@ import {
|
||||
import { LabelType, State } from '../../generated/type/tagLabel';
|
||||
import UserCard from '../../pages/teams/UserCard';
|
||||
import SVGIcons from '../../utils/SvgUtils';
|
||||
import { getTagCategories, getTaglist } from '../../utils/TagsUtils';
|
||||
import {
|
||||
getTagCategories,
|
||||
getTaglist,
|
||||
getTagOptionsFromFQN,
|
||||
} from '../../utils/TagsUtils';
|
||||
import { Button } from '../buttons/Button/Button';
|
||||
import Description from '../common/description/Description';
|
||||
import NonAdminAction from '../common/non-admin-action/NonAdminAction';
|
||||
@ -72,7 +76,7 @@ const GlossaryTermsV1 = ({
|
||||
glossaryTerm.synonyms?.join(',') || ''
|
||||
);
|
||||
const [references, setReferences] = useState(glossaryTerm.references || []);
|
||||
const [reviewer, setReviewer] = useState<Array<FormatedUsersData>>([]);
|
||||
const [reviewer, setReviewer] = useState<Array<FormattedUsersData>>([]);
|
||||
const [relatedTerms, setRelatedTerms] = useState<FormattedGlossaryTermData[]>(
|
||||
[]
|
||||
);
|
||||
@ -99,7 +103,7 @@ const GlossaryTermsV1 = ({
|
||||
setShowRelatedTermsModal(false);
|
||||
};
|
||||
|
||||
const handleRelatedTermsSave = (terms: Array<FormatedGlossaryTermData>) => {
|
||||
const handleRelatedTermsSave = (terms: Array<FormattedGlossaryTermData>) => {
|
||||
if (!isEqual(terms, relatedTerms)) {
|
||||
let updatedGlossaryTerm = cloneDeep(glossaryTerm);
|
||||
const oldTerms = terms.filter((d) => includes(relatedTerms, d));
|
||||
@ -288,7 +292,7 @@ const GlossaryTermsV1 = ({
|
||||
|
||||
useEffect(() => {
|
||||
if (glossaryTerm.relatedTerms?.length) {
|
||||
setRelatedTerms(glossaryTerm.relatedTerms as FormatedGlossaryTermData[]);
|
||||
setRelatedTerms(glossaryTerm.relatedTerms as FormattedGlossaryTermData[]);
|
||||
}
|
||||
}, [glossaryTerm.relatedTerms]);
|
||||
|
||||
@ -555,7 +559,7 @@ const GlossaryTermsV1 = ({
|
||||
selectedTags={getSelectedTags()}
|
||||
showTags={false}
|
||||
size="small"
|
||||
tagList={tagList}
|
||||
tagList={getTagOptionsFromFQN(tagList)}
|
||||
type="label"
|
||||
onCancel={() => {
|
||||
handleTagSelection();
|
||||
|
||||
@ -12,12 +12,12 @@
|
||||
*/
|
||||
|
||||
import classNames from 'classnames';
|
||||
import { FormatedGlossaryTermData } from 'Models';
|
||||
import { FormattedGlossaryTermData } from 'Models';
|
||||
import React, { ReactNode } from 'react';
|
||||
import RichTextEditorPreviewer from '../../common/rich-text-editor/RichTextEditorPreviewer';
|
||||
|
||||
type Props = {
|
||||
data?: FormatedGlossaryTermData[];
|
||||
data?: FormattedGlossaryTermData[];
|
||||
addButton?: ReactNode;
|
||||
};
|
||||
|
||||
|
||||
@ -12,7 +12,6 @@
|
||||
*/
|
||||
|
||||
import React from 'react';
|
||||
import { TagOption } from 'Models';
|
||||
|
||||
export enum DropDownType {
|
||||
LINK = 'link',
|
||||
@ -22,7 +21,7 @@ export enum DropDownType {
|
||||
|
||||
export type DropDownListItem = {
|
||||
name: string | React.ReactElement;
|
||||
value?: string | TagOption;
|
||||
value?: string;
|
||||
group?: string;
|
||||
to?: string;
|
||||
disabled?: boolean;
|
||||
|
||||
@ -20,7 +20,7 @@ export type TagsContainerProps = {
|
||||
editable?: boolean;
|
||||
dropDownHorzPosRight?: boolean;
|
||||
selectedTags: Array<EntityTags>;
|
||||
tagList: Array<TagOption>;
|
||||
tagList: Array<TagOption | string>;
|
||||
type?: TagProps['type'];
|
||||
showTags?: boolean;
|
||||
onSelectionChange: (selectedTags: Array<EntityTags>) => void;
|
||||
|
||||
@ -13,7 +13,7 @@
|
||||
|
||||
import classNames from 'classnames';
|
||||
import { isNull } from 'lodash';
|
||||
import { EntityTags } from 'Models';
|
||||
import { EntityTags, TagOption } from 'Models';
|
||||
import React, { FunctionComponent, useEffect, useRef, useState } from 'react';
|
||||
import { withLoader } from '../../hoc/withLoader';
|
||||
import { Button } from '../buttons/Button/Button';
|
||||
@ -70,7 +70,7 @@ const TagsContainer: FunctionComponent<TagsContainerProps> = ({
|
||||
}, [newTag]);
|
||||
|
||||
const getTagList = () => {
|
||||
const newTags = tagList
|
||||
const newTags = (tagList as TagOption[])
|
||||
.filter((tag) => {
|
||||
return !tags.some((selectedTag) => selectedTag.tagFQN === tag.fqn);
|
||||
})
|
||||
@ -93,7 +93,9 @@ const TagsContainer: FunctionComponent<TagsContainerProps> = ({
|
||||
event.stopPropagation();
|
||||
if (selectedTag) {
|
||||
setTags((arrTags) => {
|
||||
const source = tagList.find((tag) => tag.fqn === selectedTag)?.source;
|
||||
const source = (tagList as TagOption[]).find(
|
||||
(tag) => tag.fqn === selectedTag
|
||||
)?.source;
|
||||
|
||||
return [...arrTags, { tagFQN: selectedTag, source }];
|
||||
});
|
||||
|
||||
@ -31,6 +31,7 @@ const Tags: FunctionComponent<TagProps> = ({
|
||||
const baseStyle = tagStyles.base;
|
||||
const layoutStyles = tagStyles[type];
|
||||
const textBaseStyle = tagStyles.text.base;
|
||||
const textLayoutStyles = tagStyles.text[type] || tagStyles.text.default;
|
||||
const textEditStyles = editable ? tagStyles.text.editable : '';
|
||||
|
||||
const getTagString = (tag: string) => {
|
||||
@ -42,7 +43,12 @@ const Tags: FunctionComponent<TagProps> = ({
|
||||
<span
|
||||
className={classNames(baseStyle, layoutStyles, className)}
|
||||
data-testid="tags">
|
||||
<span className={classNames(textBaseStyle, textEditStyles)}>
|
||||
<span
|
||||
className={classNames(
|
||||
textBaseStyle,
|
||||
textLayoutStyles,
|
||||
textEditStyles
|
||||
)}>
|
||||
{`${startWith}${tag}`}
|
||||
</span>
|
||||
{editable && isRemovable && (
|
||||
|
||||
@ -54,7 +54,11 @@ import {
|
||||
isUrlFriendlyName,
|
||||
} from '../../utils/CommonUtils';
|
||||
import SVGIcons from '../../utils/SvgUtils';
|
||||
import { getTagCategories, getTaglist } from '../../utils/TagsUtils';
|
||||
import {
|
||||
getTagCategories,
|
||||
getTaglist,
|
||||
getTagOptionsFromFQN,
|
||||
} from '../../utils/TagsUtils';
|
||||
import Form from './Form';
|
||||
// import { Tag, TagsCategory } from './tagsTypes';
|
||||
const TagsPage = () => {
|
||||
@ -73,9 +77,11 @@ const TagsPage = () => {
|
||||
const [errorDataTag, setErrorDataTag] = useState<FormErrorData>();
|
||||
|
||||
const getTags = useCallback(() => {
|
||||
return getTaglist(categories).filter(
|
||||
const filteredTags = getTaglist(categories).filter(
|
||||
(tag) => editTag?.fullyQualifiedName !== tag
|
||||
);
|
||||
|
||||
return getTagOptionsFromFQN(filteredTags);
|
||||
}, [currentCategory, editTag]);
|
||||
|
||||
const fetchCategories = () => {
|
||||
|
||||
@ -13,7 +13,7 @@
|
||||
|
||||
import { AxiosError, AxiosPromise, AxiosResponse } from 'axios';
|
||||
import { flatten } from 'lodash';
|
||||
import { EntityTags, TableColumn } from 'Models';
|
||||
import { EntityTags, TableColumn, TagOption } from 'Models';
|
||||
import { getCategory, getTags } from '../axiosAPIs/tagAPI';
|
||||
import { TagCategory, TagClass } from '../generated/entity/tags/tagCategory';
|
||||
|
||||
@ -86,3 +86,11 @@ export const getTableTags = (
|
||||
|
||||
return uniqueTags;
|
||||
};
|
||||
|
||||
export const getTagOptionsFromFQN = (
|
||||
tagFQNs: Array<string>
|
||||
): Array<TagOption> => {
|
||||
return tagFQNs.map((tag) => {
|
||||
return { fqn: tag, source: 'Tag' };
|
||||
});
|
||||
};
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user