yujunjun/datahub
2
0
Fork 0
mirror of https://github.com/datahub-project/datahub.git synced 2025-12-29 10:57:52 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat(ui): Support adding custom id when creating term and term group (#6830)

Browse Source
This commit is contained in:
John Joyce 2022-12-22 06:32:46 -08:00 committed by GitHub
parent a6470fc267
commit 8976844635
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 45 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
datahub-web-react/src/app/domain/CreateDomainModal.tsx
View File

@ -3,7 +3,7 @@ import styled from 'styled-components';
import { message, Button, Input, Modal, Typography, Form, Collapse, Tag } from 'antd';
import { useCreateDomainMutation } from '../../graphql/domain.generated';
import { useEnterKeyListener } from '../shared/useEnterKeyListener';
import { groupIdTextValidation } from '../shared/textUtil';
import { validateCustomUrnId } from '../shared/textUtil';
import analytics, { EventType } from '../analytics';
const SuggestedNamesGroup = styled.div`
@ -156,7 +156,7 @@ export default function CreateDomainModal({ onClose, onCreate }: Props) {
rules={[
() => ({
validator(_, value) {
if (value && groupIdTextValidation(value)) {
if (value && validateCustomUrnId(value)) {
return Promise.resolve();
}
return Promise.reject(new Error('Please enter a valid Domain id'));

41
datahub-web-react/src/app/entity/shared/EntityDropdown/CreateGlossaryEntityModal.tsx
View File

@ -1,7 +1,7 @@
import React, { useState } from 'react';
import styled from 'styled-components/macro';
import { EditOutlined } from '@ant-design/icons';
import { message, Button, Input, Modal, Typography, Form } from 'antd';
import { message, Button, Input, Modal, Typography, Form, Collapse } from 'antd';
import DOMPurify from 'dompurify';
import {
useCreateGlossaryTermMutation,
@ -13,6 +13,7 @@ import NodeParentSelect from './NodeParentSelect';
import { useEntityData, useRefetch } from '../EntityContext';
import analytics, { EventType } from '../../../analytics';
import DescriptionModal from '../components/legacy/DescriptionModal';
import { validateCustomUrnId } from '../../../shared/textUtil';
const StyledItem = styled(Form.Item)`
margin-bottom: 0;
@ -37,6 +38,7 @@ function CreateGlossaryEntityModal(props: Props) {
const entityData = useEntityData();
const [form] = Form.useForm();
const entityRegistry = useEntityRegistry();
const [stagedId, setStagedId] = useState<string | undefined>(undefined);
const [stagedName, setStagedName] = useState('');
const [selectedParentUrn, setSelectedParentUrn] = useState(entityData.urn);
const [documentation, setDocumentation] = useState('');
@ -55,6 +57,7 @@ function CreateGlossaryEntityModal(props: Props) {
mutation({
variables: {
input: {
id: stagedId?.length ? stagedId : undefined,
name: stagedName,
parentNode: selectedParentUrn || null,
description: sanitizedDescription || null,
@ -167,6 +170,42 @@ function CreateGlossaryEntityModal(props: Props) {
/>
)}
</StyledItem>
<Collapse ghost>
<Collapse.Panel header={<Typography.Text type="secondary">Advanced</Typography.Text>} key="1">
<Form.Item
label={
<Typography.Text strong>
{entityRegistry.getEntityName(props.entityType)} Id
</Typography.Text>
}
>
<Typography.Paragraph>
By default, a random UUID will be generated to uniquely identify this entity. If
you&apos;d like to provide a custom id, you may provide it here. Note that it should be
unique across the entire Glossary. Be careful, you cannot easily change the id after
creation.
</Typography.Paragraph>
<Form.Item
name="id"
rules={[
() => ({
validator(_, value) {
if (value && validateCustomUrnId(value)) {
return Promise.resolve();
}
return Promise.reject(new Error('Please enter a valid entity id'));
},
}),
]}
>
<Input
placeholder="classification"
onChange={(event) => setStagedId(event.target.value)}
/>
</Form.Item>
</Form.Item>
</Collapse.Panel>
</Collapse>
</Form>
</Modal>
);

4
datahub-web-react/src/app/identity/group/CreateGroupModal.tsx
View File

@ -2,7 +2,7 @@ import React, { useState } from 'react';
import { message, Button, Input, Modal, Typography, Form, Collapse } from 'antd';
import { useCreateGroupMutation } from '../../../graphql/group.generated';
import { useEnterKeyListener } from '../../shared/useEnterKeyListener';
import { groupIdTextValidation } from '../../shared/textUtil';
import { validateCustomUrnId } from '../../shared/textUtil';
import analytics, { EventType } from '../../analytics';
import { CorpGroup, EntityType } from '../../../types.generated';
@ -134,7 +134,7 @@ export default function CreateGroupModal({ onClose, onCreate }: Props) {
rules={[
() => ({
validator(_, value) {
if (value && groupIdTextValidation(value)) {
if (value && validateCustomUrnId(value)) {
return Promise.resolve();
}
return Promise.reject(new Error('Please enter correct Group name'));

2
datahub-web-react/src/app/shared/textUtil.ts
View File

@ -19,7 +19,7 @@ export function capitalizeFirstLetterOnly(str?: string | null) {
return str.charAt(0).toUpperCase() + str.slice(1);
}
export function groupIdTextValidation(str: string) {
export function validateCustomUrnId(str: string) {
if (str.indexOf(' ') > 0) return false;
if (str.indexOf(',') > 0) return false;
if (str.indexOf('(') > 0) return false;