Should we provide multi-query comments loops? #36642

cbravobernal · 2021-11-19T10:55:47Z

Summary of the question

If we take a look at the Post Query Loop. It is ready so the user can have multiple queries on the same page.

gutenberg/packages/block-library/src/query/edit/index.js

Lines 81 to 86 in 4d3fb72

    
           useEffect( () => { 
        
           	if ( ! queryId ) { 
        
           		__unstableMarkNextChangeAsNotPersistent(); 
        
           		setAttributes( { queryId: instanceId } ); 
        
           	} 
        
           }, [ queryId, instanceId ] );

Then in PHP we read that queryId and get the info to be able to make different queries on the same page.

gutenberg/packages/block-library/src/post-template/index.php

Lines 18 to 23 in 2ecd5a0

    
           $page_key = isset( $block->context['queryId'] ) ? 'query-' . $block->context['queryId'] . '-page' : 'query-page'; 
        
           $page     = empty( $_GET[ $page_key ] ) ? 1 : (int) $_GET[ $page_key ]; 
        
           $query_args = build_query_vars_from_query_block( $block, $page ); 
        
           // Override the custom query with the global query if needed. 
        
           $use_global_query = ( isset( $block->context['query']['inherit'] ) && $block->context['query']['inherit'] );

This feature is completely fine for posts. For example, in a blog, you may want to create a couple of "Posts per category" blocks. But you can also add pagination to them. This pagination is working also individually, and, sometimes, can create weird results.

For example, if you create a query loop and set the layout as two columns, you can add a different pagination per column (maybe we have to fix that in another PR).

The question is:

Should we provide multi-query comments loops? Is it a nice feature to have different comment loops on the same page?

Depending on this discussion result, the code for the comment loop and pagination can be more or less complex.

luisherranz · 2021-11-19T12:40:38Z

If I'm not mistaken, WordPress comment pagination is using this URL structure right now:

https://mysite.com/post/
https://mysite.com/post/comment-page-2/
https://mysite.com/post/comment-page-3/
...

So, if we want to make this backward compatible with the existing URL structure, we need to use the /comment-page-x/ path.

I guess we have a previous example of this. The WordPress archives, which follow this URL structure:

https://mysite.com/category/something/
https://mysite.com/category/something/page/2/
https://mysite.com/category/something/page/3/
...

I didn't look at the code, but I did a quick test with a block theme, and it seems that in archives, the Query Loop block is following that structure:

https://luisherranztest1.blog/category/suscipit-nobis-itaque-quos-dolorem/page/2/

But if I add a Query Loop block to a page, it uses the queryId pagination:

https://luisherranztest1.blog/page-with-query-loop/?query-7-page=2

So I guess it may be using the old WordPress URL structure when the query is inherited and the new queryId when it's not.

That would mean you can use two query loops in an archive, one inherited and one custom, and the URLs would be backward compatible 🙂

@c4rl0sbr4v0, would you mind taking a look at the code of the Query Loop and/or related issues to confirm that it works that way? If so, I think it would make sense to implement it that way.

DAreRodz · 2021-11-19T13:00:18Z

If I'm not mistaken, WordPress comment pagination is using this URL structure right now:

https://mysite.com/post/

https://mysite.com/post/comment-page-2/

https://mysite.com/post/comment-page-3/

...

Just a quick note. I think (not sure tho) that the /post/comment-page-1/ URL would also work, and that /post/ (the default one) would point to either the first page (/post/comment-page-1/) or the last one (/post/comment-page-n/), depending on the order configured in the comments settings.

Can anybody check that?

cbravobernal · 2021-11-19T15:41:57Z

So, if we want to make this backward compatible with the existing URL structure...

It seems that it gets the comment page from a query variable inside the GET petition. So it doesn't mind the URL permalink you are using. It works the same with /comment-page-3/ or ?cpage=3.

would you mind taking a look at the code of the Query Loop

Sure, what they do is reset the query, so the main query does not interfere with the query loop. They use offset in order to set the first comment to show, instead of pagination variable:

gutenberg/packages/block-library/src/post-template/index.php

