[WP 6.7] Fix meta boxes saving when they’re not present (#67503)

* Fix meta boxes saving when they’re not present

* Fix hiding/showing meta boxes

Co-authored-by: stokesman <presstoke@git.wordpress.org>

packages/edit-post/src/components/layout/index.js

@@ -74,6 +74,7 @@ import useEditPostCommands from '../../commands/use-commands';
 import { usePaddingAppender } from './use-padding-appender';
 import { useShouldIframe } from './use-should-iframe';
 import useNavigateToEntityRecord from '../../hooks/use-navigate-to-entity-record';
+import { useMetaBoxInitialization } from '../meta-boxes/use-meta-box-initialization';
 
 const { getLayoutStyles } = unlock( blockEditorPrivateApis );
 const { useCommands } = unlock( coreCommandsPrivateApis );
@@ -462,6 +463,7 @@ function Layout( {
 		},
 		[ currentPostType, isEditingTemplate, settings.supportsTemplateMode ]
 	);
+	useMetaBoxInitialization( hasActiveMetaboxes );
 
 	// Set the right context for the command palette
 	const commandContext = hasBlockSelected

packages/edit-post/src/components/meta-boxes/index.js

@@ -1,9 +1,7 @@
 /**
  * WordPress dependencies
  */
-import { useSelect, useRegistry } from '@wordpress/data';
-import { useEffect } from '@wordpress/element';
-import { store as editorStore } from '@wordpress/editor';
+import { useSelect } from '@wordpress/data';
 
 /**
  * Internal dependencies
@@ -13,38 +11,11 @@ import MetaBoxVisibility from './meta-box-visibility';
 import { store as editPostStore } from '../../store';
 
 export default function MetaBoxes( { location } ) {
-	const registry = useRegistry();
-	const { metaBoxes, areMetaBoxesInitialized, isEditorReady } = useSelect(
-		( select ) => {
-			const { __unstableIsEditorReady } = select( editorStore );
-			const {
-				getMetaBoxesPerLocation,
-				areMetaBoxesInitialized: _areMetaBoxesInitialized,
-			} = select( editPostStore );
-			return {
-				metaBoxes: getMetaBoxesPerLocation( location ),
-				areMetaBoxesInitialized: _areMetaBoxesInitialized(),
-				isEditorReady: __unstableIsEditorReady(),
-			};
-		},
+	const metaBoxes = useSelect(
+		( select ) =>
+			select( editPostStore ).getMetaBoxesPerLocation( location ),
 		[ location ]
 	);
-
-	const hasMetaBoxes = !! metaBoxes?.length;
-
-	// When editor is ready, initialize postboxes (wp core script) and metabox
-	// saving. This initializes all meta box locations, not just this specific
-	// one.
-	useEffect( () => {
-		if ( isEditorReady && hasMetaBoxes && ! areMetaBoxesInitialized ) {
-			registry.dispatch( editPostStore ).initializeMetaBoxes();
-		}
-	}, [ isEditorReady, hasMetaBoxes, areMetaBoxesInitialized ] );
-
-	if ( ! areMetaBoxesInitialized ) {
-		return null;
-	}
-
 	return (
 		<>
 			{ ( metaBoxes ?? [] ).map( ( { id } ) => (

packages/edit-post/src/components/meta-boxes/use-meta-box-initialization.js

@@ -0,0 +1,32 @@
+/**
+ * WordPress dependencies
+ */
+import { useDispatch, useSelect } from '@wordpress/data';
+import { store as editorStore } from '@wordpress/editor';
+import { useEffect } from '@wordpress/element';
+
+/**
+ * Internal dependencies
+ */
+import { store as editPostStore } from '../../store';
+
+/**
+ * Initializes WordPress `postboxes` script and the logic for saving meta boxes.
+ *
+ * @param { boolean } enabled
+ */
+export const useMetaBoxInitialization = ( enabled ) => {
+	const isEnabledAndEditorReady = useSelect(
+		( select ) =>
+			enabled && select( editorStore ).__unstableIsEditorReady(),
+		[ enabled ]
+	);
+	const { initializeMetaBoxes } = useDispatch( editPostStore );
+	// The effect has to rerun when the editor is ready because initializeMetaBoxes
+	// will noop until then.
+	useEffect( () => {
+		if ( isEnabledAndEditorReady ) {
+			initializeMetaBoxes();
+		}
+	}, [ isEnabledAndEditorReady, initializeMetaBoxes ] );
+};