Alternative to #50081 which uses the original method of checking for …

…a slot fill to see if we need to render a custom header title for the editor canvas slot.
WordPress · Apr 26, 2023 · 0554029 · 0554029
1 parent 0824845
commit 0554029
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 5 deletions.
diff --git a/packages/edit-site/src/components/editor-canvas-container/index.js b/packages/edit-site/src/components/editor-canvas-container/index.js
@@ -5,6 +5,7 @@ import { Children, cloneElement, useState, useMemo } from '@wordpress/element';
 import {
 	Button,
 	privateApis as componentsPrivateApis,
+	__experimentalUseSlotFills as useSlotFills,
 } from '@wordpress/components';
 import { ESCAPE } from '@wordpress/keycodes';
 import { __ } from '@wordpress/i18n';
@@ -25,7 +26,7 @@ import { store as editSiteStore } from '../../store';
  *
  * @return {string} Translated string corresponding to value of view. Default is ''.
  */
-export function getEditorCanvasContainerTitle( view ) {
+function getEditorCanvasContainerTitle( view ) {
 	switch ( view ) {
 		case 'style-book':
 			return __( 'Style Book' );
@@ -37,8 +38,11 @@ export function getEditorCanvasContainerTitle( view ) {
 // Creates a private slot fill.
 const { createPrivateSlotFill } = unlock( componentsPrivateApis );
 const SLOT_FILL_NAME = 'EditSiteEditorCanvasContainerSlot';
-const { Slot: EditorCanvasContainerSlot, Fill: EditorCanvasContainerFill } =
-	createPrivateSlotFill( SLOT_FILL_NAME );
+const {
+	privateKey,
+	Slot: EditorCanvasContainerSlot,
+	Fill: EditorCanvasContainerFill,
+} = createPrivateSlotFill( SLOT_FILL_NAME );
 
 function EditorCanvasContainer( {
 	children,
@@ -110,6 +114,11 @@ function EditorCanvasContainer( {
 		</EditorCanvasContainerFill>
 	);
 }
+function useHasEditorCanvasContainer() {
+	const fills = useSlotFills( privateKey );
+	return !! fills?.length;
+}
 
 EditorCanvasContainer.Slot = EditorCanvasContainerSlot;
 export default EditorCanvasContainer;
+export { useHasEditorCanvasContainer, getEditorCanvasContainerTitle };
diff --git a/packages/edit-site/src/components/header-edit-mode/index.js b/packages/edit-site/src/components/header-edit-mode/index.js
@@ -38,7 +38,10 @@ import UndoButton from './undo-redo/undo';
 import RedoButton from './undo-redo/redo';
 import DocumentActions from './document-actions';
 import { store as editSiteStore } from '../../store';
-import { getEditorCanvasContainerTitle } from '../editor-canvas-container';
+import {
+	getEditorCanvasContainerTitle,
+	useHasEditorCanvasContainer,
+} from '../editor-canvas-container';
 import { unlock } from '../../private-apis';
 
 const preventDefault = ( event ) => {
@@ -122,7 +125,7 @@ export default function HeaderEditMode() {
 		[ setIsListViewOpened, isListViewOpen ]
 	);
 
-	const hasDefaultEditorCanvasView = ! editorCanvasView;
+	const hasDefaultEditorCanvasView = ! useHasEditorCanvasContainer();
 
 	const isFocusMode = templateType === 'wp_template_part';