Lines 27 to 29 in 2ecd5a0

    
           // Unset `offset` because if is set, $wp_query overrides/ignores the paged parameter and breaks pagination. 
        
           unset( $query_args['offset'] ); 
        
           $query_args = wp_parse_args( $wp_query->query_vars, $query_args );

And after that, it creates a new one with the arguments got from the block.

Query args:

gutenberg/packages/block-library/src/post-template/index.php

Line 21 in 2ecd5a0

$query_args = build_query_vars_from_query_block( $block, $page );

Query created:

gutenberg/packages/block-library/src/post-template/index.php

Line 37 in 2ecd5a0

$query = new WP_Query( $query_args );

After rendering the comment blocks, it resets in order to keep the first query working on the rest of the page/site:

gutenberg/packages/block-library/src/post-template/index.php

Line 68 in 2ecd5a0

wp_reset_postdata();

For the query pagination links, what they do is to add a query argument into the HTML tag href=url_with_new_query_arg. This is coded here:

Create the page key:

gutenberg/packages/block-library/src/query-pagination-next/index.php

Line 18 in 2ecd5a0

    
           $page_key = isset( $block->context['queryId'] ) ? 'query-' . $block->context['queryId'] . '-page' : 'query-page';

Add it as query arg:

gutenberg/packages/block-library/src/query-pagination-next/index.php

Line 50 in 2ecd5a0

esc_url( add_query_arg( $page_key, $page + 1 ) ),

I hope this context can help us take a direction ☺️

luisherranz · 2021-11-23T17:22:32Z

Sure, what they do is reset the query, so the main query does not interfere with the query loop

I meant how does it work when the Query Loop query is inherited, because that's what we should do when the Post ID of the Comment Loop block is inherited as well.

luisherranz · 2021-11-23T17:29:06Z

Does this make sense?

Query Loop block
- URLs of inhertied queries
- URLs of non-inherited queries
Comments Loop block
- URLs of inhertied post id
- URLs of non-inherited post id

cbravobernal · 2021-11-24T13:13:14Z

I meant how does it work when the Query Loop query is inherited because that's what we should do when the Post ID of the Comment Loop block is inherited as well.

When the Query Loop is inherited, if you mean when you are on a post or a page, the post id is got from the global object $post;

In case you have a Query Loop block, you assign a queryId in order to be able to create new queries and not be attached to that $post.

I'm not sure if I'm answering your questions 😅, we could consider creating some looms or videos if the communication feels unclear.

Does this make sense?

Maybe for the comments would be better to call it with a query word inside, in order to keep consistency with the query one. Maybe?

Right now in we have page and cpage and page as query vars. So maybe other option could be:

What do you think about it?

DAreRodz · 2021-11-24T14:10:02Z

Uhm. 🤔 As far as I understood, the query ID would be a way to identify a specific query block, right? So, I would prefer something like cquery-X or comments-query-X, or even comments, as the name of the block is Comments Query Loop.

cpage is the query var that WordPress already uses for comment pagination, but, for me, it would only make sense in the context of a given post. Something like post-X-cpage-2. The problem with this approach is that you may want to have different queries for the same post ID but different pagination/options/etc., so using the post ID would not work in that case.

I would go for any of these options

But the one I like the most is

https://mysite.com/some-post/?comments-X-page-2

luisherranz · 2021-12-06T12:20:24Z

I forgot that the post id could be inherited from either the post/page or a parent Query Loop block and those cases should be treated differently.

Comments Loop block
- Post ID inherited from post/page
- Post ID added in the block settings (not inherited)
- Post ID inherited from a parent Query Loop block. I guess we have two options here:
  - Build the queries only with the comments reference
  - Include the Query Loop query reference as well

Additional questions:

What is the behavior when there's no parent context (post/page or Query Loop) and no selected Post ID? Show the Latest Comments?
Is there any other source of post ids?

DAreRodz · 2022-02-02T14:09:16Z

After some analysis, and considering the last cases @luisherranz added in the previous comment, this is how I think adding several comment loop blocks with different options should work.

Let's first consider two types of URLs:

