fix: prevents Create banner from rendering when pane is collapsed

packages/sanity/src/structure/panes/document/document-layout/DocumentLayout.tsx

@@ -6,7 +6,7 @@ import {
   useElementRect,
 } from '@sanity/ui'
 import {isHotkey} from 'is-hotkey-esm'
-import {useCallback, useMemo, useState} from 'react'
+import {type ReactNode, useCallback, useMemo, useState} from 'react'
 import {useTranslation} from 'react-i18next'
 import {
   ChangeConnectorRoot,
@@ -25,7 +25,7 @@ import {type Path} from 'sanity-diff-patch'
 import {styled} from 'styled-components'
 
 import {TooltipDelayGroupProvider} from '../../../../ui-components'
-import {Pane, PaneFooter, usePaneLayout} from '../../../components'
+import {Pane, PaneFooter, usePane, usePaneLayout} from '../../../components'
 import {DOCUMENT_PANEL_PORTAL_ELEMENT} from '../../../constants'
 import {structureLocaleNamespace} from '../../../i18n'
 import {useStructureTool} from '../../../useStructureTool'
@@ -85,6 +85,7 @@ export function DocumentLayout() {
   const {features} = useStructureTool()
   const {t} = useTranslation(structureLocaleNamespace)
   const {collapsed: layoutCollapsed} = usePaneLayout()
+
   const zOffsets = useZIndex()
   const previewUrl = usePreviewUrl(value)
 
@@ -211,7 +212,9 @@ export function DocumentLayout() {
           <DocumentPanelHeader ref={setHeaderElement} menuItems={menuItems} />
 
           {createLinkMetadata && isCreateLinked(createLinkMetadata) && CreateLinkedBanner && (
-            <CreateLinkedBanner metadata={createLinkMetadata} />
+            <ShowWhenPaneOpen>
+              <CreateLinkedBanner metadata={createLinkMetadata} />
+            </ShowWhenPaneOpen>
           )}
 
           <DialogProvider position={DIALOG_PROVIDER_POSITION} zOffset={zOffsets.paneDialog}>
@@ -255,3 +258,12 @@ export function DocumentLayout() {
     </GetFormValueProvider>
   )
 }
+
+/**
+ * Prevents whatever is inside of it from rendering when the pane is collapsed.
+ * Needed locally as DocumentLayout does lives outside PaneContext, but is provided _somewhere_ within it.
+ */
+function ShowWhenPaneOpen(props: {children: ReactNode}) {
+  const {collapsed} = usePane()
+  return collapsed ? null : props.children
+}