Revert "Block bindings: Refactor passing select and dispatch instead …

…of full Registry. (WordPress#65710)"

This reverts commit 4e532d0.

packages/block-editor/src/components/rich-text/index.js

@@ -188,7 +188,7 @@ export function RichTextWrapper(
 
 			const _disableBoundBlock =
 				! blockBindingsSource?.canUserEditValue?.( {
-					select,
+					registry,
 					context: blockBindingsContext,
 					args: relatedBinding.args,
 				} );
@@ -206,7 +206,7 @@ export function RichTextWrapper(
 			const { getBlockAttributes } = select( blockEditorStore );
 			const blockAttributes = getBlockAttributes( clientId );
 			const fieldsList = blockBindingsSource?.getFieldsList?.( {
-				select,
+				registry,
 				context: blockBindingsContext,
 			} );
 			const bindingKey =
@@ -235,7 +235,14 @@ export function RichTextWrapper(
 				bindingsLabel: _bindingsLabel,
 			};
 		},
-		[ blockBindings, identifier, blockName, blockContext, adjustedValue ]
+		[
+			blockBindings,
+			identifier,
+			blockName,
+			blockContext,
+			registry,
+			adjustedValue,
+		]
 	);
 
 	const shouldDisableEditing = readOnly || disableBoundBlock;

packages/block-editor/src/hooks/block-bindings.js

@@ -12,7 +12,7 @@ import {
 	__experimentalVStack as VStack,
 	privateApis as componentsPrivateApis,
 } from '@wordpress/components';
-import { useSelect } from '@wordpress/data';
+import { useRegistry, useSelect } from '@wordpress/data';
 import { useContext, Fragment } from '@wordpress/element';
 import { useViewportMatch } from '@wordpress/compose';
 
@@ -186,14 +186,15 @@ function EditableBlockBindingsPanelItems( {
 }
 
 export const BlockBindingsPanel = ( { name: blockName, metadata } ) => {
+	const registry = useRegistry();
 	const blockContext = useContext( BlockContext );
 	const { removeAllBlockBindings } = useBlockBindingsUtils();
 	const bindableAttributes = getBindableAttributes( blockName );
 	const dropdownMenuProps = useToolsPanelDropdownMenuProps();
 
 	// `useSelect` is used purposely here to ensure `getFieldsList`
 	// is updated whenever there are updates in block context.
-	// `source.getFieldsList` may also call a selector via `select`.
+	// `source.getFieldsList` may also call a selector via `registry.select`.
 	const _fieldsList = {};
 	const { fieldsList, canUpdateBlockBindings } = useSelect(
 		( select ) => {
@@ -213,7 +214,7 @@ export const BlockBindingsPanel = ( { name: blockName, metadata } ) => {
 							}
 						}
 						const sourceList = getFieldsList( {
-							select,
+							registry,
 							context,
 						} );
 						// Only add source if the list is not empty.
@@ -233,7 +234,7 @@ export const BlockBindingsPanel = ( { name: blockName, metadata } ) => {
 						.canUpdateBlockBindings,
 			};
 		},
-		[ blockContext, bindableAttributes ]
+		[ blockContext, bindableAttributes, registry ]
 	);
 	// Return early if there are no bindable attributes.
 	if ( ! bindableAttributes || bindableAttributes.length === 0 ) {

packages/block-editor/src/hooks/use-bindings-attributes.js

@@ -118,81 +118,79 @@ export const withBlockBindingSupport = createHigherOrderComponent(
 		// there are attribute updates.
 		// `source.getValues` may also call a selector via `registry.select`.
 		const updatedContext = {};
-		const boundAttributes = useSelect(
-			( select ) => {
-				if ( ! blockBindings ) {
-					return;
-				}
-
-				const attributes = {};
+		const boundAttributes = useSelect( () => {
+			if ( ! blockBindings ) {
+				return;
+			}
 
-				const blockBindingsBySource = new Map();
+			const attributes = {};
 
-				for ( const [ attributeName, binding ] of Object.entries(
-					blockBindings
-				) ) {
-					const { source: sourceName, args: sourceArgs } = binding;
-					const source = sources[ sourceName ];
-					if (
-						! source ||
-						! canBindAttribute( name, attributeName )
-					) {
-						continue;
-					}
+			const blockBindingsBySource = new Map();
 
-					// Populate context.
-					for ( const key of source.usesContext || [] ) {
-						updatedContext[ key ] = blockContext[ key ];
-					}
+			for ( const [ attributeName, binding ] of Object.entries(
+				blockBindings
+			) ) {
+				const { source: sourceName, args: sourceArgs } = binding;
+				const source = sources[ sourceName ];
+				if ( ! source || ! canBindAttribute( name, attributeName ) ) {
+					continue;
+				}
 
-					blockBindingsBySource.set( source, {
-						...blockBindingsBySource.get( source ),
-						[ attributeName ]: {
-							args: sourceArgs,
-						},
-					} );
+				// Populate context.
+				for ( const key of source.usesContext || [] ) {
+					updatedContext[ key ] = blockContext[ key ];
 				}
 
-				if ( blockBindingsBySource.size ) {
-					for ( const [
-						source,
-						bindings,
-					] of blockBindingsBySource ) {
-						// Get values in batch if the source supports it.
-						let values = {};
-						if ( ! source.getValues ) {
-							Object.keys( bindings ).forEach( ( attr ) => {
-								// Default to the the source label when `getValues` doesn't exist.
-								values[ attr ] = source.label;
-							} );
+				blockBindingsBySource.set( source, {
+					...blockBindingsBySource.get( source ),
+					[ attributeName ]: {
+						args: sourceArgs,
+					},
+				} );
+			}
+
+			if ( blockBindingsBySource.size ) {
+				for ( const [ source, bindings ] of blockBindingsBySource ) {
+					// Get values in batch if the source supports it.
+					let values = {};
+					if ( ! source.getValues ) {
+						Object.keys( bindings ).forEach( ( attr ) => {
+							// Default to the the source label when `getValues` doesn't exist.
+							values[ attr ] = source.label;
+						} );
+					} else {
+						values = source.getValues( {
+							registry,
+							context: updatedContext,
+							clientId,
+							bindings,
+						} );
+					}
+					for ( const [ attributeName, value ] of Object.entries(
+						values
+					) ) {
+						if (
+							attributeName === 'url' &&
+							( ! value || ! isURLLike( value ) )
+						) {
+							// Return null if value is not a valid URL.
+							attributes[ attributeName ] = null;
 						} else {
-							values = source.getValues( {
-								select,
-								context: updatedContext,
-								clientId,
-								bindings,
-							} );
-						}
-						for ( const [ attributeName, value ] of Object.entries(
-							values
-						) ) {
-							if (
-								attributeName === 'url' &&
-								( ! value || ! isURLLike( value ) )
-							) {
-								// Return null if value is not a valid URL.
-								attributes[ attributeName ] = null;
-							} else {
-								attributes[ attributeName ] = value;
-							}
+							attributes[ attributeName ] = value;
 						}
 					}
 				}
+			}
 
-				return attributes;
-			},
-			[ blockBindings, name, clientId, updatedContext, sources ]
-		);
+			return attributes;
+		}, [
+			blockBindings,
+			name,
+			clientId,
+			updatedContext,
+			registry,
+			sources,
+		] );
 
 		const hasParentPattern = !! updatedContext[ 'pattern/overrides' ];
 		const hasPatternOverridesDefaultBinding =
@@ -242,8 +240,7 @@ export const withBlockBindingSupport = createHigherOrderComponent(
 							bindings,
 						] of blockBindingsBySource ) {
 							source.setValues( {
-								select: registry.select,
-								dispatch: registry.dispatch,
+								registry,
 								context: updatedContext,
 								clientId,
 								bindings,

packages/block-library/src/button/edit.js

@@ -48,7 +48,7 @@ import {
 	store as blocksStore,
 } from '@wordpress/blocks';
 import { useMergeRefs, useRefEffect } from '@wordpress/compose';
-import { useSelect, useDispatch } from '@wordpress/data';
+import { useSelect, useDispatch, useRegistry } from '@wordpress/data';
 
 const LINK_SETTINGS = [
 	...LinkControl.DEFAULT_LINK_SETTINGS,
@@ -190,6 +190,7 @@ function ButtonEdit( props ) {
 	const colorProps = useColorProps( attributes );
 	const spacingProps = useSpacingProps( attributes );
 	const shadowProps = useShadowProps( attributes );
+	const registry = useRegistry();
 	const ref = useRef();
 	const richTextRef = useRef();
 	const blockProps = useBlockProps( {
@@ -248,7 +249,7 @@ function ButtonEdit( props ) {
 				lockUrlControls:
 					!! metadata?.bindings?.url &&
 					! blockBindingsSource?.canUserEditValue?.( {
-						select,
+						registry,
 						context,
 						args: metadata?.bindings?.url?.args,
 					} ),

packages/block-library/src/image/edit.js

@@ -9,7 +9,7 @@ import clsx from 'clsx';
 import { isBlobURL, createBlobURL } from '@wordpress/blob';
 import { store as blocksStore, createBlock } from '@wordpress/blocks';
 import { Placeholder } from '@wordpress/components';
-import { useDispatch, useSelect } from '@wordpress/data';
+import { useDispatch, useSelect, useRegistry } from '@wordpress/data';
 import {
 	BlockIcon,
 	useBlockProps,
@@ -113,6 +113,7 @@ export function ImageEdit( {
 
 	const [ temporaryURL, setTemporaryURL ] = useState( attributes.blob );
 
+	const registry = useRegistry();
 	const containerRef = useRef();
 	// Only observe the max width from the parent container when the parent layout is not flex nor grid.
 	// This won't work for them because the container width changes with the image.
@@ -380,7 +381,7 @@ export function ImageEdit( {
 				lockUrlControls:
 					!! metadata?.bindings?.url &&
 					! blockBindingsSource?.canUserEditValue?.( {
-						select,
+						registry,
 						context,
 						args: metadata?.bindings?.url?.args,
 					} ),

packages/block-library/src/image/image.js

@@ -17,7 +17,7 @@ import {
 	Placeholder,
 } from '@wordpress/components';
 import { useViewportMatch } from '@wordpress/compose';
-import { useSelect, useDispatch } from '@wordpress/data';
+import { useSelect, useDispatch, useRegistry } from '@wordpress/data';
 import {
 	BlockControls,
 	InspectorControls,
@@ -134,6 +134,7 @@ export default function Image( {
 	const numericWidth = width ? parseInt( width, 10 ) : undefined;
 	const numericHeight = height ? parseInt( height, 10 ) : undefined;
 
+	const registry = useRegistry();
 	const imageRef = useRef();
 	const { allowResize = true } = context;
 	const { getBlock, getSettings } = useSelect( blockEditorStore );
@@ -496,7 +497,7 @@ export default function Image( {
 				lockUrlControls:
 					!! urlBinding &&
 					! urlBindingSource?.canUserEditValue?.( {
-						select,
+						registry,
 						context,
 						args: urlBinding?.args,
 					} ),
@@ -511,7 +512,7 @@ export default function Image( {
 				lockAltControls:
 					!! altBinding &&
 					! altBindingSource?.canUserEditValue?.( {
-						select,
+						registry,
 						context,
 						args: altBinding?.args,
 					} ),
@@ -525,7 +526,7 @@ export default function Image( {
 				lockTitleControls:
 					!! titleBinding &&
 					! titleBindingSource?.canUserEditValue?.( {
-						select,
+						registry,
 						context,
 						args: titleBinding?.args,
 					} ),

packages/e2e-tests/plugins/block-bindings/index.js

@@ -14,10 +14,10 @@ const getValues = ( { bindings } ) => {
 	}
 	return newValues;
 };
-const setValues = ( { dispatch, bindings } ) => {
+const setValues = ( { registry, bindings } ) => {
 	Object.values( bindings ).forEach( ( { args, newValue } ) => {
 		// Example of what could be done.
-		dispatch( 'core' ).editEntityRecord( 'postType', 'post', 1, {
+		registry.dispatch( 'core' ).editEntityRecord( 'postType', 'post', 1, {
 			meta: { [ args?.key ]: newValue },
 		} );
 	} );