Skip to content

Commit 2c2970e

Browse files
MaggieCabreracbravobernalockham
authored and
adamziel
committed
Comments Block: fixed issue with custom font sizes and links color (#41627)
Fix an issue where custom font sizes were not showing up properly on the frontend and after a reload they were disappearing from the editor. Also fix an issue where link color is not applied on site editor, both in Comment Author and Comment Date block. Co-authored-by: Carlos Bravo <carlos.bravo@automattic.com> Co-authored-by: Bernie Reiter <ockham@raz.or.at>
1 parent 66fb75b commit 2c2970e

File tree

16 files changed

+51
-70
lines changed

16 files changed

+51
-70
lines changed

‎docs/reference-guides/core-blocks.md‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -123,7 +123,7 @@ Displays the name of the author of the comment. ([Source](https://github.com/Wor
123123
- **Name:** core/comment-author-name
124124
- **Category:** theme
125125
- **Supports:** color (background, gradients, link, text), spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~
126-
- **Attributes:** fontSize, isLink, linkTarget, textAlign
126+
- **Attributes:** isLink, linkTarget, textAlign
127127

128128
## Comment Content
129129

@@ -141,7 +141,7 @@ Displays the date on which the comment was posted. ([Source](https://github.com/
141141
- **Name:** core/comment-date
142142
- **Category:** theme
143143
- **Supports:** color (background, gradients, link, text), typography (fontSize, lineHeight), ~~html~~
144-
- **Attributes:** fontSize, format, isLink
144+
- **Attributes:** format, isLink
145145

146146
## Comment Edit Link
147147

@@ -150,7 +150,7 @@ Displays a link to edit the comment in the WordPress Dashboard. This link is onl
150150
- **Name:** core/comment-edit-link
151151
- **Category:** theme
152152
- **Supports:** color (background, gradients, link, ~~text~~), typography (fontSize, lineHeight), ~~html~~
153-
- **Attributes:** fontSize, linkTarget, textAlign
153+
- **Attributes:** linkTarget, textAlign
154154

155155
## Comment Reply Link
156156

@@ -159,7 +159,7 @@ Displays a link to reply to a comment. ([Source](https://github.com/WordPress/gu
159159
- **Name:** core/comment-reply-link
160160
- **Category:** theme
161161
- **Supports:** color (background, gradients, link, ~~text~~), typography (fontSize, lineHeight), ~~html~~
162-
- **Attributes:** fontSize, textAlign
162+
- **Attributes:** textAlign
163163

164164
## Comment Template
165165

‎packages/block-library/src/comment-author-name/block.json‎

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -18,10 +18,6 @@
1818
},
1919
"textAlign": {
2020
"type": "string"
21-
},
22-
"fontSize": {
23-
"type": "string",
24-
"default": "small"
2521
}
2622
},
2723
"usesContext": [ "commentId" ],

‎packages/block-library/src/comment-author-name/edit.js‎

Lines changed: 3 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -41,7 +41,7 @@ export default function Edit( {
4141
[ `has-text-align-${ textAlign }` ]: textAlign,
4242
} ),
4343
} );
44-
const displayName = useSelect(
44+
let displayName = useSelect(
4545
( select ) => {
4646
const { getEntityRecord } = select( coreStore );
4747

@@ -92,15 +92,7 @@ export default function Edit( {
9292
);
9393

9494
if ( ! commentId || ! displayName ) {
95-
return (
96-
<>
97-
{ inspectorControls }
98-
{ blockControls }
99-
<div { ...blockProps }>
100-
{ _x( 'Comment Author', 'block title' ) }
101-
</div>
102-
</>
103-
);
95+
displayName = _x( 'Comment Author', 'block title' );
10496
}
10597

10698
const displayAuthor = isLink ? (
@@ -111,9 +103,8 @@ export default function Edit( {
111103
{ displayName }
112104
</a>
113105
) : (
114-
{ displayName }
106+
displayName
115107
);
116-
117108
return (
118109
<>
119110
{ inspectorControls }

‎packages/block-library/src/comment-date/block.json‎

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -14,10 +14,6 @@
1414
"isLink": {
1515
"type": "boolean",
1616
"default": true
17-
},
18-
"fontSize": {
19-
"type": "string",
20-
"default": "small"
2117
}
2218
},
2319
"usesContext": [ "commentId" ],

‎packages/block-library/src/comment-date/edit.js‎

Lines changed: 10 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,7 @@ export default function Edit( {
3333
setAttributes,
3434
} ) {
3535
const blockProps = useBlockProps();
36-
const [ date ] = useEntityProp( 'root', 'comment', 'date', commentId );
36+
let [ date ] = useEntityProp( 'root', 'comment', 'date', commentId );
3737
const [ siteFormat = getDateSettings().formats.date ] = useEntityProp(
3838
'root',
3939
'site',
@@ -60,21 +60,17 @@ export default function Edit( {
6060
);
6161

6262
if ( ! commentId || ! date ) {
63-
return (
64-
<>
65-
{ inspectorControls }
66-
<div { ...blockProps }>
67-
<time>{ _x( 'Comment Date', 'block title' ) }</time>
68-
</div>
69-
</>
70-
);
63+
date = _x( 'Comment Date', 'block title' );
7164
}
7265

73-
let commentDate = (
74-
<time dateTime={ dateI18n( 'c', date ) }>
75-
{ dateI18n( format || siteFormat, date ) }
76-
</time>
77-
);
66+
let commentDate =
67+
date instanceof Date ? (
68+
<time dateTime={ dateI18n( 'c', date ) }>
69+
{ dateI18n( format || siteFormat, date ) }
70+
</time>
71+
) : (
72+
<time>{ date }</time>
73+
);
7874

7975
if ( isLink ) {
8076
commentDate = (

‎packages/block-library/src/comment-date/index.php‎

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -24,9 +24,6 @@ function render_block_core_comment_date( $attributes, $content, $block ) {
2424
}
2525

2626
$classes = '';
27-
if ( isset( $attributes['fontSize'] ) ) {
28-
$classes .= 'has-' . esc_attr( $attributes['fontSize'] ) . '-font-size';
29-
}
3027

3128
$wrapper_attributes = get_block_wrapper_attributes( array( 'class' => $classes ) );
3229
$formatted_date = get_comment_date(

‎packages/block-library/src/comment-edit-link/block.json‎

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -15,10 +15,6 @@
1515
},
1616
"textAlign": {
1717
"type": "string"
18-
},
19-
"fontSize": {
20-
"type": "string",
21-
"default": "small"
2218
}
2319
},
2420
"supports": {

‎packages/block-library/src/comment-reply-link/block.json‎

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -11,10 +11,6 @@
1111
"attributes": {
1212
"textAlign": {
1313
"type": "string"
14-
},
15-
"fontSize": {
16-
"type": "string",
17-
"default": "small"
1814
}
1915
},
2016
"supports": {

‎packages/block-library/src/comments-query-loop/edit.js‎

Lines changed: 24 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -37,7 +37,12 @@ const TEMPLATE = [
3737
'core/column',
3838
{},
3939
[
40-
[ 'core/comment-author-name' ],
40+
[
41+
'core/comment-author-name',
42+
{
43+
fontSize: 'small',
44+
},
45+
],
4146
[
4247
'core/group',
4348
{
@@ -52,12 +57,27 @@ const TEMPLATE = [
5257
},
5358
},
5459
[
55-
[ 'core/comment-date' ],
56-
[ 'core/comment-edit-link' ],
60+
[
61+
'core/comment-date',
62+
{
63+
fontSize: 'small',
64+
},
65+
],
66+
[
67+
'core/comment-edit-link',
68+
{
69+
fontSize: 'small',
70+
},
71+
],
5772
],
5873
],
5974
[ 'core/comment-content' ],
60-
[ 'core/comment-reply-link' ],
75+
[
76+
'core/comment-reply-link',
77+
{
78+
fontSize: 'small',
79+
},
80+
],
6181
],
6282
],
6383
],

‎test/integration/fixtures/blocks/core__comment-author-name.json‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,8 +4,7 @@
44
"isValid": true,
55
"attributes": {
66
"isLink": true,
7-
"linkTarget": "_self",
8-
"fontSize": "small"
7+
"linkTarget": "_self"
98
},
109
"innerBlocks": []
1110
}

0 commit comments

Comments
 (0)