diff --git a/openmetadata-ui/src/main/resources/ui/src/constants/DataInsight.constants.ts b/openmetadata-ui/src/main/resources/ui/src/constants/DataInsight.constants.ts index b4977bb339e..2bea1ab7a32 100644 --- a/openmetadata-ui/src/main/resources/ui/src/constants/DataInsight.constants.ts +++ b/openmetadata-ui/src/main/resources/ui/src/constants/DataInsight.constants.ts @@ -181,7 +181,7 @@ export const SUPPORTED_CHARTS_FOR_KPI = [ DataInsightChartType.PercentageOfEntitiesWithOwnerByType, ]; -export const KPI_DATE_PICKER_FORMAT = 'YYYY-MM-DD HH:mm:ss'; +export const KPI_DATE_PICKER_FORMAT = 'YYYY-MM-DD'; export const KPI_DATES = { startDate: '', diff --git a/openmetadata-ui/src/main/resources/ui/src/locale/languages/en-us.json b/openmetadata-ui/src/main/resources/ui/src/locale/languages/en-us.json index 8295c1be3a3..eeaeb90e6fe 100644 --- a/openmetadata-ui/src/main/resources/ui/src/locale/languages/en-us.json +++ b/openmetadata-ui/src/main/resources/ui/src/locale/languages/en-us.json @@ -383,6 +383,7 @@ "hide": "Hide", "restore-team": "Restore Team", "remove": "Remove", + "data-insight-plural": "Data Insights", "configure-entity": "Configure {{entity}}", "name-lowercase": "name", "field-invalid": "{{field}} is invalid", diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/DataInsightPage/DataInsightPage.component.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/DataInsightPage/DataInsightPage.component.tsx index f984268b282..1b355bb966e 100644 --- a/openmetadata-ui/src/main/resources/ui/src/pages/DataInsightPage/DataInsightPage.component.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/pages/DataInsightPage/DataInsightPage.component.tsx @@ -178,7 +178,9 @@ const DataInsightPage = () => {
- Data Insight + + {t('label.data-insight-plural')} + {t('label.data-insight-subtitle')} diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/DataInsightPage/KPIList.test.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/DataInsightPage/KPIList.test.tsx new file mode 100644 index 00000000000..ed35bab951d --- /dev/null +++ b/openmetadata-ui/src/main/resources/ui/src/pages/DataInsightPage/KPIList.test.tsx @@ -0,0 +1,108 @@ +/* + * Copyright 2022 Collate + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * http://www.apache.org/licenses/LICENSE-2.0 + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +import { fireEvent, render, screen } from '@testing-library/react'; +import React from 'react'; +import { MemoryRouter } from 'react-router-dom'; +import { act } from 'react-test-renderer'; +import KPIList from './KPIList'; +import { KPI_DATA } from './mocks/KPIList'; + +const mockPush = jest.fn(); + +jest.mock('react-router-dom', () => ({ + useHistory: jest.fn().mockImplementation(() => ({ + push: mockPush, + })), + Link: jest + .fn() + .mockImplementation(({ children }: { children: React.ReactNode }) => ( + {children} + )), +})); + +jest.mock('../../components/common/DeleteWidget/DeleteWidgetModal', () => + jest.fn().mockReturnValue(
Delete Modal
) +); + +jest.mock('../../components/common/next-previous/NextPrevious', () => + jest + .fn() + .mockReturnValue(
Next Previous
) +); + +jest.mock( + '../../components/common/rich-text-editor/RichTextEditorPreviewer', + () => jest.fn().mockReturnValue(
Editor
) +); + +jest.mock('../../components/Loader/Loader', () => + jest.fn().mockReturnValue(
Loader
) +); + +jest.mock('../../hooks/authHooks', () => ({ + useAuth: jest.fn().mockReturnValue({ isAdminUser: true }), +})); + +jest.mock('../../utils/TimeUtils', () => ({ + formatDateTime: jest.fn().mockReturnValue('7 Dec 2022, 00:00'), +})); + +jest.mock('../../axiosAPIs/KpiAPI', () => ({ + getListKPIs: jest + .fn() + .mockImplementation(() => Promise.resolve({ data: KPI_DATA })), +})); + +describe('KPI list component', () => { + it('Should render the kpi list', async () => { + render(, { wrapper: MemoryRouter }); + + const container = await screen.findByTestId('kpi-table'); + const descriptionKPI = await screen.findByText('Description KPI'); + const ownerKPI = await screen.findByText('Owner KPI'); + + expect(container).toBeInTheDocument(); + + expect(descriptionKPI).toBeInTheDocument(); + expect(ownerKPI).toBeInTheDocument(); + }); + + it('Action button should work', async () => { + const KPI = KPI_DATA[0]; + + render(, { wrapper: MemoryRouter }); + + const editButton = await screen.findByTestId( + `edit-action-${KPI.displayName}` + ); + const deleteButton = await screen.findByTestId( + `delete-action-${KPI.displayName}` + ); + + expect(editButton).toBeInTheDocument(); + expect(deleteButton).toBeInTheDocument(); + + await act(async () => { + fireEvent.click(editButton); + }); + + expect(mockPush).toBeCalled(); + + await act(async () => { + fireEvent.click(deleteButton); + }); + + expect(await screen.findByTestId('delete-modal')).toBeInTheDocument(); + }); +}); diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/DataInsightPage/KPIList.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/DataInsightPage/KPIList.tsx index 1ddf9a4f3a1..fe732a717bb 100644 --- a/openmetadata-ui/src/main/resources/ui/src/pages/DataInsightPage/KPIList.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/pages/DataInsightPage/KPIList.tsx @@ -11,12 +11,12 @@ * limitations under the License. */ -import { Button, Col, Table, Tooltip, Typography } from 'antd'; +import { Button, Col, Space, Table, Tooltip, Typography } from 'antd'; import { ColumnsType } from 'antd/lib/table'; import { isUndefined } from 'lodash'; import React, { useEffect, useMemo, useState } from 'react'; import { useTranslation } from 'react-i18next'; -import { Link } from 'react-router-dom'; +import { Link, useHistory } from 'react-router-dom'; import { getListKPIs } from '../../axiosAPIs/KpiAPI'; import DeleteWidgetModal from '../../components/common/DeleteWidget/DeleteWidgetModal'; import NextPrevious from '../../components/common/next-previous/NextPrevious'; @@ -28,7 +28,6 @@ import { PAGE_SIZE_MEDIUM, pagingObject, } from '../../constants/constants'; -import { NO_PERMISSION_FOR_ACTION } from '../../constants/HelperTextUtil'; import { EntityType } from '../../enums/entity.enum'; import { Kpi, KpiTargetType } from '../../generated/dataInsight/kpi/kpi'; @@ -39,6 +38,7 @@ import SVGIcons, { Icons } from '../../utils/SvgUtils'; import { formatDateTime } from '../../utils/TimeUtils'; const KPIList = () => { + const history = useHistory(); const { isAdminUser } = useAuth(); const { t } = useTranslation(); const [kpiList, setKpiList] = useState>([]); @@ -122,21 +122,46 @@ const KPIList = () => { key: 'actions', render: (_, record) => { return ( - -