From 68b99e8142b14080218ca77f678b9e33f52a404a Mon Sep 17 00:00:00 2001
From: Nik Tsekouras <ntsekouras@outlook.com>
Date: Tue, 28 Sep 2021 18:41:27 +0300
Subject: [PATCH] [Block Library - Post Comment Content]: Fix block's edit
 function (#35190)

* [Block Library - Post Comment Content]: Fix block's edit function

* Update packages/block-library/src/post-comment-content/index.php

Co-authored-by: George Mamadashvili <georgemamadashvili@gmail.com>

* address feedback

Co-authored-by: George Mamadashvili <georgemamadashvili@gmail.com>
---
 .../src/post-comment-content/edit.js          | 26 ++++++++++++-------
 .../src/post-comment-content/index.php        |  9 ++++---
 .../block-library/src/post-comment/edit.js    | 21 ++++++++++-----
 3 files changed, 37 insertions(+), 19 deletions(-)

diff --git a/packages/block-library/src/post-comment-content/edit.js b/packages/block-library/src/post-comment-content/edit.js
index e9dd8c46d9cf10..52b65fe53b2f63 100644
--- a/packages/block-library/src/post-comment-content/edit.js
+++ b/packages/block-library/src/post-comment-content/edit.js
@@ -1,24 +1,32 @@
 /**
  * WordPress dependencies
  */
+import { __ } from '@wordpress/i18n';
+import { RawHTML } from '@wordpress/element';
 import { useEntityProp } from '@wordpress/core-data';
-import { useBlockProps } from '@wordpress/block-editor';
-
-// TODO: JSDOC types
-export default function Edit( { attributes, context } ) {
-	const { className } = attributes;
-	const { commentId } = context;
+import { useBlockProps, Warning } from '@wordpress/block-editor';
+import { Disabled } from '@wordpress/components';
 
+export default function Edit( { context: { commentId } } ) {
+	const blockProps = useBlockProps();
 	const [ content ] = useEntityProp(
 		'root',
 		'comment',
 		'content',
 		commentId
 	);
-
+	if ( ! content?.rendered ) {
+		return (
+			<div { ...blockProps }>
+				<Warning>{ __( 'Comment has no content.' ) }</Warning>
+			</div>
+		);
+	}
 	return (
-		<div { ...useBlockProps() }>
-			<p className={ className }>{ content }</p>
+		<div { ...blockProps }>
+			<Disabled>
+				<RawHTML key="html">{ content.rendered }</RawHTML>
+			</Disabled>
 		</div>
 	);
 }
diff --git a/packages/block-library/src/post-comment-content/index.php b/packages/block-library/src/post-comment-content/index.php
index 0670fb0af15da3..e96af31ee3f357 100644
--- a/packages/block-library/src/post-comment-content/index.php
+++ b/packages/block-library/src/post-comment-content/index.php
@@ -17,11 +17,14 @@ function render_block_core_post_comment_content( $attributes, $content, $block )
 	if ( ! isset( $block->context['commentId'] ) ) {
 		return '';
 	}
-	$wrapper_attributes = get_block_wrapper_attributes();
+	$comment_text = get_comment_text( $block->context['commentId'] );
+	if ( ! $comment_text ) {
+		return '';
+	}
 	return sprintf(
 		'<div %1$s>%2$s</div>',
-		$wrapper_attributes,
-		get_comment_text( $block->context['commentId'] )
+		get_block_wrapper_attributes(),
+		$comment_text
 	);
 }
 
diff --git a/packages/block-library/src/post-comment/edit.js b/packages/block-library/src/post-comment/edit.js
index f3182d806c3a05..540c3955992c50 100644
--- a/packages/block-library/src/post-comment/edit.js
+++ b/packages/block-library/src/post-comment/edit.js
@@ -5,18 +5,29 @@ import { __ } from '@wordpress/i18n';
 import { Placeholder, TextControl, Button } from '@wordpress/components';
 import { useState } from '@wordpress/element';
 import { blockDefault } from '@wordpress/icons';
-import { InnerBlocks, useBlockProps } from '@wordpress/block-editor';
+import {
+	useBlockProps,
+	__experimentalUseInnerBlocksProps as useInnerBlocksProps,
+} from '@wordpress/block-editor';
 
 const ALLOWED_BLOCKS = [
 	'core/post-comment-content',
 	'core/post-comment-author',
+	'core/post-comment-date',
+];
+const TEMPLATE = [
+	[ 'core/post-comment-content' ],
+	[ 'core/post-comment-author' ],
 ];
 
-// TODO: JSDOC types
 export default function Edit( { attributes, setAttributes } ) {
 	const { commentId } = attributes;
 	const [ commentIdInput, setCommentIdInput ] = useState( commentId );
 	const blockProps = useBlockProps();
+	const innerBlocksProps = useInnerBlocksProps( blockProps, {
+		template: TEMPLATE,
+		allowedBlocks: ALLOWED_BLOCKS,
+	} );
 
 	if ( ! commentId ) {
 		return (
@@ -48,9 +59,5 @@ export default function Edit( { attributes, setAttributes } ) {
 		);
 	}
 
-	return (
-		<div { ...blockProps }>
-			<InnerBlocks allowedBlocks={ ALLOWED_BLOCKS } />
-		</div>
-	);
+	return <div { ...innerBlocksProps } />;
 }