diff --git a/packages/sanity/src/core/studio/components/navbar/StudioNavbar.tsx b/packages/sanity/src/core/studio/components/navbar/StudioNavbar.tsx index 5dc14f99d869..584a86f58660 100644 --- a/packages/sanity/src/core/studio/components/navbar/StudioNavbar.tsx +++ b/packages/sanity/src/core/studio/components/navbar/StudioNavbar.tsx @@ -11,6 +11,7 @@ import { useMediaIndex, } from '@sanity/ui' import {useCallback, useContext, useEffect, useMemo, useRef, useState} from 'react' +import {useObservable} from 'react-rx' import {NavbarContext} from 'sanity/_singletons' import {type RouterState, useRouterState} from 'sanity/router' import {styled} from 'styled-components' @@ -22,6 +23,7 @@ import {useTranslation} from '../../../i18n' import {ReleasesNav} from '../../../perspective/navbar/ReleasesNav' import {usePerspective} from '../../../perspective/usePerspective' import {getReleaseTone} from '../../../releases/util/getReleaseTone' +import {useRenderingContextStore} from '../../../store/_legacy/datastores' import {useToolMenuComponent} from '../../studio-components-hooks' import {useWorkspace} from '../../workspace' import {ConfigIssuesButton} from './configIssues/ConfigIssuesButton' @@ -74,6 +76,8 @@ export function StudioNavbar(props: Omit) { const routerState = useRouterState() const mediaIndex = useMediaIndex() const activeToolName = typeof routerState.tool === 'string' ? routerState.tool : undefined + const renderingContextStore = useRenderingContextStore() + const renderingContextCapabilities = useObservable(renderingContextStore.capabilities) const newDocumentOptions = useNewDocumentOptions() const {t} = useTranslation() @@ -108,18 +112,20 @@ export function StudioNavbar(props: Omit) { const [drawerButtonEl, setDrawerButtonEl] = useState(null) const [searchOpenButtonEl, setSearchOpenButtonEl] = useState(null) - const shouldRender = useMemo( - () => ({ + const shouldRender = useMemo(() => { + const shouldRenderTools = mediaIndex >= 3 + + return { resources: mediaIndex > 1, collapsedPresenceMenu: mediaIndex <= 1, loginStatus: mediaIndex > 1, searchFullscreen: mediaIndex <= 1, configIssues: mediaIndex > 1 && isDev, newDocumentFullscreen: mediaIndex <= 1, - tools: mediaIndex >= 3, - }), - [mediaIndex], - ) + tools: shouldRenderTools, + userMenu: shouldRenderTools && !renderingContextCapabilities?.globalUserMenu, + } + }, [mediaIndex, renderingContextCapabilities]) useEffect(() => { onSearchFullscreenOpenChange(searchFullscreenOpen) @@ -284,7 +290,7 @@ export function StudioNavbar(props: Omit) { {actionNodes} - {shouldRender.tools && ( + {shouldRender.userMenu && ( diff --git a/packages/sanity/src/core/studio/components/navbar/navDrawer/NavDrawer.tsx b/packages/sanity/src/core/studio/components/navbar/navDrawer/NavDrawer.tsx index 3acd47846d61..d9b375d859d3 100644 --- a/packages/sanity/src/core/studio/components/navbar/navDrawer/NavDrawer.tsx +++ b/packages/sanity/src/core/studio/components/navbar/navDrawer/NavDrawer.tsx @@ -3,12 +3,14 @@ import {Box, Card, Flex, Layer, Stack, Text} from '@sanity/ui' import {AnimatePresence, motion, type Transition, type Variants} from 'framer-motion' import {type KeyboardEvent, memo, useCallback, useMemo} from 'react' import TrapFocus from 'react-focus-lock' +import {useObservable} from 'react-rx' import {styled} from 'styled-components' import {Button} from '../../../../../ui-components' import {UserAvatar} from '../../../../components' import {type NavbarAction, type Tool} from '../../../../config' import {useTranslation} from '../../../../i18n' +import {useRenderingContextStore} from '../../../../store/_legacy/datastores' import {useColorSchemeSetValue} from '../../../colorScheme' import {useToolMenuComponent} from '../../../studio-components-hooks' import {useWorkspace} from '../../../workspace' @@ -87,6 +89,8 @@ export const NavDrawer = memo(function NavDrawer(props: NavDrawerProps) { const {auth, currentUser} = useWorkspace() const workspaces = useWorkspaces() const ToolMenu = useToolMenuComponent() + const renderingContextStore = useRenderingContextStore() + const renderingContextCapabilities = useObservable(renderingContextStore.capabilities) const {t} = useTranslation() @@ -161,20 +165,22 @@ export const NavDrawer = memo(function NavDrawer(props: NavDrawerProps) { {/* Current user */} - - - - - - {currentUser?.name || currentUser?.email} - - + {!renderingContextCapabilities?.globalUserMenu && ( + + + + + + {currentUser?.name || currentUser?.email} + + + - + )}