From 42b0470a76165c22a5f4626b5341a3f7520486af Mon Sep 17 00:00:00 2001 From: Chris Collins Date: Thu, 12 Dec 2024 12:28:06 -0500 Subject: [PATCH 1/3] feat(ui) Add finishing touches to the structured props feature --- .../SchemaFieldPropertiesEntity.tsx | 6 ++---- .../components/styled/DeprecationPill.tsx | 2 -- ...ngInput.tsx => MultipleOpenEndedInput.tsx} | 13 +++++++----- .../styled/StructuredProperty/NumberInput.tsx | 20 ++++++++++++++++++- .../styled/StructuredProperty/StringInput.tsx | 13 +++++++++--- .../StructuredPropertyInput.tsx | 6 +++++- .../profile/header/EntityHeader.tsx | 1 + .../containers/profile/header/EntityName.tsx | 2 -- .../StructuredPropsDrawer.tsx | 1 + .../govern/structuredProperties/cacheUtils.ts | 1 - .../src/app/preview/DefaultPreviewCard.tsx | 2 +- datahub-web-react/src/graphql/search.graphql | 1 + .../authorization/PoliciesConfig.java | 1 + 13 files changed, 49 insertions(+), 20 deletions(-) rename datahub-web-react/src/app/entity/shared/components/styled/StructuredProperty/{MultipleStringInput.tsx => MultipleOpenEndedInput.tsx} (87%) diff --git a/datahub-web-react/src/app/entity/schemaField/SchemaFieldPropertiesEntity.tsx b/datahub-web-react/src/app/entity/schemaField/SchemaFieldPropertiesEntity.tsx index 2c59c476195d0b..fdc0e33d77a057 100644 --- a/datahub-web-react/src/app/entity/schemaField/SchemaFieldPropertiesEntity.tsx +++ b/datahub-web-react/src/app/entity/schemaField/SchemaFieldPropertiesEntity.tsx @@ -35,11 +35,9 @@ export class SchemaFieldPropertiesEntity implements Entity { // Currently unused. getPathName = () => 'schemaField'; - // Currently unused. - getEntityName = () => 'schemaField'; + getEntityName = () => 'Column'; - // Currently unused. - getCollectionName = () => 'schemaFields'; + getCollectionName = () => 'Columns'; // Currently unused. renderProfile = (_: string) => <>; diff --git a/datahub-web-react/src/app/entity/shared/components/styled/DeprecationPill.tsx b/datahub-web-react/src/app/entity/shared/components/styled/DeprecationPill.tsx index 08e9636f760de5..613264709ac23c 100644 --- a/datahub-web-react/src/app/entity/shared/components/styled/DeprecationPill.tsx +++ b/datahub-web-react/src/app/entity/shared/components/styled/DeprecationPill.tsx @@ -19,8 +19,6 @@ const DeprecatedContainer = styled.div` justify-content: center; align-items: center; color: #cd0d24; - margin-left: 0px; - margin-right: 8px; padding-top: 8px; padding-bottom: 8px; padding-right: 4px; diff --git a/datahub-web-react/src/app/entity/shared/components/styled/StructuredProperty/MultipleStringInput.tsx b/datahub-web-react/src/app/entity/shared/components/styled/StructuredProperty/MultipleOpenEndedInput.tsx similarity index 87% rename from datahub-web-react/src/app/entity/shared/components/styled/StructuredProperty/MultipleStringInput.tsx rename to datahub-web-react/src/app/entity/shared/components/styled/StructuredProperty/MultipleOpenEndedInput.tsx index fe6c0bbb99ce22..fe6cd1115419ae 100644 --- a/datahub-web-react/src/app/entity/shared/components/styled/StructuredProperty/MultipleStringInput.tsx +++ b/datahub-web-react/src/app/entity/shared/components/styled/StructuredProperty/MultipleOpenEndedInput.tsx @@ -4,6 +4,8 @@ import React from 'react'; import styled from 'styled-components'; import { ANTD_GRAY_V2 } from '../../../constants'; +const MultiStringWrapper = styled.div``; + const StyledInput = styled(Input)` width: 75%; min-width: 350px; @@ -29,10 +31,11 @@ const DeleteButton = styled(Button)` interface Props { selectedValues: any[]; + inputType?: string; updateSelectedValues: (values: any[]) => void; } -export default function MultipleStringInput({ selectedValues, updateSelectedValues }: Props) { +export default function MultipleOpenEndedInput({ selectedValues, updateSelectedValues, inputType = 'text' }: Props) { function updateInput(text: string, index: number) { const updatedValues = selectedValues.length > 0 ? selectedValues.map((value, i) => (i === index ? text : value)) : [text]; @@ -53,14 +56,14 @@ export default function MultipleStringInput({ selectedValues, updateSelectedValu } return ( -
+ {selectedValues.length > 1 && selectedValues.map((selectedValue, index) => { const key = `${index}`; return ( updateInput(e.target.value, index)} /> @@ -70,7 +73,7 @@ export default function MultipleStringInput({ selectedValues, updateSelectedValu })} {selectedValues.length <= 1 && ( updateInput(e.target.value, 0)} /> @@ -78,6 +81,6 @@ export default function MultipleStringInput({ selectedValues, updateSelectedValu + Add More -
+ ); } diff --git a/datahub-web-react/src/app/entity/shared/components/styled/StructuredProperty/NumberInput.tsx b/datahub-web-react/src/app/entity/shared/components/styled/StructuredProperty/NumberInput.tsx index c56d85db7ef712..f4cedc4cf80ee5 100644 --- a/datahub-web-react/src/app/entity/shared/components/styled/StructuredProperty/NumberInput.tsx +++ b/datahub-web-react/src/app/entity/shared/components/styled/StructuredProperty/NumberInput.tsx @@ -1,7 +1,9 @@ import { Input } from 'antd'; import React, { ChangeEvent } from 'react'; import styled from 'styled-components'; +import { PropertyCardinality } from '@src/types.generated'; import { ANTD_GRAY_V2 } from '../../../constants'; +import MultipleOpenEndedInput from './MultipleOpenEndedInput'; const StyledInput = styled(Input)` border: 1px solid ${ANTD_GRAY_V2[6]}; @@ -10,15 +12,31 @@ const StyledInput = styled(Input)` interface Props { selectedValues: any[]; + cardinality?: PropertyCardinality | null; updateSelectedValues: (values: string[] | number[]) => void; } -export default function NumberInput({ selectedValues, updateSelectedValues }: Props) { +export default function NumberInput({ selectedValues, cardinality, updateSelectedValues }: Props) { function updateInput(event: ChangeEvent) { const number = Number(event.target.value); updateSelectedValues([number]); } + function updateMultipleValues(values: string[] | number[]) { + const numbers = values.map((v) => Number(v)); + updateSelectedValues(numbers); + } + + if (cardinality === PropertyCardinality.Multiple) { + return ( + + ); + } + return ( ; + return ; } - return ; + return ( + + ); } diff --git a/datahub-web-react/src/app/entity/shared/components/styled/StructuredProperty/StructuredPropertyInput.tsx b/datahub-web-react/src/app/entity/shared/components/styled/StructuredProperty/StructuredPropertyInput.tsx index 894a304335b0f6..305347ee0bce80 100644 --- a/datahub-web-react/src/app/entity/shared/components/styled/StructuredProperty/StructuredPropertyInput.tsx +++ b/datahub-web-react/src/app/entity/shared/components/styled/StructuredProperty/StructuredPropertyInput.tsx @@ -60,7 +60,11 @@ export default function StructuredPropertyInput({ )} {!allowedValues && valueType.info.type === StdDataType.Number && ( - + )} {!allowedValues && valueType.info.type === StdDataType.Urn && ( { const createInput = { ...form.getFieldsValue(), + qualifiedName: form.getFieldValue('qualifiedName') || undefined, valueType: valueTypes.find((type) => type.value === form.getFieldValue('valueType'))?.urn, allowedValues, cardinality, diff --git a/datahub-web-react/src/app/govern/structuredProperties/cacheUtils.ts b/datahub-web-react/src/app/govern/structuredProperties/cacheUtils.ts index 590189d06e6b16..c8052784c6972a 100644 --- a/datahub-web-react/src/app/govern/structuredProperties/cacheUtils.ts +++ b/datahub-web-react/src/app/govern/structuredProperties/cacheUtils.ts @@ -17,7 +17,6 @@ const addToCache = (existingProperties, newProperty) => { allowedValues: newProperty.definition.allowedValues, created: newProperty.definition.created, lastModified: newProperty.definition.lastModified, - filterStatus: newProperty.definition.filterStatus, }, settings: { isHidden: newProperty.settings.isHidden, diff --git a/datahub-web-react/src/app/preview/DefaultPreviewCard.tsx b/datahub-web-react/src/app/preview/DefaultPreviewCard.tsx index 4c8948a6664e07..a19862e83ae510 100644 --- a/datahub-web-react/src/app/preview/DefaultPreviewCard.tsx +++ b/datahub-web-react/src/app/preview/DefaultPreviewCard.tsx @@ -68,6 +68,7 @@ const TitleContainer = styled.div` const EntityTitleContainer = styled.div` display: flex; align-items: center; + gap: 8px; `; const EntityTitle = styled(Typography.Text)<{ $titleSizePx?: number }>` @@ -77,7 +78,6 @@ const EntityTitle = styled(Typography.Text)<{ $titleSizePx?: number }>` } &&& { - margin-right 8px; font-size: ${(props) => props.$titleSizePx || 16}px; font-weight: 600; vertical-align: middle; diff --git a/datahub-web-react/src/graphql/search.graphql b/datahub-web-react/src/graphql/search.graphql index ce0fde27f4c425..58c9a51f3d7e90 100644 --- a/datahub-web-react/src/graphql/search.graphql +++ b/datahub-web-react/src/graphql/search.graphql @@ -963,6 +963,7 @@ fragment facetFields on FacetMetadata { entity { urn type + ...entityDisplayNameFields ... on Tag { name properties { diff --git a/metadata-utils/src/main/java/com/linkedin/metadata/authorization/PoliciesConfig.java b/metadata-utils/src/main/java/com/linkedin/metadata/authorization/PoliciesConfig.java index d701c8fc8be035..80a11ab98bbf4a 100644 --- a/metadata-utils/src/main/java/com/linkedin/metadata/authorization/PoliciesConfig.java +++ b/metadata-utils/src/main/java/com/linkedin/metadata/authorization/PoliciesConfig.java @@ -219,6 +219,7 @@ public class PoliciesConfig { MANAGE_BUSINESS_ATTRIBUTE_PRIVILEGE, MANAGE_CONNECTIONS_PRIVILEGE, MANAGE_STRUCTURED_PROPERTIES_PRIVILEGE, + VIEW_STRUCTURED_PROPERTIES_PAGE_PRIVILEGE, MANAGE_DOCUMENTATION_FORMS_PRIVILEGE, MANAGE_FEATURES_PRIVILEGE, MANAGE_SYSTEM_OPERATIONS_PRIVILEGE); From 6ad86189e955f9c5a52a5eb468c24d50144099dd Mon Sep 17 00:00:00 2001 From: Chris Collins Date: Thu, 12 Dec 2024 12:35:46 -0500 Subject: [PATCH 2/3] fix allowed values button --- .../src/app/govern/structuredProperties/AllowedValuesDrawer.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/datahub-web-react/src/app/govern/structuredProperties/AllowedValuesDrawer.tsx b/datahub-web-react/src/app/govern/structuredProperties/AllowedValuesDrawer.tsx index f1dccb6db0c22c..16c07e8257cd9b 100644 --- a/datahub-web-react/src/app/govern/structuredProperties/AllowedValuesDrawer.tsx +++ b/datahub-web-react/src/app/govern/structuredProperties/AllowedValuesDrawer.tsx @@ -127,6 +127,7 @@ const AllowedValuesDrawer = ({ setTimeout(() => scrollToBottom(), 0); }} color="violet" + type="button" > Add From 62b4838b05841c8f95b055bf70d9db6a7bcb13bc Mon Sep 17 00:00:00 2001 From: Chris Collins Date: Mon, 16 Dec 2024 11:07:31 -0500 Subject: [PATCH 3/3] fix copy on asset badge modal --- .../src/app/govern/structuredProperties/DisplayPreferences.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/datahub-web-react/src/app/govern/structuredProperties/DisplayPreferences.tsx b/datahub-web-react/src/app/govern/structuredProperties/DisplayPreferences.tsx index 260c91ef93207c..95823de0f27c40 100644 --- a/datahub-web-react/src/app/govern/structuredProperties/DisplayPreferences.tsx +++ b/datahub-web-react/src/app/govern/structuredProperties/DisplayPreferences.tsx @@ -153,7 +153,8 @@ const DisplayPreferences = ({ clickable={false} />  is already being shown on asset previews, but only one property is allowed at a time. - Do you want to replace the current property? This will hide PropVal on all asset previews. + Do you want to replace the current property? This will hide {getDisplayName(badgeProperty)}{' '} + on all asset previews.

} />