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

WIP: Fix #12980: Expand description issue (#15778)

Browse Source
This commit is contained in:
Harsh Vador 2024-04-06 17:24:04 +05:30 committed by GitHub
parent 05dfd4ddfd
commit 14b204ff83
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
18 changed files with 58 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
openmetadata-ui/src/main/resources/ui/src/components/Classifications/ClassificationDetails/ClassificationDetails.tsx
View File

@ -16,7 +16,7 @@ import ButtonGroup from 'antd/lib/button/button-group';
import { ColumnsType } from 'antd/lib/table';
import { AxiosError } from 'axios';
import classNames from 'classnames';
import { capitalize, isUndefined, toString } from 'lodash';
import { capitalize, isEmpty, isUndefined, toString } from 'lodash';
import React, {
forwardRef,
useCallback,
@ -93,7 +93,6 @@ const ClassificationDetails = forwardRef(
const history = useHistory();
const [tags, setTags] = useState<Tag[]>([]);
const [isTagsLoading, setIsTagsLoading] = useState(false);
const {
currentPage,
paging,
@ -478,7 +477,6 @@ const ClassificationDetails = forwardRef(
</Col>
</Row>
)}
<div className="m-b-sm m-t-xs" data-testid="description-container">
<DescriptionV1
className={classNames({
@ -488,6 +486,7 @@ const ClassificationDetails = forwardRef(
entityName={getEntityName(currentClassification)}
entityType={EntityType.CLASSIFICATION}
hasEditAccess={editDescriptionPermission}
isDescriptionExpanded={isEmpty(tags)}
isEdit={isEditClassification}
showCommentsIcon={false}
onCancel={handleCancelEditDescription}

2
openmetadata-ui/src/main/resources/ui/src/components/Dashboard/DashboardDetails/DashboardDetails.component.tsx
View File

@ -558,6 +558,7 @@ const DashboardDetails = ({
hasEditTagAccess,
handleUpdateChart,
handleChartTagSelection,
charts,
]
);
@ -607,6 +608,7 @@ const DashboardDetails = ({
entityName={entityName}
entityType={EntityType.DASHBOARD}
hasEditAccess={editDescriptionPermission}
isDescriptionExpanded={isEmpty(charts)}
isEdit={isEdit}
owner={dashboardDetails.owner}
showActions={!deleted}

3
openmetadata-ui/src/main/resources/ui/src/components/Dashboard/DataModel/DataModels/DataModelDetails.component.tsx
View File

@ -13,7 +13,7 @@
import { Card, Col, Row, Tabs } from 'antd';
import { AxiosError } from 'axios';
import { isUndefined, toString } from 'lodash';
import { isEmpty, isUndefined, toString } from 'lodash';
import { EntityTags } from 'Models';
import React, { useCallback, useEffect, useMemo, useState } from 'react';
import { useTranslation } from 'react-i18next';
@ -220,6 +220,7 @@ const DataModelDetails = ({
entityName={entityName}
entityType={EntityType.DASHBOARD_DATA_MODEL}
hasEditAccess={editDescriptionPermission}
isDescriptionExpanded={isEmpty(dataModelData.columns)}
isEdit={isEditDescription}
owner={owner}
showActions={!deleted}

3
openmetadata-ui/src/main/resources/ui/src/components/Glossary/GlossaryDetails/GlossaryDetails.component.tsx
View File

@ -12,7 +12,7 @@
*/
import { Col, Row, Space, Tabs } from 'antd';
import { noop } from 'lodash';
import { isEmpty, noop } from 'lodash';
import React, { useCallback, useEffect, useMemo, useState } from 'react';
import { useTranslation } from 'react-i18next';
import { useHistory, useParams } from 'react-router-dom';
@ -152,6 +152,7 @@ const GlossaryDetails = ({
entityName={getEntityName(glossary)}
entityType={EntityType.GLOSSARY}
hasEditAccess={permissions.EditDescription || permissions.EditAll}
isDescriptionExpanded={isEmpty(glossaryTerms)}
isEdit={isDescriptionEditable}
owner={glossary?.owner}
showActions={!glossary.deleted}

1
openmetadata-ui/src/main/resources/ui/src/components/MlModel/MlModelDetail/MlModelDetail.component.tsx
View File

@ -404,6 +404,7 @@ const MlModelDetail: FC<MlModelDetailProp> = ({
entityName={mlModelName}
entityType={EntityType.MLMODEL}
hasEditAccess={editDescriptionPermission}
isDescriptionExpanded={isEmpty(mlModelDetail.mlFeatures)}
isEdit={isEdit}
owner={mlModelDetail.owner}
showActions={!deleted}

1
openmetadata-ui/src/main/resources/ui/src/components/Pipeline/PipelineDetails/PipelineDetails.component.tsx
View File

@ -582,6 +582,7 @@ const PipelineDetails = ({
entityName={entityName}
entityType={EntityType.PIPELINE}
hasEditAccess={editDescriptionPermission}
isDescriptionExpanded={isEmpty(tasksInternal)}
isEdit={isEdit}
owner={owner}
showActions={!deleted}

4
openmetadata-ui/src/main/resources/ui/src/components/Topic/TopicDetails/TopicDetails.component.tsx
View File

@ -13,6 +13,7 @@
import { Col, Row, Tabs } from 'antd';
import { AxiosError } from 'axios';
import { isEmpty } from 'lodash';
import { EntityTags } from 'Models';
import React, { useCallback, useEffect, useMemo, useState } from 'react';
import { useTranslation } from 'react-i18next';
@ -313,6 +314,9 @@ const TopicDetails: React.FC<TopicDetailsProps> = ({
entityName={entityName}
entityType={EntityType.TOPIC}
hasEditAccess={editDescriptionPermission}
isDescriptionExpanded={isEmpty(
topicDetails.messageSchema?.schemaFields
)}
isEdit={isEdit}
owner={topicDetails.owner}
showActions={!deleted}

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

@ -36,4 +36,5 @@ export interface DescriptionProps {
reduceDescription?: boolean;
className?: string;
showSuggestions?: boolean;
isDescriptionExpanded?: boolean;
}

4
openmetadata-ui/src/main/resources/ui/src/components/common/EntityDescription/DescriptionV1.tsx
View File

@ -57,6 +57,7 @@ const DescriptionV1 = ({
showCommentsIcon = true,
reduceDescription,
showSuggestions = false,
isDescriptionExpanded,
}: DescriptionProps) => {
const history = useHistory();
const { suggestions = [], selectedUserSuggestions = [] } =
@ -191,13 +192,14 @@ const DescriptionV1 = ({
<RichTextEditorPreviewer
className={reduceDescription ? 'max-two-lines' : ''}
enableSeeMoreVariant={!removeBlur}
isDescriptionExpanded={isDescriptionExpanded}
markdown={description}
/>
) : (
<span>{t('label.no-description')}</span>
);
}
}, [description, suggestionData]);
}, [description, suggestionData, isDescriptionExpanded]);
const content = (
<Space

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

@ -35,6 +35,7 @@ export interface PreviewerProp {
className?: string;
enableSeeMoreVariant?: boolean;
showReadMoreBtn?: boolean;
isDescriptionExpanded?: boolean;
textVariant?: TextVariant;
}

24
openmetadata-ui/src/main/resources/ui/src/components/common/RichTextEditor/RichTextEditorPreviewer.test.tsx
View File

@ -38,6 +38,7 @@ const mockProp: PreviewerProp = {
className: '',
maxLength: 300,
enableSeeMoreVariant: true,
isDescriptionExpanded: false,
};
describe('Test RichTextEditor Previewer Component', () => {
@ -457,4 +458,27 @@ describe('Test RichTextEditor Previewer Component', () => {
expect(screen.getByTestId('code-block-copy-icon')).toBeInTheDocument();
});
it('Should render read less button if isDescriptionExpanded is true', async () => {
const { container } = render(
<RichTextEditorPreviewer {...mockProp} isDescriptionExpanded />,
{
wrapper: MemoryRouter,
}
);
const readLessButton = await findByTestId(container, 'read-less-button');
expect(readLessButton).toBeInTheDocument();
});
it('Should render read more button if isDescriptionExpanded is false', async () => {
const { container } = render(<RichTextEditorPreviewer {...mockProp} />, {
wrapper: MemoryRouter,
});
const readMoreButton = await findByTestId(container, 'read-more-button');
expect(readMoreButton).toBeInTheDocument();
});
});

6
openmetadata-ui/src/main/resources/ui/src/components/common/RichTextEditor/RichTextEditorPreviewer.tsx
View File

@ -31,10 +31,10 @@ const RichTextEditorPreviewer = ({
textVariant = 'black',
showReadMoreBtn = true,
maxLength = DESCRIPTION_MAX_PREVIEW_CHARACTERS,
isDescriptionExpanded = false,
}: PreviewerProp) => {
const { t, i18n } = useTranslation();
const [content, setContent] = useState<string>('');
// initially read more will be false
const [readMore, setReadMore] = useState<boolean>(false);
@ -95,6 +95,10 @@ const RichTextEditorPreviewer = ({
return () => window.removeEventListener('mousedown', handleMouseDownEvent);
}, [handleMouseDownEvent]);
useEffect(() => {
setReadMore(Boolean(isDescriptionExpanded));
}, [isDescriptionExpanded]);
return (
<div
className={classNames('rich-text-editor-container', className, {

1
openmetadata-ui/src/main/resources/ui/src/pages/ContainerPage/ContainerPage.tsx
View File

@ -566,6 +566,7 @@ const ContainerPage = () => {
entityName={entityName}
entityType={EntityType.CONTAINER}
hasEditAccess={editDescriptionPermission}
isDescriptionExpanded={isEmpty(containerChildrenData)}
isEdit={isEditDescription}
owner={owner}
showActions={!deleted}

1
openmetadata-ui/src/main/resources/ui/src/pages/DatabaseDetailsPage/DatabaseDetailsPage.tsx
View File

@ -516,6 +516,7 @@ const DatabaseDetails: FunctionComponent = () => {
entityName={getEntityName(database)}
entityType={EntityType.DATABASE}
hasEditAccess={editDescriptionPermission}
isDescriptionExpanded={isEmpty(database)}
isEdit={isEdit}
showActions={!database.deleted}
onCancel={onCancel}

3
openmetadata-ui/src/main/resources/ui/src/pages/DatabaseSchemaPage/SchemaTablesTab.tsx
View File

@ -13,6 +13,7 @@
import { Col, Row, Switch, Typography } from 'antd';
import { ColumnsType } from 'antd/lib/table';
import { isEmpty } from 'lodash';
import { PagingResponse } from 'Models';
import React, { useMemo } from 'react';
import { useTranslation } from 'react-i18next';
@ -114,6 +115,7 @@ function SchemaTablesTab({
description={description}
entityFqn={databaseSchemaDetails.fullyQualifiedName}
entityType={EntityType.DATABASE_SCHEMA}
isDescriptionExpanded={isEmpty(tableData.data)}
showActions={false}
/>
) : (
@ -123,6 +125,7 @@ function SchemaTablesTab({
entityName={getEntityName(databaseSchemaDetails)}
entityType={EntityType.DATABASE_SCHEMA}
hasEditAccess={editDescriptionPermission}
isDescriptionExpanded={isEmpty(tableData.data)}
isEdit={isEdit}
showActions={!databaseSchemaDetails.deleted}
onCancel={onCancel}

3
openmetadata-ui/src/main/resources/ui/src/pages/SearchIndexDetailsPage/SearchIndexDetailsPage.tsx
View File

@ -14,7 +14,7 @@
import { Col, Row, Tabs } from 'antd';
import { AxiosError } from 'axios';
import { compare } from 'fast-json-patch';
import { isEqual, isUndefined, omitBy } from 'lodash';
import { isEmpty, isEqual, isUndefined, omitBy } from 'lodash';
import { EntityTags } from 'Models';
import React, { useCallback, useEffect, useMemo, useState } from 'react';
import { useTranslation } from 'react-i18next';
@ -392,6 +392,7 @@ function SearchIndexDetailsPage() {
entityName={entityName}
entityType={EntityType.SEARCH_INDEX}
hasEditAccess={editDescriptionPermission}
isDescriptionExpanded={isEmpty(searchIndexDetails?.fields)}
isEdit={isEdit}
owner={searchIndexDetails?.owner}
showActions={!searchIndexDetails?.deleted}

2
openmetadata-ui/src/main/resources/ui/src/pages/StoredProcedure/StoredProcedurePage.tsx
View File

@ -22,6 +22,7 @@ import { ActivityFeedTab } from '../../components/ActivityFeed/ActivityFeedTab/A
import ActivityThreadPanel from '../../components/ActivityFeed/ActivityThreadPanel/ActivityThreadPanel';
import { withActivityFeed } from '../../components/AppRouter/withActivityFeed';
import { isEmpty } from 'lodash';
import { CustomPropertyTable } from '../../components/common/CustomPropertyTable/CustomPropertyTable';
import DescriptionV1 from '../../components/common/EntityDescription/DescriptionV1';
import ErrorPlaceHolder from '../../components/common/ErrorWithPlaceholder/ErrorPlaceHolder';
@ -550,6 +551,7 @@ const StoredProcedurePage = () => {
entityName={entityName}
entityType={EntityType.STORED_PROCEDURE}
hasEditAccess={editDescriptionPermission}
isDescriptionExpanded={isEmpty(code)}
isEdit={isEdit}
owner={owner}
showActions={!deleted}

1
openmetadata-ui/src/main/resources/ui/src/pages/TableDetailsPageV1/TableDetailsPageV1.tsx
View File

@ -518,6 +518,7 @@ const TableDetailsPageV1: React.FC = () => {
entityName={entityName}
entityType={EntityType.TABLE}
hasEditAccess={editDescriptionPermission}
isDescriptionExpanded={isEmpty(tableDetails?.columns)}
isEdit={isEdit}
owner={tableDetails?.owner}
showActions={!deleted}