diff --git a/packages/editor/src/components/collab-sidebar/comments.js b/packages/editor/src/components/collab-sidebar/comments.js
index b00c8494da0314..40bdcd39cc37eb 100644
--- a/packages/editor/src/components/collab-sidebar/comments.js
+++ b/packages/editor/src/components/collab-sidebar/comments.js
@@ -27,6 +27,7 @@ import { useEntityBlockEditor } from '@wordpress/core-data';
import CommentAuthorInfo from './comment-author-info';
import CommentForm from './comment-form';
import { getBlockByCommentId } from './utils';
+import { store as editorStore } from '../../store';
/**
* Renders the Comments component.
@@ -37,8 +38,6 @@ import { getBlockByCommentId } from './utils';
* @param {Function} props.onAddReply - The function to add a reply to a comment.
* @param {Function} props.onCommentDelete - The function to delete a comment.
* @param {Function} props.onCommentResolve - The function to mark a comment as resolved.
- * @param {string} props.postType - The post type.
- * @param {number} props.postId - The post ID.
* @return {React.ReactNode} The rendered Comments component.
*/
export function Comments( {
@@ -47,8 +46,6 @@ export function Comments( {
onAddReply,
onCommentDelete,
onCommentResolve,
- postType, // Ensure postType is passed as a prop
- postId, // Ensure postId is passed as a prop
} ) {
const [ actionState, setActionState ] = useState( false );
const [ isConfirmDialogOpen, setIsConfirmDialogOpen ] = useState( false );
@@ -78,6 +75,14 @@ export function Comments( {
);
}, [] );
+ const { postId, postType } = useSelect( ( select ) => {
+ const { getCurrentPostId, getCurrentPostType } = select( editorStore );
+ return {
+ postId: getCurrentPostId(),
+ postType: getCurrentPostType(),
+ };
+ }, [] );
+
const [ blocks ] = useEntityBlockEditor( 'postType', postType, {
id: postId,
} );
diff --git a/packages/editor/src/components/collab-sidebar/index.js b/packages/editor/src/components/collab-sidebar/index.js
index 047318538e4af9..17a23a227424a6 100644
--- a/packages/editor/src/components/collab-sidebar/index.js
+++ b/packages/editor/src/components/collab-sidebar/index.js
@@ -221,11 +221,6 @@ function CollabSidebarContent( { showCommentBoard, setShowCommentBoard } ) {
);
};
- const postType = useSelect(
- ( select ) => select( editorStore ).getCurrentPostType(),
- []
- );
-
return (
);
diff --git a/packages/editor/src/components/collab-sidebar/utils.js b/packages/editor/src/components/collab-sidebar/utils.js
index b6d8e548750ace..fc94b357ff7edd 100644
--- a/packages/editor/src/components/collab-sidebar/utils.js
+++ b/packages/editor/src/components/collab-sidebar/utils.js
@@ -8,20 +8,59 @@ export function sanitizeCommentString( str ) {
return str.trim();
}
+/**
+ * Extracts comment IDs from an array of blocks.
+ *
+ * This function recursively traverses the blocks and their inner blocks to
+ * collect all comment IDs found in the block attributes.
+ *
+ * @param {Array} blocks - The array of blocks to extract comment IDs from.
+ * @return {Array} An array of comment IDs extracted from the blocks.
+ */
+export function getCommentIdsFromBlocks( blocks ) {
+ // Recursive function to extract comment IDs from blocks
+ const extractCommentIds = ( items ) => {
+ return items.reduce( ( commentIds, block ) => {
+ // Check for comment IDs in the current block's attributes
+ if (
+ block.attributes &&
+ block.attributes.blockCommentId &&
+ ! commentIds.includes( block.attributes.blockCommentId )
+ ) {
+ commentIds.push( block.attributes.blockCommentId );
+ }
+
+ // Recursively check inner blocks
+ if ( block.innerBlocks && block.innerBlocks.length > 0 ) {
+ const innerCommentIds = extractCommentIds( block.innerBlocks );
+ commentIds.push( ...innerCommentIds );
+ }
+
+ return commentIds;
+ }, [] );
+ };
+
+ // Extract all comment IDs recursively
+ return extractCommentIds( blocks );
+}
+
export const getBlockByCommentId = ( blocks, commentId ) => {
- for ( const block of blocks ) {
- if ( block.attributes.blockCommentId === commentId ) {
- return block;
- }
- if ( block.innerBlocks && block.innerBlocks.length > 0 ) {
- const foundBlock = getBlockByCommentId(
- block.innerBlocks,
- commentId
- );
- if ( foundBlock ) {
- return foundBlock;
+ const extractClientId = ( blocksArray, commentID ) => {
+ for ( const block of blocksArray ) {
+ if ( block.attributes.blockCommentId === commentID ) {
+ return block;
+ }
+ if ( block.innerBlocks && block.innerBlocks.length > 0 ) {
+ const foundBlock = extractClientId(
+ block.innerBlocks,
+ commentID
+ );
+ if ( foundBlock ) {
+ return foundBlock;
+ }
}
}
- }
- return blocks ? getBlockByCommentId( blocks, commentId ) : null;
+ };
+
+ return blocks ? extractClientId( blocks, commentId ) : null;
};