feat(sanity): use middleware components in StudioLayout

packages/sanity/src/core/studio/StudioLayout.tsx

@@ -13,6 +13,7 @@ import styled from 'styled-components'
 import {useHotModuleReload} from 'use-hot-module-reload'
 import {NoToolsScreen} from './screens/NoToolsScreen'
 import {ToolNotFoundScreen} from './screens/ToolNotFoundScreen'
+import {useNavbarComponent} from './studio-components-hooks'
 import {useWorkspace} from './workspace'
 import {RouteScope, useRouter} from 'sanity/router'
 
@@ -38,7 +39,7 @@ export const NavbarContext = createContext<NavbarContextValue>({
 /** @public */
 export function StudioLayout() {
   const {state: routerState} = useRouter()
-  const {name, title, tools, studio} = useWorkspace()
+  const {name, title, tools} = useWorkspace()
   const activeToolName = typeof routerState.tool === 'string' ? routerState.tool : undefined
   const activeTool = tools.find((tool) => tool.name === activeToolName)
   const [toolError, setToolError] = useState<{error: Error; info: React.ErrorInfo} | null>(null)
@@ -75,7 +76,7 @@ export function StudioLayout() {
     [fullscreenSearchPortalEl, handleSearchOpenChange]
   )
 
-  const {Navbar} = studio.components
+  const Navbar = useNavbarComponent()
 
   return (
     <Flex data-ui="ToolScreen" direction="column" height="fill" data-testid="studio-layout">