“Pretty” and plain permalinks: what WP uses right now.
- https://mysite.com/some-post/comment-page-2/
- https://mysite.com/some-post/?cpage=2
Block ID query var: would identify a specific comment loop block rendered in the page.
- https://mysite.com/some-post/?comments-[ID]-page-2

The criteria for whether one or the other type of URLs should be used would be as follows:

All the comment loop blocks which their post_id (either from context or attribute) coincide with the global post_id AND are not overwriting the WP discussion settings with custom settings (i.e., are like the usual WP comment loop), should use “Pretty” and plain permalinks.
Any other case (e.g., custom per_page attribute, a different post_id, etc.) should use Block ID query var.

This would cover pretty much all the cases, and would have backwards compatibility as well, keeping the current behavior of WordPress and allowing different comment loops pagination at the same time.

This diagram shows all different cases:

Excalidraw link

Include the Query Loop query reference as well

https://myste.com/some-page

https://myste.com/some-page?query-X-comments-Y-page=2

https://myste.com/some-page?query-X-comments-Y-page=3

From my point of view, it would not be necessary to include both the query ID and the comment query ID, with the second one would be enough. 🙂

What is the behavior when there's no parent context (post/page or Query Loop) and no selected Post ID? Show the Latest Comments?

I don't know if we have agreed in other issue, but pretty much yes. 👍

Is there any other source of post ids?

There is no other source of post IDs AFAIK.

Alright, @luisherranz @SantosGuillamot @c4rl0sbr4v0, let me know what you think. 😊

luisherranz · 2022-02-03T11:34:10Z

LGTM! 🙂

cbravobernal · 2022-02-03T13:19:59Z

Looks great. Also, it will be better for the UX as they will be able to add as many comments query loops as they want.

cbravobernal · 2024-01-31T23:23:02Z

Closed as it has been paused during a long time. Feel free to reopen if needed.

cbravobernal assigned luisherranz, DAreRodz and cbravobernal Nov 19, 2021

luisherranz assigned SantosGuillamot and unassigned luisherranz Nov 19, 2021

SantosGuillamot mentioned this issue Nov 24, 2021

Comments Loop Block: Tracking issue #34994

Closed

13 tasks

cbravobernal mentioned this issue Dec 3, 2021

Block Library: Add the Comments Pagination Next block #36562

Merged

11 tasks

gziolo mentioned this issue Dec 8, 2021

Comments Query Loop: Improve context handling in inner blocks #37196

Merged

7 tasks

cbravobernal closed this as completed Jan 31, 2024

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Should we provide multi-query comments loops? #36642

Should we provide multi-query comments loops? #36642

cbravobernal commented Nov 19, 2021 •

edited by DAreRodz

Loading

luisherranz commented Nov 19, 2021

DAreRodz commented Nov 19, 2021

cbravobernal commented Nov 19, 2021

luisherranz commented Nov 23, 2021

luisherranz commented Nov 23, 2021

cbravobernal commented Nov 24, 2021

DAreRodz commented Nov 24, 2021 •

edited

Loading

luisherranz commented Dec 6, 2021 •

edited

Loading

DAreRodz commented Feb 2, 2022

luisherranz commented Feb 3, 2022

cbravobernal commented Feb 3, 2022

cbravobernal commented Jan 31, 2024

Should we provide multi-query comments loops? #36642

Should we provide multi-query comments loops? #36642

Comments

cbravobernal commented Nov 19, 2021 • edited by DAreRodz Loading

Summary of the question

luisherranz commented Nov 19, 2021

DAreRodz commented Nov 19, 2021

cbravobernal commented Nov 19, 2021

luisherranz commented Nov 23, 2021

luisherranz commented Nov 23, 2021

cbravobernal commented Nov 24, 2021

DAreRodz commented Nov 24, 2021 • edited Loading

luisherranz commented Dec 6, 2021 • edited Loading

DAreRodz commented Feb 2, 2022

luisherranz commented Feb 3, 2022

cbravobernal commented Feb 3, 2022

cbravobernal commented Jan 31, 2024

cbravobernal commented Nov 19, 2021 •

edited by DAreRodz

Loading

DAreRodz commented Nov 24, 2021 •

edited

Loading

luisherranz commented Dec 6, 2021 •

edited

Loading