Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Block Library: Add features to the Post Tags block. #20418

Closed
wants to merge 1 commit into from
Closed

Block Library: Add features to the Post Tags block. #20418

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
14 changes: 13 additions & 1 deletion packages/block-library/src/post-tags/block.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,16 @@
{
"name": "core/post-tags",
"category": "layout"
"category": "layout",
"attributes": {
"beforeText": {
"type": "string"
},
"separator": {
"type": "string",
"default": " | "
},
"afterText": {
"type": "string"
}
}
}
56 changes: 50 additions & 6 deletions packages/block-library/src/post-tags/edit.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,8 +4,12 @@
import { useEntityProp, useEntityId } from '@wordpress/core-data';
import { useSelect } from '@wordpress/data';
import { __ } from '@wordpress/i18n';
import { RichText } from '@wordpress/block-editor';

function PostTagsDisplay() {
function PostTagsDisplay( {
attributes: { beforeText, separator, afterText },
setAttributes,
} ) {
const [ tags ] = useEntityProp( 'postType', 'post', 'tags' );
const tagLinks = useSelect(
( select ) => {
Expand All @@ -28,15 +32,55 @@ function PostTagsDisplay() {
);
return (
tagLinks &&
( tagLinks.length === 0
? __( 'No tags.' )
: tagLinks.reduce( ( prev, curr ) => [ prev, ' | ', curr ] ) )
( tagLinks.length === 0 ? (
__( 'No tags.' )
) : (
<>
<RichText
tagName="span"
placeholder={ __( 'Before text.' ) }
keepPlaceholderOnFocus
value={ beforeText }
onChange={ ( newBeforeText ) =>
setAttributes( { beforeText: newBeforeText } )
}
/>{ ' ' }
{ tagLinks.reduce( ( prev, curr ) => [
prev,
<RichText
key={ prev + curr }
tagName="span"
placeholder={ __( ' | ' ) }
keepPlaceholderOnFocus
value={ separator }
onChange={ ( newSeparator ) =>
setAttributes( { separator: newSeparator } )
}
/>,
curr,
] ) }{ ' ' }
<RichText
tagName="span"
placeholder={ __( 'After text.' ) }
keepPlaceholderOnFocus
value={ afterText }
onChange={ ( newAfterText ) =>
setAttributes( { afterText: newAfterText } )
}
/>
</>
) )
);
}

export default function PostTagsEdit() {
export default function PostTagsEdit( { attributes, setAttributes } ) {
if ( ! useEntityId( 'postType', 'post' ) ) {
return 'Post Tags Placeholder';
}
return <PostTagsDisplay />;
return (
<PostTagsDisplay
attributes={ attributes }
setAttributes={ setAttributes }
/>
);
}
44 changes: 38 additions & 6 deletions packages/block-library/src/post-tags/index.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,20 +8,40 @@
/**
* Renders the `core/post-tags` block on the server.
*
* @param array $attributes The block attributes.
*
* @return string Returns the filtered post tags for the current post wrapped inside "a" tags.
*/
function render_block_core_post_tags() {
function render_block_core_post_tags( $attributes ) {
$post = gutenberg_get_post_from_context();
if ( ! $post ) {
return '';
}
$post_tags = get_the_tags();
if ( ! empty( $post_tags ) ) {
$output = '';
foreach ( $post_tags as $tag ) {
$output .= '<a href="' . get_tag_link( $tag->term_id ) . '">' . $tag->name . '</a>' . ' | ';
}
return trim( $output, ' | ' );
$output = array_map(
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Do you think it'd be feasible to use the_tags() for rendering and just map the attributes?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

That echos the output, and we lose the ability to add more features in the future.

function ( $tag ) {
return '<a href="' .
get_tag_link( $tag->term_id ) .
'">' .
$tag->name .
'</a>';
},
$post_tags
);
$output = join(
$attributes['separator'],
$output
);
return ( isset( $attributes['beforeText'] )
? ( $attributes['beforeText'] . ' ' )
: ''
) .
$output .
( isset( $attributes['afterText'] )
? ( ' ' . $attributes['afterText'] )
: ''
);
}
}

Expand All @@ -32,6 +52,18 @@ function register_block_core_post_tags() {
register_block_type(
'core/post-tags',
array(
'attributes' => array(
'beforeText' => array(
'type' => 'string',
),
'separator' => array(
'type' => 'string',
'default' => ' | ',
),
'afterText' => array(
'type' => 'string',
),
),
'render_callback' => 'render_block_core_post_tags',
)
);
Expand Down