show comment form if there is no comment on any block and sidebar is …

…open
WordPress · rishishah-multidots · Oct 25, 2024 · Nov 25, 2024 · Nov 25, 2024 · Nov 25, 2024
commit b40fc189e0e92a99286c93db241248d334e52cda
diff --git a/packages/editor/src/components/collab-sidebar/add-comment.js b/packages/editor/src/components/collab-sidebar/add-comment.js
@@ -21,39 +21,28 @@ import { sanitizeCommentString } from './utils';
 /**
  * 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.
+ * @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 } ) {
 	// State to manage the comment thread.
 	const [ inputComment, setInputComment ] = useState( '' );
 
-	const {
-		defaultAvatar,
-		clientId,
-		blockCommentId,
-		showAddCommentBoard,
-		currentUser,
-	} = useSelect( ( select ) => {
-		const { getSettings } = select( blockEditorStore );
-		const { __experimentalDiscussionSettings } = getSettings();
-		const selectedBlock = select( blockEditorStore ).getSelectedBlock();
-		const userData = select( coreStore ).getCurrentUser();
-		return {
-			defaultAvatar: __experimentalDiscussionSettings?.avatarURL,
-			clientId: selectedBlock?.clientId,
-			blockCommentId: selectedBlock?.attributes?.blockCommentId,
-			showAddCommentBoard: showCommentBoard,
-			currentUser: userData,
-		};
-	} );
+	const { defaultAvatar, clientId, blockCommentId, currentUser } = useSelect(
+		( select ) => {
+			const { getSettings } = select( blockEditorStore );
+			const { __experimentalDiscussionSettings } = getSettings();
+			const selectedBlock = select( blockEditorStore ).getSelectedBlock();
+			const userData = select( coreStore ).getCurrentUser();
+			return {
+				defaultAvatar: __experimentalDiscussionSettings?.avatarURL,
+				clientId: selectedBlock?.clientId,
+				blockCommentId: selectedBlock?.attributes?.blockCommentId,
+				currentUser: userData,
+			};
+		}
+	);
 
 	const userAvatar =
 		currentUser && currentUser.avatar_urls && currentUser.avatar_urls[ 48 ]
@@ -65,11 +54,10 @@ export function AddComment( {
 	}, [ clientId ] );
 
 	const handleCancel = () => {
-		setShowCommentBoard( false );
 		setInputComment( '' );
 	};
 
-	if ( ! showAddCommentBoard || ! clientId || undefined !== blockCommentId ) {
+	if ( ! clientId || undefined !== blockCommentId ) {
 		return null;
 	}
 

diff --git a/packages/editor/src/components/collab-sidebar/index.js b/packages/editor/src/components/collab-sidebar/index.js
@@ -55,7 +55,6 @@ export default function CollabSidebar() {
 	const { getEntityRecord } = resolveSelect( coreStore );
 	const { enableComplementaryArea } = useDispatch( interfaceStore );
 	const [ blockCommentID, setBlockCommentID ] = useState( null );
-	const [ showCommentBoard, setShowCommentBoard ] = useState( false );
 	const { postId } = useSelect( ( select ) => {
 		return {
 			postId: select( editorStore ).getCurrentPostId(),
@@ -126,7 +125,6 @@ export default function CollabSidebar() {
 	}, [ threads ] );
 
 	const openCollabBoard = () => {
-		setShowCommentBoard( true );
 		enableComplementaryArea( 'core', 'edit-post/collab-sidebar' );
 	};
 
@@ -282,8 +280,6 @@ export default function CollabSidebar() {
 					<AddComment
 						threads={ resultComments }
 						onSubmit={ addNewComment }
-						showCommentBoard={ showCommentBoard }
-						setShowCommentBoard={ setShowCommentBoard }
 					/>
 					<Comments
 						threads={ resultComments }