Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

onNavigateToEntityRecord throws error when used with useEntityBlockEditor, useEntityRecord, or getEditedEntityRecord #65543

Closed
2 tasks done
mijan-xs opened this issue Sep 22, 2024 · 3 comments
Labels
[Type] Bug An existing feature does not function as intended

Comments

@mijan-xs
Copy link

Description

I am encountering an error when using onNavigateToEntityRecord in combination with useEntityBlockEditor, useEntityRecord, or getEditedEntityRecord. Navigation to entity records does not work as expected, and the function throws an error instead.

Step-by-step reproduction instructions

  1. Create a custom block with wordpress/create-block package
  2. Open src > edit.js file and replace the code with the below code,
import { __ } from '@wordpress/i18n';
import {
	useBlockProps,
	store as blockEditorStore,
} from '@wordpress/block-editor';
import './editor.scss';
import { useSelect } from '@wordpress/data';
import { useEntityBlockEditor } from '@wordpress/core-data';
import { Button } from '@wordpress/components';
export default function Edit() {
	const ref = 357; //This is the static post id of loop template
	const {
		onNavigateToEntityRecord,
	} = useSelect(
		(select) => {
			const { getSettings } = select(blockEditorStore);
			return {
				onNavigateToEntityRecord: getSettings().onNavigateToEntityRecord,
			};
		},
		[]
	);
	const [blocks] = useEntityBlockEditor('postType', 'post', {
		id: ref,
	});
	const blockProps = useBlockProps();
	const handleEditOriginal = () => {
		onNavigateToEntityRecord({ postId: ref, postType: 'post' })
	};
	return (
		<>
			
			<div {...blockProps}>
				<Button onClick={handleEditOriginal} variant="primary">Edit Original</Button>
			</div>
		</>
	);
}
  1. Replace ref with the actual post ID to navigate to a specific post
  2. build and active the plugin
  3. use your block
  4. You will see a button click on it After that, you will see the error

Screenshots, screen recording, code snippet

Console Error image

const [blocks] = useEntityBlockEditor('postType', 'post', {
	id: ref,
}); //Throw error when I write this line

Additional Context

  • I am also using useEntityRecord and getEditedEntityRecord in this block.

  • The issue only occurs when using these hooks together with onNavigateToEntityRecord. Separately, the hooks work without errors.

Environment info

  • WordPress Version: 6.6.2
  • With Gutenberg or without Gutenberg throw error my version was: 19.2.0
  • Browser: Chrome 129
  • OS: Windows 11

Please confirm that you have searched existing issues in the repo.

  • Yes

Please confirm that you have tested with all plugins deactivated except Gutenberg.

  • Yes
@mijan-xs mijan-xs added the [Type] Bug An existing feature does not function as intended label Sep 22, 2024
@Mamaduka
Copy link
Member

Related #64814.

@Tropicalista
Copy link

Related #64814.

In my case this was solved by upgrading Gutenberg to 19.4. Can you check?

@mijan-xs
Copy link
Author

Related #64814.

In my case this was solved by upgrading Gutenberg to 19.4. Can you check?

My issue was also resolved by upgrading to Gutenberg 19.4. It seems like the update fixed the problem. Thanks for the suggestion!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Type] Bug An existing feature does not function as intended
Projects
None yet
Development

No branches or pull requests

3 participants