show comment form if there is no comment on any block

packages/editor/src/components/collab-sidebar/add-comment.js

@@ -18,17 +18,11 @@ import CommentForm from './comment-form';
 /**
  * Renders the UI for adding a comment in the Gutenberg editor's collaboration sidebar.
  *
- * @param {Object}   props                     - The component props.
- * @param {Function} props.onSubmit            - A callback function to be called when the user submits a comment.
- * @param {boolean}  props.showCommentBoard    - The function to edit the comment.
- * @param {Function} props.setShowCommentBoard - The function to delete the comment.
- * @return {React.ReactNode} The rendered comment input UI.
+ * @param {Object}   props          - The component props.
+ * @param {Function} props.onSubmit - A callback function to be called when the user submits a comment.
+ * @return {JSX.Element} The rendered comment input UI.
  */
-export function AddComment( {
-	onSubmit,
-	showCommentBoard,
-	setShowCommentBoard,
-} ) {
+export function AddComment( { onSubmit } ) {
 	const { clientId, blockCommentId } = useSelect( ( select ) => {
 		const { getSelectedBlock } = select( blockEditorStore );
 		const selectedBlock = getSelectedBlock();
@@ -38,7 +32,7 @@ export function AddComment( {
 		};
 	} );
 
-	if ( ! showCommentBoard || ! clientId || undefined !== blockCommentId ) {
+	if ( ! clientId || undefined !== blockCommentId ) {
 		return null;
 	}
 
@@ -54,9 +48,7 @@ export function AddComment( {
 				onSubmit={ ( inputComment ) => {
 					onSubmit( inputComment );
 				} }
-				onCancel={ () => {
-					setShowCommentBoard( false );
-				} }
+				onCancel={ () => {} }
 				submitButtonText={ _x( 'Comment', 'Add comment button' ) }
 			/>
 		</VStack>

packages/editor/src/components/collab-sidebar/index.js

@@ -8,7 +8,7 @@ import {
 	resolveSelect,
 	subscribe,
 } from '@wordpress/data';
-import { useState, useMemo } from '@wordpress/element';
+import { useMemo } from '@wordpress/element';
 import { comment as commentIcon } from '@wordpress/icons';
 import { addFilter } from '@wordpress/hooks';
 import { store as noticesStore } from '@wordpress/notices';
@@ -51,12 +51,7 @@ addFilter(
 	modifyBlockCommentAttributes
 );
 
-function CollabSidebarContent( {
-	showCommentBoard,
-	setShowCommentBoard,
-	styles,
-	comments,
-} ) {
+function CollabSidebarContent( { styles, comments } ) {
 	const { createNotice } = useDispatch( noticesStore );
 	const { saveEntityRecord, deleteEntityRecord } = useDispatch( coreStore );
 	const { getEntityRecord } = resolveSelect( coreStore );
@@ -197,11 +192,7 @@ function CollabSidebarContent( {
 
 	return (
 		<div className="editor-collab-sidebar-panel" style={ styles }>
-			<AddComment
-				onSubmit={ addNewComment }
-				showCommentBoard={ showCommentBoard }
-				setShowCommentBoard={ setShowCommentBoard }
-			/>
+			<AddComment onSubmit={ addNewComment } />
 			<Comments
 				key={ getSelectedBlockClientId() }
 				threads={ comments }
@@ -220,7 +211,6 @@ function CollabSidebarContent( {
  * Renders the Collab sidebar.
  */
 export default function CollabSidebar() {
-	const [ showCommentBoard, setShowCommentBoard ] = useState( false );
 	const { enableComplementaryArea } = useDispatch( interfaceStore );
 	const { getActiveComplementaryArea } = useSelect( interfaceStore );
 
@@ -258,7 +248,6 @@ export default function CollabSidebar() {
 	}, [] );
 
 	const openCollabBoard = () => {
-		setShowCommentBoard( true );
 		enableComplementaryArea( 'core', 'edit-post/collab-sidebar' );
 	};
 
@@ -347,11 +336,7 @@ export default function CollabSidebar() {
 				title={ __( 'Comments' ) }
 				icon={ commentIcon }
 			>
-				<CollabSidebarContent
-					comments={ resultComments }
-					showCommentBoard={ showCommentBoard }
-					setShowCommentBoard={ setShowCommentBoard }
-				/>
+				<CollabSidebarContent comments={ resultComments } />
 			</PluginSidebar>
 			<PluginSidebar
 				isPinnable={ false }
@@ -362,8 +347,6 @@ export default function CollabSidebar() {
 			>
 				<CollabSidebarContent
 					comments={ sortedThreads }
-					showCommentBoard={ showCommentBoard }
-					setShowCommentBoard={ setShowCommentBoard }
 					styles={ {
 						backgroundColor,
 					} }