From 7331dea463b7030a4e262fddad0bdf6ebd05dbc9 Mon Sep 17 00:00:00 2001 From: Aniket Katkar Date: Sat, 5 Apr 2025 11:02:45 +0530 Subject: [PATCH] Chore(ui): Layout and styling fixes according to the new design (#20647) * Refactor: Remove AlertsActivityFeedPage and update related components - Deleted AlertsActivityFeedPage component since it was old and not being used. - Removed unused import and route for AlertsActivityFeedPage in SettingsRouter. - Fix the layout for the following pages: 1. Add and edit alert page 2. Alert details page 3. Role details page 4. Policy details page 5. Add user and admin page 6. Add and edit Rule page 7. Custom property settings page. * Fix the type error in the CI * Fix the vertical alignment of ingestion table rows * Fix the unit tests * Fix SettingsRouter test --- .../AppRouter/SettingsRouter.test.tsx | 17 -- .../components/AppRouter/SettingsRouter.tsx | 11 - .../IngestionListTable/IngestionListTable.tsx | 3 +- .../ingestion-list-table.less} | 25 +- .../metadata-agents-widget.less | 6 - .../resources/ui/src/enums/Alerts.enum.ts | 2 +- .../api/automations/createWorkflow.ts | 4 + .../api/services/createPipelineService.ts | 4 + .../createIngestionPipeline.ts | 4 + .../automations/testServiceConnection.ts | 4 + .../generated/entity/automations/workflow.ts | 4 + .../database/snowflakeConnection.ts | 4 - .../services/connections/serviceConnection.ts | 4 + .../ingestionPipelines/ingestionPipeline.ts | 4 + .../entity/services/pipelineService.ts | 4 + .../metadataIngestion/testSuitePipeline.ts | 4 + .../generated/metadataIngestion/workflow.ts | 4 + .../AddNotificationPage.tsx | 8 +- .../AddObservabilityPage.tsx | 9 +- .../AlertDetailsPage.test.tsx | 6 +- .../AlertDetailsPage/AlertDetailsPage.tsx | 288 ++++++++---------- .../AlertsActivityFeedPage.tsx | 103 ------- .../CreateUserPage.component.tsx | 5 +- .../CustomPropertiesPageV1.tsx | 20 +- .../custom-properties-pageV1.less | 7 +- .../ObservabilityAlertsPage.tsx | 2 +- .../PoliciesDetailPage/AddRulePage.tsx | 64 ++-- .../PoliciesDetailPage/EditRulePage.tsx | 87 +++--- .../PoliciesDetailPage/PoliciesDetailPage.tsx | 284 +++++++++-------- .../PoliciesDetailPage/policies-detail.less | 51 ---- .../RolesDetailPage/RolesDetailPage.tsx | 124 ++++---- .../components/add-edit-form-steps.less | 3 +- .../ui/src/styles/components/button.less | 2 +- 33 files changed, 503 insertions(+), 668 deletions(-) rename openmetadata-ui/src/main/resources/ui/src/{pages/RolesPage/RolesDetailPage/roles-detail.less => components/Settings/Services/Ingestion/IngestionListTable/ingestion-list-table.less} (60%) delete mode 100644 openmetadata-ui/src/main/resources/ui/src/pages/AlertsActivityFeedPage/AlertsActivityFeedPage.tsx delete mode 100644 openmetadata-ui/src/main/resources/ui/src/pages/PoliciesPage/PoliciesDetailPage/policies-detail.less diff --git a/openmetadata-ui/src/main/resources/ui/src/components/AppRouter/SettingsRouter.test.tsx b/openmetadata-ui/src/main/resources/ui/src/components/AppRouter/SettingsRouter.test.tsx index cb47cdff548..07dcad780bf 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/AppRouter/SettingsRouter.test.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/AppRouter/SettingsRouter.test.tsx @@ -26,11 +26,6 @@ jest.mock('../../pages/AlertDetailsPage/AlertDetailsPage', () => ({ default: jest.fn().mockReturnValue(
AlertDetailsPage
), })); -jest.mock('../../pages/AlertsActivityFeedPage/AlertsActivityFeedPage', () => ({ - __esModule: true, - default: jest.fn().mockReturnValue(
AlertsActivityFeedPage
), -})); - jest.mock('../../pages/Application/ApplicationPage', () => ({ __esModule: true, default: jest.fn().mockReturnValue(
ApplicationPage
), @@ -450,18 +445,6 @@ describe('SettingsRouter', () => { expect(await screen.findByText('ApplicationPage')).toBeInTheDocument(); }); - it('should render AlertsActivityFeedPage component for alerts activity feed route', async () => { - render( - - - - ); - - expect( - await screen.findByText('AlertsActivityFeedPage') - ).toBeInTheDocument(); - }); - it('should render AlertDetailsPage component for alert details route', async () => { render( { path={getSettingCategoryPath(GlobalSettingsMenuCategory.SERVICES)} /> - -
th { + text-transform: none; } - } - .role-detail-tab.ant-space { - > .ant-space-item:first-child { - align-self: flex-end; + .ant-table-cell { + vertical-align: middle; } } } - -.link-hover { - &:hover { - text-decoration: underline; - cursor: pointer; - } -} diff --git a/openmetadata-ui/src/main/resources/ui/src/components/Settings/Services/Ingestion/MetadataAgentsWidget/metadata-agents-widget.less b/openmetadata-ui/src/main/resources/ui/src/components/Settings/Services/Ingestion/MetadataAgentsWidget/metadata-agents-widget.less index 934d41c8b30..f036a0cd9e3 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/Settings/Services/Ingestion/MetadataAgentsWidget/metadata-agents-widget.less +++ b/openmetadata-ui/src/main/resources/ui/src/components/Settings/Services/Ingestion/MetadataAgentsWidget/metadata-agents-widget.less @@ -54,12 +54,6 @@ tr > td:first-child.name-column { padding-left: 16px; } - .ant-table-thead tr > th { - text-transform: none; - } - .ant-table-cell { - vertical-align: middle; - } } } } diff --git a/openmetadata-ui/src/main/resources/ui/src/enums/Alerts.enum.ts b/openmetadata-ui/src/main/resources/ui/src/enums/Alerts.enum.ts index 0a74e51d59f..325dd512e50 100644 --- a/openmetadata-ui/src/main/resources/ui/src/enums/Alerts.enum.ts +++ b/openmetadata-ui/src/main/resources/ui/src/enums/Alerts.enum.ts @@ -14,7 +14,7 @@ export enum AlertDetailTabs { CONFIGURATION = 'configuration', RECENT_EVENTS = 'recentEvents', - DIAGNOSTIC_INFO = 'diagnostic info', + DIAGNOSTIC_INFO = 'diagnostic-info', } export enum AlertRecentEventFilters { diff --git a/openmetadata-ui/src/main/resources/ui/src/generated/api/automations/createWorkflow.ts b/openmetadata-ui/src/main/resources/ui/src/generated/api/automations/createWorkflow.ts index 8f746379b7a..794fd356799 100644 --- a/openmetadata-ui/src/main/resources/ui/src/generated/api/automations/createWorkflow.ts +++ b/openmetadata-ui/src/main/resources/ui/src/generated/api/automations/createWorkflow.ts @@ -1508,6 +1508,10 @@ export interface ConfigClass { * List of IDs of your DBT cloud jobs seperated by comma `,` */ jobIds?: string[]; + /** + * Number of runs to fetch from DBT cloud + */ + numberOfRuns?: number; /** * List of IDs of your DBT cloud projects seperated by comma `,` */ diff --git a/openmetadata-ui/src/main/resources/ui/src/generated/api/services/createPipelineService.ts b/openmetadata-ui/src/main/resources/ui/src/generated/api/services/createPipelineService.ts index 7ff7473f524..2f3e94b0e96 100644 --- a/openmetadata-ui/src/main/resources/ui/src/generated/api/services/createPipelineService.ts +++ b/openmetadata-ui/src/main/resources/ui/src/generated/api/services/createPipelineService.ts @@ -286,6 +286,10 @@ export interface Connection { * List of IDs of your DBT cloud jobs seperated by comma `,` */ jobIds?: string[]; + /** + * Number of runs to fetch from DBT cloud + */ + numberOfRuns?: number; /** * List of IDs of your DBT cloud projects seperated by comma `,` */ diff --git a/openmetadata-ui/src/main/resources/ui/src/generated/api/services/ingestionPipelines/createIngestionPipeline.ts b/openmetadata-ui/src/main/resources/ui/src/generated/api/services/ingestionPipelines/createIngestionPipeline.ts index 73d8e409617..676f2fa5d2c 100644 --- a/openmetadata-ui/src/main/resources/ui/src/generated/api/services/ingestionPipelines/createIngestionPipeline.ts +++ b/openmetadata-ui/src/main/resources/ui/src/generated/api/services/ingestionPipelines/createIngestionPipeline.ts @@ -3377,6 +3377,10 @@ export interface ConfigClass { * List of IDs of your DBT cloud jobs seperated by comma `,` */ jobIds?: string[]; + /** + * Number of runs to fetch from DBT cloud + */ + numberOfRuns?: number; /** * List of IDs of your DBT cloud projects seperated by comma `,` */ diff --git a/openmetadata-ui/src/main/resources/ui/src/generated/entity/automations/testServiceConnection.ts b/openmetadata-ui/src/main/resources/ui/src/generated/entity/automations/testServiceConnection.ts index acd78f4a6a5..8dad045e81a 100644 --- a/openmetadata-ui/src/main/resources/ui/src/generated/entity/automations/testServiceConnection.ts +++ b/openmetadata-ui/src/main/resources/ui/src/generated/entity/automations/testServiceConnection.ts @@ -1392,6 +1392,10 @@ export interface ConfigClass { * List of IDs of your DBT cloud jobs seperated by comma `,` */ jobIds?: string[]; + /** + * Number of runs to fetch from DBT cloud + */ + numberOfRuns?: number; /** * List of IDs of your DBT cloud projects seperated by comma `,` */ diff --git a/openmetadata-ui/src/main/resources/ui/src/generated/entity/automations/workflow.ts b/openmetadata-ui/src/main/resources/ui/src/generated/entity/automations/workflow.ts index 51b6346b816..dffc34eab91 100644 --- a/openmetadata-ui/src/main/resources/ui/src/generated/entity/automations/workflow.ts +++ b/openmetadata-ui/src/main/resources/ui/src/generated/entity/automations/workflow.ts @@ -1924,6 +1924,10 @@ export interface ConfigClass { * List of IDs of your DBT cloud jobs seperated by comma `,` */ jobIds?: string[]; + /** + * Number of runs to fetch from DBT cloud + */ + numberOfRuns?: number; /** * List of IDs of your DBT cloud projects seperated by comma `,` */ diff --git a/openmetadata-ui/src/main/resources/ui/src/generated/entity/services/connections/database/snowflakeConnection.ts b/openmetadata-ui/src/main/resources/ui/src/generated/entity/services/connections/database/snowflakeConnection.ts index cd0c3346e91..a0f0be4077e 100644 --- a/openmetadata-ui/src/main/resources/ui/src/generated/entity/services/connections/database/snowflakeConnection.ts +++ b/openmetadata-ui/src/main/resources/ui/src/generated/entity/services/connections/database/snowflakeConnection.ts @@ -48,10 +48,6 @@ export interface SnowflakeConnection { * Optional configuration for ingestion of streams, By default, it will skip the streams. */ includeStreams?: boolean; - /** - * Optional configuration for ingestion of streams, By default, it will skip the streams. - */ - includeStreams?: boolean; /** * Optional configuration for ingestion of TRANSIENT tables, By default, it will skip the * TRANSIENT tables. diff --git a/openmetadata-ui/src/main/resources/ui/src/generated/entity/services/connections/serviceConnection.ts b/openmetadata-ui/src/main/resources/ui/src/generated/entity/services/connections/serviceConnection.ts index 1288e29f6ba..6457c895e0c 100644 --- a/openmetadata-ui/src/main/resources/ui/src/generated/entity/services/connections/serviceConnection.ts +++ b/openmetadata-ui/src/main/resources/ui/src/generated/entity/services/connections/serviceConnection.ts @@ -1549,6 +1549,10 @@ export interface ConfigClass { * List of IDs of your DBT cloud jobs seperated by comma `,` */ jobIds?: string[]; + /** + * Number of runs to fetch from DBT cloud + */ + numberOfRuns?: number; /** * List of IDs of your DBT cloud projects seperated by comma `,` */ diff --git a/openmetadata-ui/src/main/resources/ui/src/generated/entity/services/ingestionPipelines/ingestionPipeline.ts b/openmetadata-ui/src/main/resources/ui/src/generated/entity/services/ingestionPipelines/ingestionPipeline.ts index 30cb9692267..e3fae5514f9 100644 --- a/openmetadata-ui/src/main/resources/ui/src/generated/entity/services/ingestionPipelines/ingestionPipeline.ts +++ b/openmetadata-ui/src/main/resources/ui/src/generated/entity/services/ingestionPipelines/ingestionPipeline.ts @@ -3888,6 +3888,10 @@ export interface ConfigClass { * List of IDs of your DBT cloud jobs seperated by comma `,` */ jobIds?: string[]; + /** + * Number of runs to fetch from DBT cloud + */ + numberOfRuns?: number; /** * List of IDs of your DBT cloud projects seperated by comma `,` */ diff --git a/openmetadata-ui/src/main/resources/ui/src/generated/entity/services/pipelineService.ts b/openmetadata-ui/src/main/resources/ui/src/generated/entity/services/pipelineService.ts index 57e7b277242..0ffa63674bc 100644 --- a/openmetadata-ui/src/main/resources/ui/src/generated/entity/services/pipelineService.ts +++ b/openmetadata-ui/src/main/resources/ui/src/generated/entity/services/pipelineService.ts @@ -392,6 +392,10 @@ export interface Connection { * List of IDs of your DBT cloud jobs seperated by comma `,` */ jobIds?: string[]; + /** + * Number of runs to fetch from DBT cloud + */ + numberOfRuns?: number; /** * List of IDs of your DBT cloud projects seperated by comma `,` */ diff --git a/openmetadata-ui/src/main/resources/ui/src/generated/metadataIngestion/testSuitePipeline.ts b/openmetadata-ui/src/main/resources/ui/src/generated/metadataIngestion/testSuitePipeline.ts index a242fb0e1d6..fbc45bffedd 100644 --- a/openmetadata-ui/src/main/resources/ui/src/generated/metadataIngestion/testSuitePipeline.ts +++ b/openmetadata-ui/src/main/resources/ui/src/generated/metadataIngestion/testSuitePipeline.ts @@ -1593,6 +1593,10 @@ export interface ConfigClass { * List of IDs of your DBT cloud jobs seperated by comma `,` */ jobIds?: string[]; + /** + * Number of runs to fetch from DBT cloud + */ + numberOfRuns?: number; /** * List of IDs of your DBT cloud projects seperated by comma `,` */ diff --git a/openmetadata-ui/src/main/resources/ui/src/generated/metadataIngestion/workflow.ts b/openmetadata-ui/src/main/resources/ui/src/generated/metadataIngestion/workflow.ts index 38fe027edac..70bd6c106e8 100644 --- a/openmetadata-ui/src/main/resources/ui/src/generated/metadataIngestion/workflow.ts +++ b/openmetadata-ui/src/main/resources/ui/src/generated/metadataIngestion/workflow.ts @@ -1629,6 +1629,10 @@ export interface ConfigClass { * List of IDs of your DBT cloud jobs seperated by comma `,` */ jobIds?: string[]; + /** + * Number of runs to fetch from DBT cloud + */ + numberOfRuns?: number; /** * List of IDs of your DBT cloud projects seperated by comma `,` */ diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/AddNotificationPage/AddNotificationPage.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/AddNotificationPage/AddNotificationPage.tsx index a07d4b4a15a..425738e29a9 100644 --- a/openmetadata-ui/src/main/resources/ui/src/pages/AddNotificationPage/AddNotificationPage.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/pages/AddNotificationPage/AddNotificationPage.tsx @@ -13,6 +13,7 @@ */ import { Button, + Card, Col, Divider, Form, @@ -226,8 +227,8 @@ const AddNotificationPage = () => { firstPanel={{ className: 'content-resizable-panel-containere', children: ( -
- + +
@@ -344,10 +345,11 @@ const AddNotificationPage = () => { - + ), minWidth: 700, flex: 0.7, + wrapInCard: false, }} pageTitle={t('label.add-entity', { entity: t('label.notification-alert'), diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/AddObservabilityPage/AddObservabilityPage.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/AddObservabilityPage/AddObservabilityPage.tsx index 5a91b72ee94..7270680f9bb 100644 --- a/openmetadata-ui/src/main/resources/ui/src/pages/AddObservabilityPage/AddObservabilityPage.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/pages/AddObservabilityPage/AddObservabilityPage.tsx @@ -11,7 +11,7 @@ * limitations under the License. */ -import { Button, Col, Divider, Form, Input, Row, Typography } from 'antd'; +import { Button, Card, Col, Divider, Form, Input, Row, Typography } from 'antd'; import { useForm } from 'antd/lib/form/Form'; import { isEmpty, isUndefined } from 'lodash'; import React, { useCallback, useEffect, useMemo, useState } from 'react'; @@ -203,8 +203,8 @@ function AddObservabilityPage() { firstPanel={{ className: 'content-resizable-panel-container ', children: ( -
- + +
@@ -329,10 +329,11 @@ function AddObservabilityPage() { - + ), minWidth: 700, flex: 0.7, + wrapInCard: false, }} pageTitle={t('label.add-entity', { entity: t('label.observability'), diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/AlertDetailsPage/AlertDetailsPage.test.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/AlertDetailsPage/AlertDetailsPage.test.tsx index 123d75cca2d..20a3ac39a43 100644 --- a/openmetadata-ui/src/main/resources/ui/src/pages/AlertDetailsPage/AlertDetailsPage.test.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/pages/AlertDetailsPage/AlertDetailsPage.test.tsx @@ -136,10 +136,8 @@ jest.mock( }) ); -jest.mock('../../components/common/ResizablePanels/ResizablePanels', () => - jest - .fn() - .mockImplementation(({ firstPanel }) =>
{firstPanel.children}
) +jest.mock('../../components/PageLayoutV1/PageLayoutV1', () => + jest.fn().mockImplementation(({ children }) =>
{children}
) ); jest.mock( diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/AlertDetailsPage/AlertDetailsPage.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/AlertDetailsPage/AlertDetailsPage.tsx index edd4b7e312e..b3915ccea21 100644 --- a/openmetadata-ui/src/main/resources/ui/src/pages/AlertDetailsPage/AlertDetailsPage.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/pages/AlertDetailsPage/AlertDetailsPage.tsx @@ -12,7 +12,7 @@ */ import { SyncOutlined } from '@ant-design/icons'; -import { Button, Col, Row, Skeleton, Space, Tabs, Tooltip } from 'antd'; +import { Button, Card, Col, Row, Skeleton, Space, Tabs, Tooltip } from 'antd'; import { AxiosError } from 'axios'; import { compare } from 'fast-json-patch'; import { isUndefined, omitBy } from 'lodash'; @@ -29,9 +29,9 @@ import DescriptionV1 from '../../components/common/EntityDescription/Description import ErrorPlaceHolder from '../../components/common/ErrorWithPlaceholder/ErrorPlaceHolder'; import Loader from '../../components/common/Loader/Loader'; import { OwnerLabel } from '../../components/common/OwnerLabel/OwnerLabel.component'; -import ResizablePanels from '../../components/common/ResizablePanels/ResizablePanels'; import TitleBreadcrumb from '../../components/common/TitleBreadcrumb/TitleBreadcrumb.component'; import EntityHeaderTitle from '../../components/Entity/EntityHeaderTitle/EntityHeaderTitle.component'; +import PageLayoutV1 from '../../components/PageLayoutV1/PageLayoutV1'; import { DE_ACTIVE_COLOR, ROUTES } from '../../constants/constants'; import { GlobalSettingsMenuCategory } from '../../constants/GlobalSettings.constants'; import { usePermissionProvider } from '../../context/PermissionProvider/PermissionProvider'; @@ -48,7 +48,6 @@ import { EventSubscription, ProviderType, } from '../../generated/events/eventSubscription'; -import { withPageLayout } from '../../hoc/withPageLayout'; import { useFqn } from '../../hooks/useFqn'; import { updateNotificationAlert } from '../../rest/alertsAPI'; import { @@ -59,7 +58,6 @@ import { } from '../../rest/observabilityAPI'; import { getAlertExtraInfo } from '../../utils/Alerts/AlertsUtil'; import { getEntityName } from '../../utils/EntityUtils'; -import i18n from '../../utils/i18next/LocalUtil'; import { DEFAULT_ENTITY_PERMISSION } from '../../utils/PermissionsUtils'; import { getNotificationAlertDetailsPath, @@ -336,158 +334,140 @@ function AlertDetailsPage({ } return ( - - ) : ( -
- -
- - - - - - - - - - - -
- {ownerLoading ? ( - - ) : ( - - )} - {extraInfo} -
- - - - - - - - - - - - - - - - - ), - minWidth: 700, - flex: 0.7, - }} + , - minWidth: 0, - className: 'content-resizable-panel-container', - }} - /> + })}> + {loadingCount ? ( + + ) : ( + + + + + + + + + + + + + + +
+ {ownerLoading ? ( + + ) : ( + + )} + {extraInfo} +
+ + + + + + + + + + + + + + + + + )} + ); } -export default withPageLayout( - i18n.t('label.entity-detail-plural', { - entity: i18n.t('label.alert'), - }) -)(AlertDetailsPage); +export default AlertDetailsPage; diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/AlertsActivityFeedPage/AlertsActivityFeedPage.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/AlertsActivityFeedPage/AlertsActivityFeedPage.tsx deleted file mode 100644 index 706d2a9bd39..00000000000 --- a/openmetadata-ui/src/main/resources/ui/src/pages/AlertsActivityFeedPage/AlertsActivityFeedPage.tsx +++ /dev/null @@ -1,103 +0,0 @@ -/* - * 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 { Card } from 'antd'; -import { noop, trim } from 'lodash'; -import React, { useCallback, useEffect, useMemo, useState } from 'react'; -import { useTranslation } from 'react-i18next'; -import Loader from '../../components/common/Loader/Loader'; -import { AlertDetailsComponent } from '../../components/Settings/Alerts/AlertsDetails/AlertDetails.component'; -import { EventFilterRule } from '../../generated/events/eventFilterRule'; -import { - EventSubscription, - FilteringRules, -} from '../../generated/events/eventSubscription'; -import { withPageLayout } from '../../hoc/withPageLayout'; -import { getAlertsFromName } from '../../rest/alertsAPI'; -import { getEntityName } from '../../utils/EntityUtils'; -import i18n from '../../utils/i18next/LocalUtil'; -import { showErrorToast } from '../../utils/ToastUtils'; - -const AlertsActivityFeedPage = () => { - const [loading, setLoading] = useState(false); - const [alert, setAlert] = useState(); - const { t } = useTranslation(); - const fetchActivityFeedAlert = useCallback(async () => { - try { - setLoading(true); - const response = await getAlertsFromName('ActivityFeedAlert'); - - const requestFilteringRules = - response.filteringRules?.rules?.map((curr) => { - const [fullyQualifiedName, filterRule] = curr.condition.split('('); - - return { - ...curr, - fullyQualifiedName, - condition: filterRule - .replaceAll("'", '') - .replace(new RegExp(`\\)`), '') - .split(',') - .map(trim), - } as unknown as EventFilterRule; - }) ?? []; - - setAlert({ - ...response, - filteringRules: { - ...(response.filteringRules as FilteringRules), - rules: requestFilteringRules, - }, - }); - } catch (error) { - showErrorToast( - t('server.entity-fetch-error', { - entity: t('label.activity-feed-plural'), - }) - ); - } finally { - setLoading(false); - } - }, []); - - useEffect(() => { - fetchActivityFeedAlert(); - }, []); - - const pageHeaderData = useMemo( - () => ({ - header: getEntityName(alert), - subHeader: alert?.description || '', - }), - [alert] - ); - - if (loading) { - return ; - } - - return alert ? ( - - ) : ( - - ); -}; - -export default withPageLayout(i18n.t('label.alert-details'))( - AlertsActivityFeedPage -); diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/CreateUserPage/CreateUserPage.component.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/CreateUserPage/CreateUserPage.component.tsx index b096e62884d..cec93ba5188 100644 --- a/openmetadata-ui/src/main/resources/ui/src/pages/CreateUserPage/CreateUserPage.component.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/pages/CreateUserPage/CreateUserPage.component.tsx @@ -11,6 +11,7 @@ * limitations under the License. */ +import { Card } from 'antd'; import { AxiosError } from 'axios'; import _ from 'lodash'; import React, { useEffect, useMemo, useState } from 'react'; @@ -216,7 +217,7 @@ const CreateUserPage = () => { -
+
{ onSave={handleAddUserSave} />
-
+ ); }; diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/CustomPropertiesPageV1/CustomPropertiesPageV1.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/CustomPropertiesPageV1/CustomPropertiesPageV1.tsx index 1a0073d5495..dc1f595a0db 100644 --- a/openmetadata-ui/src/main/resources/ui/src/pages/CustomPropertiesPageV1/CustomPropertiesPageV1.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/pages/CustomPropertiesPageV1/CustomPropertiesPageV1.tsx @@ -11,7 +11,7 @@ * limitations under the License. */ -import { Button, Col, Row, Tabs } from 'antd'; +import { Button, Card, Col, Row, Tabs } from 'antd'; import { AxiosError } from 'axios'; import { compare } from 'fast-json-patch'; import { isUndefined, startCase } from 'lodash'; @@ -228,11 +228,11 @@ const CustomEntityDetailV1 = () => { ), key: EntityTabs.CUSTOM_PROPERTIES, children: ( -
+
{editPermission && (
+ ), }, { label: t('label.schema'), key: EntityTabs.SCHEMA, children: ( -
- -
+ ), }, ]; diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/CustomPropertiesPageV1/custom-properties-pageV1.less b/openmetadata-ui/src/main/resources/ui/src/pages/CustomPropertiesPageV1/custom-properties-pageV1.less index b6ed4946453..3c7fedb87d4 100644 --- a/openmetadata-ui/src/main/resources/ui/src/pages/CustomPropertiesPageV1/custom-properties-pageV1.less +++ b/openmetadata-ui/src/main/resources/ui/src/pages/CustomPropertiesPageV1/custom-properties-pageV1.less @@ -11,7 +11,10 @@ * limitations under the License. */ +@import (reference) url('../../styles/variables.less'); + .custom-properties-schemaEditor { - border: 1px solid #dce3ec; - border-radius: 6px; + border: 1px solid @border-color; + border-radius: @border-radius-sm; + overflow: hidden; } diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/ObservabilityAlertsPage/ObservabilityAlertsPage.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/ObservabilityAlertsPage/ObservabilityAlertsPage.tsx index c0e52987fdc..46009413dba 100644 --- a/openmetadata-ui/src/main/resources/ui/src/pages/ObservabilityAlertsPage/ObservabilityAlertsPage.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/pages/ObservabilityAlertsPage/ObservabilityAlertsPage.tsx @@ -296,7 +296,7 @@ const ObservabilityAlertsPage = () => { return ( - +
diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/PoliciesPage/PoliciesDetailPage/AddRulePage.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/PoliciesPage/PoliciesDetailPage/AddRulePage.tsx index ce2376a3046..448a7e10afe 100644 --- a/openmetadata-ui/src/main/resources/ui/src/pages/PoliciesPage/PoliciesDetailPage/AddRulePage.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/pages/PoliciesPage/PoliciesDetailPage/AddRulePage.tsx @@ -11,7 +11,7 @@ * limitations under the License. */ -import { Button, Col, Form, Row, Space, Typography } from 'antd'; +import { Button, Card, Form, Space, Typography } from 'antd'; import { AxiosError } from 'axios'; import { compare } from 'fast-json-patch'; import { trim } from 'lodash'; @@ -144,39 +144,37 @@ const AddRulePage = () => { pageTitle={t('label.add-new-entity', { entity: t('label.rule'), })}> - -
- + + - - {t('label.add-new-entity', { entity: t('label.rule') })} - -
- - - - - - - - + + {t('label.add-new-entity', { entity: t('label.rule') })} + +
+ + + + + + + ); }; diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/PoliciesPage/PoliciesDetailPage/EditRulePage.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/PoliciesPage/PoliciesDetailPage/EditRulePage.tsx index 61084fbf149..c2772b41bf2 100644 --- a/openmetadata-ui/src/main/resources/ui/src/pages/PoliciesPage/PoliciesDetailPage/EditRulePage.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/pages/PoliciesPage/PoliciesDetailPage/EditRulePage.tsx @@ -11,7 +11,7 @@ * limitations under the License. */ -import { Button, Card, Col, Form, Row, Space, Typography } from 'antd'; +import { Button, Card, Form, Space, Typography } from 'antd'; import { AxiosError } from 'axios'; import { compare } from 'fast-json-patch'; import { trim } from 'lodash'; @@ -164,52 +164,45 @@ const EditRulePage = () => { return ( - - - - - - {t('label.edit-entity', { entity: t('label.rule') })}{' '} - {`"${ruleName}"`} - -
- - - - - - - - - + + + + {t('label.edit-entity', { entity: t('label.rule') })}{' '} + {`"${ruleName}"`} + +
+ + + + + + + ); }; diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/PoliciesPage/PoliciesDetailPage/PoliciesDetailPage.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/PoliciesPage/PoliciesDetailPage/PoliciesDetailPage.tsx index d5df8387954..879ce092d61 100644 --- a/openmetadata-ui/src/main/resources/ui/src/pages/PoliciesPage/PoliciesDetailPage/PoliciesDetailPage.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/pages/PoliciesPage/PoliciesDetailPage/PoliciesDetailPage.tsx @@ -71,11 +71,8 @@ import { getSettingPath, } from '../../../utils/RouterUtils'; import { showErrorToast } from '../../../utils/ToastUtils'; -import './policies-detail.less'; import PoliciesDetailsList from './PoliciesDetailsList.component'; -const { TabPane } = Tabs; - type Attribute = 'roles' | 'teams'; const PoliciesDetailPage = () => { @@ -371,6 +368,150 @@ const PoliciesDetailPage = () => { } }; + const rulesTab = useMemo(() => { + return ( + + {isEmpty(policy.rules) ? ( + + ) : ( + <> +
+ +
+ + + {policy.rules.map((rule) => ( + + + + {rule.name} + + {getRuleActionElement(rule)} + + + + {rule.description && ( + + + + {`${t('label.description')}:`} + + + + + + + )} + + + + + {`${t('label.resource-plural')}:`} + + + + + {rule.resources + ?.map((resource) => startCase(resource)) + ?.join(', ')} + + + + + + + + {`${t('label.operation-plural')}:`} + + + + + {rule.operations?.join(', ')} + + + + + + + {`${t('label.effect')}:`} + + + + + {startCase(rule.effect)} + + + + {rule.condition && ( + + + + {`${t('label.condition')}:`} + + + + {rule.condition} + + + )} + + + ))} + + + )} + + ); + }, [policy]); + + const tabItems = useMemo(() => { + return [ + { + key: 'rules', + label: t('label.rule-plural'), + children: rulesTab, + }, + { + key: 'roles', + label: t('label.role-plural'), + children: ( + setEntity({ record, attribute: 'roles' })} + /> + ), + }, + { + key: 'teams', + label: t('label.team-plural'), + children: ( + setEntity({ record, attribute: 'teams' })} + /> + ), + }, + ]; + }, [rulesTab, policy]); + useEffect(() => { init(); }, [fqn, policyPermission]); @@ -449,138 +590,11 @@ const PoliciesDetailPage = () => { onDescriptionUpdate={handleDescriptionUpdate} /> - - - {isEmpty(policy.rules) ? ( - - ) : ( - - - - - {policy.rules.map((rule) => ( - - - - {rule.name} - - {getRuleActionElement(rule)} - - - - {rule.description && ( - - - - {`${t('label.description')}:`} - - - - - - - )} - - - - - {`${t('label.resource-plural')}:`} - - - - - {rule.resources - ?.map((resource) => startCase(resource)) - ?.join(', ')} - - - - - - - - {`${t('label.operation-plural')}:`} - - - - - {rule.operations?.join(', ')} - - - - - - - {`${t('label.effect')}:`} - - - - - {startCase(rule.effect)} - - - - {rule.condition && ( - - - - {`${t('label.condition')}:`} - - - - {rule.condition} - - - )} - - - ))} - - - )} - - - - setEntity({ record, attribute: 'roles' }) - } - /> - - - - setEntity({ record, attribute: 'teams' }) - } - /> - - + )} diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/PoliciesPage/PoliciesDetailPage/policies-detail.less b/openmetadata-ui/src/main/resources/ui/src/pages/PoliciesPage/PoliciesDetailPage/policies-detail.less deleted file mode 100644 index 86955a74c62..00000000000 --- a/openmetadata-ui/src/main/resources/ui/src/pages/PoliciesPage/PoliciesDetailPage/policies-detail.less +++ /dev/null @@ -1,51 +0,0 @@ -/* - * 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 url('../../../styles/variables.less'); - -.policies-detail { - .list-table { - .ant-table-row .ant-table-cell:first-child, - .ant-table-thead .ant-table-cell:first-child { - padding-left: 16px; - } - } - - .ant-collapse { - background-color: @white; - border: 1px solid @border-color; - box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.12); - border-radius: 4px; - .ant-collapse-item { - .ant-collapse-header { - padding: 16px; - align-items: flex-start; - .ant-collapse-arrow { - color: @text-color; - font-size: 14px; - } - } - } - .ant-collapse-content { - border-top: none; - .ant-collapse-content-box { - padding-top: 0px; - } - } - } - .ant-space.tabpane-space { - > .ant-space-item:first-child { - align-self: flex-end; - } - } -} diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/RolesPage/RolesDetailPage/RolesDetailPage.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/RolesPage/RolesDetailPage/RolesDetailPage.tsx index af40e8ae0b3..ec9706c5b51 100644 --- a/openmetadata-ui/src/main/resources/ui/src/pages/RolesPage/RolesDetailPage/RolesDetailPage.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/pages/RolesPage/RolesDetailPage/RolesDetailPage.tsx @@ -12,7 +12,7 @@ */ import Icon from '@ant-design/icons'; -import { Button, Col, Modal, Row, Space, Tabs, Typography } from 'antd'; +import { Button, Card, Col, Modal, Row, Tabs, Typography } from 'antd'; import { AxiosError } from 'axios'; import { compare } from 'fast-json-patch'; import { isEmpty, isUndefined } from 'lodash'; @@ -49,11 +49,8 @@ import { getEntityName } from '../../../utils/EntityUtils'; import { getSettingPath } from '../../../utils/RouterUtils'; import { showErrorToast } from '../../../utils/ToastUtils'; import AddAttributeModal from '../AddAttributeModal/AddAttributeModal'; -import './roles-detail.less'; import RolesDetailPageList from './RolesDetailPageList.component'; -const { TabPane } = Tabs; - type Attribute = 'policies' | 'teams' | 'users'; interface AddAttribute { @@ -292,6 +289,67 @@ const RolesDetailPage = () => { } }; + const tabItems = useMemo(() => { + return [ + { + key: 'policies', + label: t('label.policy-plural'), + children: ( + +
+ +
+ + + setEntity({ record, attribute: 'policies' }) + } + /> + + ), + }, + { + key: 'teams', + label: t('label.team-plural'), + children: ( + setEntity({ record, attribute: 'teams' })} + /> + ), + }, + { + key: 'users', + label: t('label.user-plural'), + children: ( + setEntity({ record, attribute: 'users' })} + /> + ), + }, + ]; + }, [role]); + useEffect(() => { init(); }, [fqn, rolePermission]); @@ -307,7 +365,6 @@ const RolesDetailPage = () => { })}>
- <> {isEmpty(role) ? ( @@ -328,7 +385,7 @@ const RolesDetailPage = () => {
) : ( -
+ <>
{ - - - - - - setEntity({ record, attribute: 'policies' }) - } - /> - - - - - setEntity({ record, attribute: 'teams' }) - } - /> - - - - setEntity({ record, attribute: 'users' }) - } - /> - - - + defaultActiveKey="policies" + items={tabItems} + /> + )} diff --git a/openmetadata-ui/src/main/resources/ui/src/styles/components/add-edit-form-steps.less b/openmetadata-ui/src/main/resources/ui/src/styles/components/add-edit-form-steps.less index 86f2301289c..54b5fb5a6ad 100644 --- a/openmetadata-ui/src/main/resources/ui/src/styles/components/add-edit-form-steps.less +++ b/openmetadata-ui/src/main/resources/ui/src/styles/components/add-edit-form-steps.less @@ -13,8 +13,7 @@ // Common add edit form page styling .steps-form-container { width: 70%; - margin: 16px auto 0; - padding-bottom: 16px; + margin: 0 auto; .ant-form-item { margin: 0px; diff --git a/openmetadata-ui/src/main/resources/ui/src/styles/components/button.less b/openmetadata-ui/src/main/resources/ui/src/styles/components/button.less index a13b2a44d4d..00809b40896 100644 --- a/openmetadata-ui/src/main/resources/ui/src/styles/components/button.less +++ b/openmetadata-ui/src/main/resources/ui/src/styles/components/button.less @@ -25,7 +25,7 @@ button { } } -.ant-btn.ant-btn-default { +.ant-btn.ant-btn-default:not(:hover) { border-color: @blue-15; }