diff --git a/src/containers/Header/Header.tsx b/src/containers/Header/Header.tsx index 94d767797d..e6a4a59394 100644 --- a/src/containers/Header/Header.tsx +++ b/src/containers/Header/Header.tsx @@ -14,7 +14,10 @@ import {DEVELOPER_UI_TITLE} from '../../utils/constants'; import {createDeveloperUIInternalPageHref} from '../../utils/developerUI/developerUI'; import {useTypedSelector} from '../../utils/hooks'; import {useDatabaseFromQuery} from '../../utils/hooks/useDatabaseFromQuery'; -import {useIsUserAllowedToMakeChanges} from '../../utils/hooks/useIsUserAllowedToMakeChanges'; +import { + useIsUserAllowedToMakeChanges, + useIsViewerUser, +} from '../../utils/hooks/useIsUserAllowedToMakeChanges'; import {getBreadcrumbs} from './breadcrumbs'; import {headerKeyset} from './i18n'; @@ -27,6 +30,7 @@ function Header() { const {page, pageBreadcrumbsOptions} = useTypedSelector((state) => state.header); const singleClusterMode = useTypedSelector((state) => state.singleClusterMode); const isUserAllowedToMakeChanges = useIsUserAllowedToMakeChanges(); + const isViewerUser = useIsViewerUser(); const {title: clusterTitle} = useClusterBaseInfo(); @@ -39,7 +43,11 @@ function Header() { useAddClusterFeatureAvailable() && uiFactory.onAddCluster !== undefined; const breadcrumbItems = React.useMemo(() => { - let options = {...pageBreadcrumbsOptions, singleClusterMode}; + let options = { + ...pageBreadcrumbsOptions, + singleClusterMode, + isViewerUser, + }; if (clusterTitle) { options = { @@ -53,7 +61,7 @@ function Header() { return breadcrumbs.map((item) => { return {...item, action: () => {}}; }); - }, [clusterTitle, page, pageBreadcrumbsOptions, singleClusterMode]); + }, [clusterTitle, page, pageBreadcrumbsOptions, singleClusterMode, isViewerUser]); const renderRightControls = () => { const elements: React.ReactNode[] = []; diff --git a/src/containers/Header/breadcrumbs.tsx b/src/containers/Header/breadcrumbs.tsx index e295e60532..07be45b450 100644 --- a/src/containers/Header/breadcrumbs.tsx +++ b/src/containers/Header/breadcrumbs.tsx @@ -46,7 +46,10 @@ const getQueryForTenant = (type: 'nodes' | 'tablets') => ({ [TenantTabsGroups.diagnosticsTab]: TENANT_DIAGNOSTICS_TABS_IDS[type], }); -const getClustersBreadcrumbs: GetBreadcrumbs = () => { +const getClustersBreadcrumbs: GetBreadcrumbs = (options) => { + if (!options.isViewerUser) { + return []; + } return [ { text: headerKeyset('breadcrumbs.clusters'), @@ -56,7 +59,11 @@ const getClustersBreadcrumbs: GetBreadcrumbs = () => }; const getClusterBreadcrumbs: GetBreadcrumbs = (options, query = {}) => { - const {clusterName, clusterTab, singleClusterMode} = options; + const {clusterName, clusterTab, singleClusterMode, isViewerUser} = options; + + if (!isViewerUser) { + return []; + } let breadcrumbs: RawBreadcrumbItem[] = []; diff --git a/src/store/reducers/authentication/authentication.ts b/src/store/reducers/authentication/authentication.ts index 460ebef8a9..ee9f307e57 100644 --- a/src/store/reducers/authentication/authentication.ts +++ b/src/store/reducers/authentication/authentication.ts @@ -26,7 +26,7 @@ export const slice = createSlice({ } }, setUser: (state, action: PayloadAction) => { - const {UserSID, AuthType, IsMonitoringAllowed} = action.payload; + const {UserSID, AuthType, IsMonitoringAllowed, IsViewerAllowed} = action.payload; state.user = AuthType === 'Login' ? UserSID : undefined; @@ -35,17 +35,19 @@ export const slice = createSlice({ // Otherwise every user is allowed to make changes // Anyway there will be guards on backend state.isUserAllowedToMakeChanges = IsMonitoringAllowed !== false; + state.isViewerUser = IsViewerAllowed; }, }, selectors: { selectIsUserAllowedToMakeChanges: (state) => state.isUserAllowedToMakeChanges, + selectIsViewerUser: (state) => state.isViewerUser, selectUser: (state) => state.user, }, }); export default slice.reducer; export const {setIsAuthenticated, setUser} = slice.actions; -export const {selectIsUserAllowedToMakeChanges, selectUser} = slice.selectors; +export const {selectIsUserAllowedToMakeChanges, selectIsViewerUser, selectUser} = slice.selectors; export const authenticationApi = api.injectEndpoints({ endpoints: (build) => ({ diff --git a/src/store/reducers/authentication/types.ts b/src/store/reducers/authentication/types.ts index bb58438c44..ba2218bf67 100644 --- a/src/store/reducers/authentication/types.ts +++ b/src/store/reducers/authentication/types.ts @@ -1,5 +1,6 @@ export interface AuthenticationState { isAuthenticated: boolean; isUserAllowedToMakeChanges?: boolean; + isViewerUser?: boolean; user: string | undefined; } diff --git a/src/store/reducers/header/types.ts b/src/store/reducers/header/types.ts index c1f1ce60a2..009b2dfc3c 100644 --- a/src/store/reducers/header/types.ts +++ b/src/store/reducers/header/types.ts @@ -15,7 +15,9 @@ export type Page = | 'storageGroup' | undefined; -export interface ClustersBreadcrumbsOptions {} +export interface ClustersBreadcrumbsOptions { + isViewerUser?: boolean; +} export interface ClusterBreadcrumbsOptions extends ClustersBreadcrumbsOptions { clusterName?: string; diff --git a/src/types/api/whoami.ts b/src/types/api/whoami.ts index 9b5cd52042..7313e4c5de 100644 --- a/src/types/api/whoami.ts +++ b/src/types/api/whoami.ts @@ -9,7 +9,9 @@ export interface TUserToken { OriginalUserToken?: string; AuthType?: string; - /** Is user allowed to view data */ + /** Is user allowed to view only database specific data */ + IsDatabaseAllowed?: boolean; + /** Is user allowed to view data (includes IsDatabaseAllowed rights) */ IsViewerAllowed?: boolean; /** Is user allowed to view deeper and make simple changes */ IsMonitoringAllowed?: boolean; diff --git a/src/utils/hooks/useIsUserAllowedToMakeChanges.ts b/src/utils/hooks/useIsUserAllowedToMakeChanges.ts index cb4b160256..7e7d9e0390 100644 --- a/src/utils/hooks/useIsUserAllowedToMakeChanges.ts +++ b/src/utils/hooks/useIsUserAllowedToMakeChanges.ts @@ -1,7 +1,13 @@ -import {selectIsUserAllowedToMakeChanges} from '../../store/reducers/authentication/authentication'; +import { + selectIsUserAllowedToMakeChanges, + selectIsViewerUser, +} from '../../store/reducers/authentication/authentication'; import {useTypedSelector} from './useTypedSelector'; export function useIsUserAllowedToMakeChanges() { return useTypedSelector(selectIsUserAllowedToMakeChanges); } +export function useIsViewerUser() { + return useTypedSelector(selectIsViewerUser); +}