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

Improvement #6656 : Edited the text in sample data tab when no data is available (#6843)

Browse Source 
* Improvement #6656 : Edited the text in sample data tab when no data is available

* Used antd Empty component to show for no data
This commit is contained in:
Aniket Katkar 2022-08-22 19:57:13 +05:30 committed by GitHub
parent 383f4497cc
commit f686f606ca
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 52 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
openmetadata-ui/src/main/resources/ui/src/components/SampleDataTable/SampleDataTable.component.tsx
View File

@ -16,7 +16,7 @@ import {
faChevronRight,
} from '@fortawesome/free-solid-svg-icons';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { Space } from 'antd';
import { Empty, Space } from 'antd';
import classNames from 'classnames';
import { lowerCase } from 'lodash';
import React, {
@ -26,6 +26,7 @@ import React, {
useRef,
useState,
} from 'react';
import { Link } from 'react-router-dom';
import { TableData } from '../../generated/entity/data/table';
import { withLoader } from '../../hoc/withLoader';
import { isEven } from '../../utils/CommonUtils';
@ -151,7 +152,26 @@ const SampleDataTable: FunctionComponent<Props> = ({ sampleData }: Props) => {
</table>
) : (
<div className="tw-flex tw-justify-center tw-font-medium tw-items-center tw-border tw-border-main tw-rounded-md tw-p-8">
No sample data available
<Empty
description={
<>
<p>No sample data available</p>
<p className="tw-mt-2">
To view Sample Data, run the Profiler Ingestion. Please
refer to this doc to schedule the{' '}
<Link
className="tw-ml-1"
target="_blank"
to={{
pathname:
'https://docs.open-metadata.org/openmetadata/ingestion/workflows/profiler',
}}>
Profiler Ingestion
</Link>
</p>
</>
}
/>
</div>
)}
</div>

4
openmetadata-ui/src/main/resources/ui/src/components/SampleDataTable/SampleDataTable.test.tsx
View File

@ -37,6 +37,10 @@ const mockSampleData = {
],
};
jest.mock('react-router-dom', () => ({
Link: jest.fn().mockImplementation(({ children }) => <span>{children}</span>),
}));
describe('Test SampleDataTable Component', () => {
it('Renders all the data that was sent to the component', () => {
const { container } = render(

4
openmetadata-ui/src/main/resources/ui/src/components/SampleDataTopic/SampleDataTopic.test.tsx
View File

@ -20,6 +20,10 @@ const mockSampleData = {
messages: ['{"email":"data","name":"job"}'],
};
jest.mock('react-router-dom', () => ({
Link: jest.fn().mockImplementation(({ children }) => <span>{children}</span>),
}));
describe('Test SampleData Component', () => {
it('Should render message cards', () => {
const { getAllByTestId } = render(

23
openmetadata-ui/src/main/resources/ui/src/components/SampleDataTopic/SampleDataTopic.tsx
View File

@ -12,8 +12,10 @@
*/
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { Empty } from 'antd';
import { isUndefined } from 'lodash';
import React, { FC, HTMLAttributes, useState } from 'react';
import { Link } from 'react-router-dom';
import { TopicSampleData } from '../../generated/entity/data/topic';
import { withLoader } from '../../hoc/withLoader';
import SchemaEditor from '../schema-editor/SchemaEditor';
@ -82,7 +84,26 @@ const SampleDataTopic: FC<SampleDataTopicProp> = ({ sampleData }) => {
<div
className="tw-flex tw-justify-center tw-font-medium tw-items-center tw-border tw-border-main tw-rounded-md tw-p-8"
data-testid="no-data">
No sample data available
<Empty
description={
<>
<p>No sample data available</p>
<p className="tw-mt-2">
To view Sample Data, run the MetaData Ingestion. Please refer to
this doc to schedule the{' '}
<Link
className="tw-ml-1"
target="_blank"
to={{
pathname:
'https://docs.open-metadata.org/openmetadata/ingestion/workflows/metadata',
}}>
MetaData Ingestion
</Link>
</p>
</>
}
/>
</div>
);
}