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

Query Loop Block: add variations for each post type #63380

Closed
wants to merge 3 commits into from
Closed

Query Loop Block: add variations for each post type #63380

Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
a3ea4f7
Query Loop Block: add keywords 'content' and 'blog'
ellatrix Jul 10, 2024
851c8de
Add variations
ellatrix Jul 10, 2024
1256f26
Fix keywords
ellatrix Jul 10, 2024
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
61 changes: 61 additions & 0 deletions packages/block-library/src/query/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,13 @@
* WordPress dependencies
*/
import { loop as icon } from '@wordpress/icons';
import { subscribe, select } from '@wordpress/data';
import { store as coreStore } from '@wordpress/core-data';
import {
registerBlockVariation,
unregisterBlockVariation,
} from '@wordpress/blocks';
import { __, sprintf } from '@wordpress/i18n';

/**
* Internal dependencies
Expand Down Expand Up @@ -64,4 +71,58 @@ export const settings = {
deprecated,
};

let previousPostTypes = [];
let haltSubscribing = false;

const keywords = {
post: [ 'blog' ],
};

subscribe( () => {
if ( haltSubscribing ) {
return;
}
const { getPostTypes } = select( coreStore );
const excludedPostTypes = [ 'attachment' ];
const filteredPostTypes = ( getPostTypes( { per_page: -1 } ) ?? [] ).filter(
( { viewable, slug } ) =>
viewable && ! excludedPostTypes.includes( slug )
);

for ( const postType of previousPostTypes ) {
if ( ! filteredPostTypes.includes( postType ) ) {
haltSubscribing = true;
unregisterBlockVariation( name, postType.slug );
haltSubscribing = false;
}
}

for ( const postType of filteredPostTypes ) {
if ( ! previousPostTypes.includes( postType ) ) {
haltSubscribing = true;
registerBlockVariation( name, {
name: postType.slug,
title: sprintf(
/* translators: %s: post type */
__( '%s Query Loop' ),
postType.labels.singular_name
),
attributes: {
query: {
postType: postType.slug,
Copy link
Contributor

Choose a reason for hiding this comment

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

I think this PR is going to create more issues that it solves, mainly because if you select a post type, you can't set the query to "inherit" true.

Copy link
Contributor

@ntsekouras ntsekouras Jul 11, 2024 •
edited
Loading

Choose a reason for hiding this comment

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

There are more nuances than inherit. An example is the isActive, existing Posts List variation, Pages List block etc.. Also I'm pretty confident that we used to need the other query attributed due to the way we handle object attributes in general..

Copy link
Member Author

Choose a reason for hiding this comment

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

Ok, then maybe we need to change the name depending on the main query that the current template is on.

Copy link
Member Author

Choose a reason for hiding this comment

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

Also, there's already a "Posts List" variation, we should probably remove that then

Copy link
Member Author

Choose a reason for hiding this comment

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

Removed it here: #63404

Copy link
Contributor

Choose a reason for hiding this comment

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

If we'd remove the Posts List variation, it should be done here and definitely not in it's own PR without having the alternative landed..

Please see the issue I linked above for some more nuances.
Additionally as @Mamaduka also mentions, this should be done server side and avoid all this complexity in the client and the subscription.

Copy link
Contributor

Choose a reason for hiding this comment

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

Also see #63353 description where I share some thoughts on this.

Copy link
Member Author

Choose a reason for hiding this comment

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

I was going to close this PR because of the issues? Not sure if it makes sense to add the variations at all, if it has to inherit the query, we should probably dynamically name it based on what the main query is.

},
},
keywords: [
postType.labels.name,
postType.labels.menu_name,
...( keywords[ postType.slug ] ?? [] ),
],
} );
haltSubscribing = false;
}
}

previousPostTypes = filteredPostTypes;
} );

export const init = () => initBlock( { name, metadata, settings } );
Loading