mirror of
https://github.com/datahub-project/datahub.git
synced 2025-10-29 17:59:24 +00:00
feat(frontend): add additional tabs to glossary terms view (#7392)
Adds tabs for "Contained by" and "Inherited by" on the Glossary Related Terms tab.
This commit is contained in:
parent
d436ab9f9b
commit
79aa66ab0a
@ -12,6 +12,8 @@ import RelatedTerm from './RelatedTerm';
|
||||
export enum RelatedTermTypes {
|
||||
hasRelatedTerms = 'Contains',
|
||||
isRelatedTerms = 'Inherits',
|
||||
containedBy = 'Contained by',
|
||||
isAChildren = 'Inherited by',
|
||||
}
|
||||
|
||||
export type Props = {
|
||||
@ -42,9 +44,13 @@ export default function GlossaryRelatedTermsResult({ glossaryRelatedTermType, gl
|
||||
});
|
||||
const contentLoading = false;
|
||||
const relationshipType =
|
||||
glossaryRelatedTermType === RelatedTermTypes.hasRelatedTerms
|
||||
glossaryRelatedTermType === RelatedTermTypes.hasRelatedTerms ||
|
||||
glossaryRelatedTermType === RelatedTermTypes.containedBy
|
||||
? TermRelationshipType.HasA
|
||||
: TermRelationshipType.IsA;
|
||||
const canEditRelatedTerms =
|
||||
glossaryRelatedTermType === RelatedTermTypes.isRelatedTerms ||
|
||||
glossaryRelatedTermType === RelatedTermTypes.hasRelatedTerms;
|
||||
|
||||
return (
|
||||
<>
|
||||
@ -56,12 +62,19 @@ export default function GlossaryRelatedTermsResult({ glossaryRelatedTermType, gl
|
||||
<Typography.Title style={{ margin: '0' }} level={3}>
|
||||
{glossaryRelatedTermType}
|
||||
</Typography.Title>
|
||||
<Button type="text" onClick={() => setIsShowingAddModal(true)}>
|
||||
<PlusOutlined /> Add Terms
|
||||
</Button>
|
||||
{canEditRelatedTerms && (
|
||||
<Button type="text" onClick={() => setIsShowingAddModal(true)}>
|
||||
<PlusOutlined /> Add Terms
|
||||
</Button>
|
||||
)}
|
||||
</TitleContainer>
|
||||
{glossaryRelatedTermUrns.map((urn) => (
|
||||
<RelatedTerm key={urn} urn={urn} relationshipType={relationshipType} />
|
||||
<RelatedTerm
|
||||
key={urn}
|
||||
urn={urn}
|
||||
relationshipType={relationshipType}
|
||||
isEditable={canEditRelatedTerms}
|
||||
/>
|
||||
))}
|
||||
{glossaryRelatedTermUrns.length === 0 && (
|
||||
<EmptyTab tab={glossaryRelatedTermType.toLocaleLowerCase()} />
|
||||
|
||||
@ -35,10 +35,11 @@ const MenuItem = styled.div`
|
||||
interface Props {
|
||||
urn: string;
|
||||
relationshipType: TermRelationshipType;
|
||||
isEditable: boolean;
|
||||
}
|
||||
|
||||
function RelatedTerm(props: Props) {
|
||||
const { urn, relationshipType } = props;
|
||||
const { urn, relationshipType, isEditable } = props;
|
||||
|
||||
const entityRegistry = useEntityRegistry();
|
||||
const { data, loading } = useGetGlossaryTermQuery({ variables: { urn } });
|
||||
@ -54,20 +55,22 @@ function RelatedTerm(props: Props) {
|
||||
<ListItem>
|
||||
<Profile>
|
||||
{entityRegistry.renderPreview(EntityType.GlossaryTerm, PreviewType.PREVIEW, data?.glossaryTerm)}
|
||||
<Dropdown
|
||||
overlay={
|
||||
<Menu>
|
||||
<Menu.Item key="0">
|
||||
<MenuItem onClick={onRemove}>
|
||||
<DeleteOutlined /> Remove Term
|
||||
</MenuItem>
|
||||
</Menu.Item>
|
||||
</Menu>
|
||||
}
|
||||
trigger={['click']}
|
||||
>
|
||||
<MenuIcon />
|
||||
</Dropdown>
|
||||
{isEditable && (
|
||||
<Dropdown
|
||||
overlay={
|
||||
<Menu>
|
||||
<Menu.Item key="0">
|
||||
<MenuItem onClick={onRemove}>
|
||||
<DeleteOutlined /> Remove Term
|
||||
</MenuItem>
|
||||
</Menu.Item>
|
||||
</Menu>
|
||||
}
|
||||
trigger={['click']}
|
||||
>
|
||||
<MenuIcon />
|
||||
</Dropdown>
|
||||
)}
|
||||
</Profile>
|
||||
<Divider style={{ margin: '20px 0' }} />
|
||||
</ListItem>
|
||||
|
||||
@ -51,12 +51,20 @@ export const EMPTY_MESSAGES = {
|
||||
},
|
||||
contains: {
|
||||
title: 'Contains no Terms',
|
||||
description: 'Terms can contain other terms to represent an "Has A" style relationship.',
|
||||
description: 'Terms can contain other terms to represent a "Has A" style relationship.',
|
||||
},
|
||||
inherits: {
|
||||
title: 'Does not inherit from any terms',
|
||||
description: 'Terms can inherit from other terms to represent an "Is A" style relationship.',
|
||||
},
|
||||
'contained by': {
|
||||
title: 'Is not contained by any terms',
|
||||
description: 'Terms can be contained by other terms to represent a "Has A" style relationship.',
|
||||
},
|
||||
'inherited by': {
|
||||
title: 'Is not inherited by any terms',
|
||||
description: 'Terms can be inherited by other terms to represent an "Is A" style relationship.',
|
||||
},
|
||||
};
|
||||
|
||||
export const ELASTIC_MAX_COUNT = 10000;
|
||||
|
||||
@ -42,6 +42,18 @@ query getGlossaryTerm($urn: String!, $start: Int, $count: Int) {
|
||||
}
|
||||
}
|
||||
}
|
||||
containedBy: relationships(input: { types: ["HasA"], direction: INCOMING, start: $start, count: $count }) {
|
||||
start
|
||||
count
|
||||
total
|
||||
relationships {
|
||||
entity {
|
||||
... on GlossaryTerm {
|
||||
urn
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
parentNodes {
|
||||
...parentNodesFields
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user