From d6d18886d29ccfd8e5d2a3729e06b47d904ec3a9 Mon Sep 17 00:00:00 2001 From: Chirag Madlani <12962843+chirag-madlani@users.noreply.github.com> Date: Mon, 5 Sep 2022 23:06:06 +0530 Subject: [PATCH] fix(ui): activity feed settings page ui updates (#7227) --- .../auth-provider/AuthProvider.tsx | 34 +++++---- .../authenticators/OidcAuthenticator.tsx | 9 ++- .../PermissionProvider.interface.ts | 1 - .../ActivityFeedSettingsPage.style.less | 13 ++-- .../ActivityFeedSettingsPage.tsx | 74 ++++++++++++++++--- .../ui/src/router/GlobalSettingRouter.tsx | 6 +- .../resources/ui/src/styles/antd-master.less | 1 + .../ui/src/utils/GlobalSettingsUtils.tsx | 4 +- 8 files changed, 105 insertions(+), 37 deletions(-) diff --git a/openmetadata-ui/src/main/resources/ui/src/authentication/auth-provider/AuthProvider.tsx b/openmetadata-ui/src/main/resources/ui/src/authentication/auth-provider/AuthProvider.tsx index 18b676b1acf..afabe3016d6 100644 --- a/openmetadata-ui/src/main/resources/ui/src/authentication/auth-provider/AuthProvider.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/authentication/auth-provider/AuthProvider.tsx @@ -264,21 +264,25 @@ export const AuthProvider = ({ * It will try for max 3 times if it's not succeed then it will proceed for logout */ const trySilentSignIn = () => { - // Try to renew token - silentSignInRetries < 3 - ? renewIdToken() - .then(() => { - silentSignInRetries = 0; - // eslint-disable-next-line @typescript-eslint/no-use-before-define - startTokenExpiryTimer(); - }) - .catch((err) => { - // eslint-disable-next-line no-console - console.error('Error while attempting for silent signIn. ', err); - silentSignInRetries += 1; - trySilentSignIn(); - }) - : onLogoutHandler(); // Logout if we reaches max silent signIn limit; + const pathName = location.pathname; + // Do not try silent sign in for SignIn or SignUp route + if ([ROUTES.SIGNIN, ROUTES.SIGNUP].indexOf(pathName) === -1) { + // Try to renew token + silentSignInRetries < 3 + ? renewIdToken() + .then(() => { + silentSignInRetries = 0; + // eslint-disable-next-line @typescript-eslint/no-use-before-define + startTokenExpiryTimer(); + }) + .catch((err) => { + // eslint-disable-next-line no-console + console.error('Error while attempting for silent signIn. ', err); + silentSignInRetries += 1; + trySilentSignIn(); + }) + : onLogoutHandler(); // Logout if we reaches max silent signIn limit; + } }; /** diff --git a/openmetadata-ui/src/main/resources/ui/src/authentication/authenticators/OidcAuthenticator.tsx b/openmetadata-ui/src/main/resources/ui/src/authentication/authenticators/OidcAuthenticator.tsx index 5fa46439824..253ffe99385 100644 --- a/openmetadata-ui/src/main/resources/ui/src/authentication/authenticators/OidcAuthenticator.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/authentication/authenticators/OidcAuthenticator.tsx @@ -22,7 +22,7 @@ import React, { useMemo, } from 'react'; import { Callback, makeAuthenticator, makeUserManager } from 'react-oidc'; -import { Redirect, Route, Switch } from 'react-router-dom'; +import { Redirect, Route, Switch, useHistory } from 'react-router-dom'; import AppState from '../../AppState'; import Loader from '../../components/Loader/Loader'; import { oidcTokenKey, ROUTES } from '../../constants/constants'; @@ -74,6 +74,7 @@ const OidcAuthenticator = forwardRef( setIsSigningIn, setLoadingIndicator, } = useAuthContext(); + const history = useHistory(); const { userDetails, newUser } = AppState; const userManager = useMemo( () => makeUserManager(userConfig), @@ -148,6 +149,12 @@ const OidcAuthenticator = forwardRef( <> { + // eslint-disable-next-line no-console + console.error(error); + + history.push(ROUTES.SIGNIN); + }} onSuccess={(user) => { localStorage.setItem(oidcTokenKey, user.id_token); }} diff --git a/openmetadata-ui/src/main/resources/ui/src/components/PermissionProvider/PermissionProvider.interface.ts b/openmetadata-ui/src/main/resources/ui/src/components/PermissionProvider/PermissionProvider.interface.ts index 0ac57d327f0..10f33f9cfa3 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/PermissionProvider/PermissionProvider.interface.ts +++ b/openmetadata-ui/src/main/resources/ui/src/components/PermissionProvider/PermissionProvider.interface.ts @@ -23,7 +23,6 @@ export type OperationPermission = { export enum ResourceEntity { ALL = 'all', - ACTIVITY_FEED = 'activityFeed', BOT = 'bot', CHART = 'chart', DASHBOARD = 'dashboard', diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/ActivityFeedSettingsPage/ActivityFeedSettingsPage.style.less b/openmetadata-ui/src/main/resources/ui/src/pages/ActivityFeedSettingsPage/ActivityFeedSettingsPage.style.less index 67ed532ae68..a3edf14a0ae 100644 --- a/openmetadata-ui/src/main/resources/ui/src/pages/ActivityFeedSettingsPage/ActivityFeedSettingsPage.style.less +++ b/openmetadata-ui/src/main/resources/ui/src/pages/ActivityFeedSettingsPage/ActivityFeedSettingsPage.style.less @@ -2,15 +2,18 @@ .ant-tree-list-holder-inner { margin-left: -16px; } - .ant-tree-list-holder { - padding: 0.5rem; - } .ant-tree-switcher.ant-tree-switcher_open { visibility: hidden; } - .ant-tree-node-content-wrapper { padding: 0; } - margin-left: -8px; + .ant-divider.ant-divider-horizontal { + margin: 16px 0; + } +} + +.settings-page-card-container { + box-shadow: 1px 1px 3px 0px rgb(0 0 0 / 12%); + border: 1px #dde3ea solid; } diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/ActivityFeedSettingsPage/ActivityFeedSettingsPage.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/ActivityFeedSettingsPage/ActivityFeedSettingsPage.tsx index dd717b8875c..e42f87427bf 100644 --- a/openmetadata-ui/src/main/resources/ui/src/pages/ActivityFeedSettingsPage/ActivityFeedSettingsPage.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/pages/ActivityFeedSettingsPage/ActivityFeedSettingsPage.tsx @@ -1,5 +1,15 @@ /* eslint-disable @typescript-eslint/camelcase */ -import { Button, Card, Col, Divider, Row, Space, Tree, Typography } from 'antd'; +import { + Button, + Card, + Col, + Divider, + Row, + Space, + Tooltip, + Tree, + Typography, +} from 'antd'; import { AxiosError } from 'axios'; import { cloneDeep, isUndefined, map, startCase } from 'lodash'; import React, { Key, useEffect, useState } from 'react'; @@ -11,13 +21,18 @@ import { } from '../../axiosAPIs/eventFiltersAPI'; import ErrorPlaceHolder from '../../components/common/error-with-placeholder/ErrorPlaceHolder'; import Loader from '../../components/Loader/Loader'; +import { usePermissionProvider } from '../../components/PermissionProvider/PermissionProvider'; +import { ResourceEntity } from '../../components/PermissionProvider/PermissionProvider.interface'; import { TERM_ALL } from '../../constants/constants'; +import { NO_PERMISSION_FOR_ACTION } from '../../constants/HelperTextUtil'; +import { Operation } from '../../generated/entity/policies/policy'; import { EventFilter, Filters, SettingType, } from '../../generated/settings/settings'; import jsonData from '../../jsons/en'; +import { checkPermission } from '../../utils/PermissionsUtils'; import { showErrorToast, showSuccessToast } from '../../utils/ToastUtils'; import './ActivityFeedSettingsPage.style.less'; import { getEventFilterFromTree } from './ActivityFeedSettingsPage.utils'; @@ -69,7 +84,9 @@ const ActivityFeedSettingsPage: React.FC = () => { return [ { key: entityType, - title: {startCase(entityType)}, + title: ( + {startCase(entityType)} + ), data: true, children: data?.map(({ eventType, include, exclude }) => { @@ -164,6 +181,19 @@ const ActivityFeedSettingsPage: React.FC = () => { setCheckedKeys(checkKeys); }, [eventFilters, updatedTree, selectedKey]); + const { permissions } = usePermissionProvider(); + + const editPermission = checkPermission( + Operation.EditAll, + ResourceEntity.FEED, + permissions + ); + const createPermission = checkPermission( + Operation.Create, + ResourceEntity.FEED, + permissions + ); + const handleResetClick = async () => { try { setLoading(true); @@ -193,21 +223,25 @@ const ActivityFeedSettingsPage: React.FC = () => { <> - + Activity Feed - + {eventFilters && map(eventFilters, ({ entityType, filters }, index) => ( <> {entityType !== TERM_ALL ? ( -
+
{ - - + + + + + + diff --git a/openmetadata-ui/src/main/resources/ui/src/router/GlobalSettingRouter.tsx b/openmetadata-ui/src/main/resources/ui/src/router/GlobalSettingRouter.tsx index 8c52a2a35ec..fa6b0da06f9 100644 --- a/openmetadata-ui/src/main/resources/ui/src/router/GlobalSettingRouter.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/router/GlobalSettingRouter.tsx @@ -234,8 +234,12 @@ const GlobalSettingRouter = () => { exact // Currently we don't have any permission related to ActivityFeed settings page // update below once we have it - hasPermission component={ActivityFeedSettingsPage} + hasPermission={checkPermission( + Operation.ViewAll, + ResourceEntity.FEED, + permissions + )} path={getSettingPath( GlobalSettingsMenuCategory.COLLABORATION, GlobalSettingOptions.ACTIVITY_FEED diff --git a/openmetadata-ui/src/main/resources/ui/src/styles/antd-master.less b/openmetadata-ui/src/main/resources/ui/src/styles/antd-master.less index 4d4bfa07357..9e2ee690b42 100644 --- a/openmetadata-ui/src/main/resources/ui/src/styles/antd-master.less +++ b/openmetadata-ui/src/main/resources/ui/src/styles/antd-master.less @@ -27,6 +27,7 @@ 0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 9px 28px 8px rgba(0, 0, 0, 0.05); @table-header-bg: #fff; @border-radius-base: 4px; +@checkbox-size: 14px; @import url('./components/table.less'); @import url('./components/toggle-switch.less'); diff --git a/openmetadata-ui/src/main/resources/ui/src/utils/GlobalSettingsUtils.tsx b/openmetadata-ui/src/main/resources/ui/src/utils/GlobalSettingsUtils.tsx index e0b05cafeec..37d5686d2f9 100644 --- a/openmetadata-ui/src/main/resources/ui/src/utils/GlobalSettingsUtils.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/utils/GlobalSettingsUtils.tsx @@ -176,8 +176,8 @@ export const getGlobalSettingsMenuWithPermission = ( { label: 'Activity Feed', isProtected: checkPermission( - Operation.EditAll, - ResourceEntity.ACTIVITY_FEED, + Operation.ViewAll, + ResourceEntity.FEED, permissions ), icon: ,