Update block to be similar to other comment blocks

packages/block-library/src/post-comment-edit/block.json

@@ -1,22 +1,33 @@
 {
 	"apiVersion": 2,
 	"name": "core/post-comment-edit",
+	"title": "Post Comment Edit Link",
 	"category": "design",
-	"usesContext": [ "commentId" ],
 	"parent": [ "core/post-comment" ],
+	"description": "Displays a link to edit the comment in the WordPress Dashboard. This link is only visible to users with the edit comment capability.",
+	"textdomain": "default",
+	"usesContext": [ "commentId" ],
 	"attributes": {
-		"openInNewTab": {
-			"type": "boolean",
-			"default": false
+		"linkTarget": {
+			"type": "string",
+			"default": "_self"
 		}
 	},
 	"supports": {
 		"html": false,
 		"color": {
 			"link": true,
+			"gradients": true,
 			"text": false
 		},
-		"fontSize": true,
-		"lineHeight": true
+		"typography": {
+			"fontSize": true,
+			"lineHeight": true,
+			"__experimentalFontFamily": true,
+			"__experimentalFontWeight": true,
+			"__experimentalFontStyle": true,
+			"__experimentalTextTransform": true,
+			"__experimentalLetterSpacing": true
+		}
 	}
 }

packages/block-library/src/post-comment-edit/edit.js

@@ -5,26 +5,37 @@ import { InspectorControls, useBlockProps } from '@wordpress/block-editor';
 import { PanelBody, ToggleControl } from '@wordpress/components';
 import { __ } from '@wordpress/i18n';
 
-export default function Edit( { attributes, setAttributes } ) {
-	const { openInNewTab } = attributes;
+export default function Edit( {
+	attributes: { className, linkTarget },
+	setAttributes,
+} ) {
+	const blockProps = useBlockProps( { className } );
+	const inspectorControls = (
+		<InspectorControls>
+			<PanelBody title={ __( 'Link settings' ) }>
+				<ToggleControl
+					label={ __( 'Open in new tab' ) }
+					onChange={ ( value ) =>
+						setAttributes( {
+							linkTarget: value ? '_blank' : '_self',
+						} )
+					}
+					checked={ linkTarget === '_blank' }
+				/>
+			</PanelBody>
+		</InspectorControls>
+	);
 
 	return (
 		<>
-			<InspectorControls>
-				<PanelBody title={ __( 'Link settings' ) }>
-					<ToggleControl
-						label={ __( 'Open in new tab' ) }
-						checked={ openInNewTab }
-						onChange={ () =>
-							setAttributes( {
-								openInNewTab: ! openInNewTab,
-							} )
-						}
-					/>
-				</PanelBody>
-			</InspectorControls>
-			<div { ...useBlockProps() }>
-				<a href="#edit-comment-pseudo-link">{ __( 'Edit' ) }</a>
+			{ inspectorControls }
+			<div { ...blockProps }>
+				<a
+					href="#edit-comment-pseudo-link"
+					onClick={ ( event ) => event.preventDefault() }
+				>
+					{ __( 'Edit' ) }
+				</a>
 			</div>
 		</>
 	);

packages/block-library/src/post-comment-edit/index.js

@@ -1,7 +1,6 @@
 /**
  * WordPress dependencies
  */
-import { __, _x } from '@wordpress/i18n';
 import { edit as icon } from '@wordpress/icons';
 
 /**
@@ -14,10 +13,6 @@ const { name } = metadata;
 export { metadata, name };
 
 export const settings = {
-	title: _x( 'Post Comment Edit Link', 'block title' ),
-	description: __(
-		'Displays a link to edit the comment in the WordPress Dashboard. This link is only visible to users with the edit comment capability.'
-	),
 	icon,
 	edit,
 };

packages/block-library/src/post-comment-edit/index.php

@@ -20,12 +20,11 @@ function render_block_core_post_comment_edit( $attributes, $content, $block ) {
 	}
 
 	$edit_comment_link = get_edit_comment_link( $block->context['commentId'] );
-	$open_in_new_tab   = true === $attributes['openInNewTab'];
 
 	$link_atts = '';
 
-	if ( $open_in_new_tab ) {
-		$link_atts .= 'target="_blank"';
+	if ( ! empty( $attributes['linkTarget'] ) ) {
+		$link_atts .= sprintf( 'target="%s"', $attributes['linkTarget'] );
 	}
 
 	return sprintf(

test/integration/fixtures/blocks/core__post-comment-edit.html

@@ -1 +1 @@
-<!-- wp:post-comment-edit /-->
+<!-- wp:post-comment-edit {"linkTarget":"_blank","style":{"typography":{"fontStyle":"normal","fontWeight":"700","lineHeight":"2","textTransform":"uppercase","letterSpacing":"13px"},"elements":{"link":{"color":{"text":"#ed1717"}}}},"backgroundColor":"recommended-color-03","fontSize":"extra-large","fontFamily":"system-monospace"} /-->

test/integration/fixtures/blocks/core__post-comment-edit.json

@@ -4,7 +4,26 @@
 		"name": "core/post-comment-edit",
 		"isValid": true,
 		"attributes": {
-			"openInNewTab": false
+			"linkTarget": "_blank",
+			"backgroundColor": "recommended-color-03",
+			"fontFamily": "system-monospace",
+			"fontSize": "extra-large",
+			"style": {
+				"typography": {
+					"fontStyle": "normal",
+					"fontWeight": "700",
+					"lineHeight": "2",
+					"textTransform": "uppercase",
+					"letterSpacing": "13px"
+				},
+				"elements": {
+					"link": {
+						"color": {
+							"text": "#ed1717"
+						}
+					}
+				}
+			}
 		},
 		"innerBlocks": [],
 		"originalContent": ""

test/integration/fixtures/blocks/core__post-comment-edit.parsed.json

@@ -1,7 +1,28 @@
 [
 	{
 		"blockName": "core/post-comment-edit",
-		"attrs": {},
+		"attrs": {
+			"linkTarget": "_blank",
+			"style": {
+				"typography": {
+					"fontStyle": "normal",
+					"fontWeight": "700",
+					"lineHeight": "2",
+					"textTransform": "uppercase",
+					"letterSpacing": "13px"
+				},
+				"elements": {
+					"link": {
+						"color": {
+							"text": "#ed1717"
+						}
+					}
+				}
+			},
+			"backgroundColor": "recommended-color-03",
+			"fontSize": "extra-large",
+			"fontFamily": "system-monospace"
+		},
 		"innerBlocks": [],
 		"innerHTML": "",
 		"innerContent": []

test/integration/fixtures/blocks/core__post-comment-edit.serialized.html

@@ -1 +1 @@
-<!-- wp:post-comment-edit /-->
+<!-- wp:post-comment-edit {"linkTarget":"_blank","backgroundColor":"recommended-color-03","fontFamily":"system-monospace","fontSize":"extra-large","style":{"typography":{"fontStyle":"normal","fontWeight":"700","lineHeight":"2","textTransform":"uppercase","letterSpacing":"13px"},"elements":{"link":{"color":{"text":"#ed1717"}}}}} /-->