Add server side pagination for the main query (#26557)

[bobbingwide]

Description

In this change I have added some logic to enable the core/query-pagination block to apply to output displayed by
core/query-loop when run against the main query.

• I have only added the PHP logic to paginate the main query.
• It uses the core paginate_links function to do the hard work.
• The pagination for a selected query ( one specfied using core/query) has been put into a separate function, but remains untouched.

How has this been tested?

• Use Twenty Twenty-One Blocks theme
• Set Blog pages show at most 2 posts - depending on how many posts you've got
• Apply the fix developed for Query block: Add a way to inherit the global $query #25377
  ( PR query-loop block: Run the main query when queryId is not set (#25377) #26825 )
• Edit index.html to be:

<!-- wp:template-part {"slug":"header","theme":"twentytwentyone-blocks","align":"full", "tagName":"header","className":"site-header"} /-->

<!-- wp:query-pagination /-->
<!-- wp:query-loop -->
<!-- wp:post-title /-->
<!-- wp:post-excerpt {"showMoreOnNewLine": "false" } /-->
<!-- wp:post-tags /-->
<!-- wp:post-hierarchical-terms {"term":"category"} /-->
<!-- wp:post-date /-->

<!-- /wp:query-loop -->
<!-- wp:query-pagination /-->

<!-- wp:template-part {"slug":"footer","theme":"twentytwentyone-blocks","align":"full","tagName":"footer","className":"site-footer"} /-->

Edit style.css to add some basic styling of the list generated by paginate_links().

.wp-block-query-pagination {
	clear: both;
}

ul.page-numbers {
	display: block;
	padding-left: 0px;
}

.page-numbers li {
	display: inline-block;
}

.page-numbers li a {
	background-color: #f5f5f5;
	color: #333;
	cursor: pointer;
	display: inline-block;
	font-size: 16px;
	font-weight: 600;
	margin-bottom: 4px;
	text-decoration: none;
	padding: 8px 12px;
}

• Run similar tests as before: categories, tags, dates
• Check pagination is as expected.

Screenshots

Types of changes

Part fix for #26557

As with the PR for running the main query in core/query-loop, this will require documentation explaining how to use the block.
In order to implement the styling options specified in the requirements there will have to be a mapping between the attributes set in the block editor and the parameters to paginate_links.

It seems likely that the pagination for queries defined using core/query will need to be changed to use the paginate_links() function as well.

Checklist:

• My code is tested.
• My code follows the WordPress code style.
• My code follows the accessibility standards.
• My code has proper inline documentation.
• I've included developer documentation if appropriate.
• I've updated all React Native files affected by any refactorings/renamings in this PR.

[ntsekouras]

Hey @bobbingwide - I really appreciate that you're working on many Query/FSE related stuff! I personally haven't had found time yet to look in depth QueryPagination but I do believe this issue falls into the same umbrella with detecting global context in general and we should not handle it per block (Loop,Pagination).

As you already know a solution should ideally include handling the preview as well and this is the hard part.

This PR has got some traction and I think it could be the place to try to find a solution there, where we could then apply to QueryPagination as well: #27128

I know you've already commented there and is great to see many perspectives!

[bobbingwide]

It should be easy enough to change this solution to work with the latest thinking for core/query in #27128

[gziolo]

It's very useful to see how the same issue cascades in individual blocks. Thank you for exploring it.

I'm wondering if we should still patch those blocks temporarily to make them fully functional before we settle on the more general handling. I know that @aristath is looking into solving a similar issue for Query Loop block so it would be good to align.

[ntsekouras]

Thanks for your work here @bobbingwide! I'll have to close this PR though, as the block has changed completely direction by using innerBlocks here: #28125. Thanks again for exploring this!