Add Gutenberg v. 3.5+ support

[jomurgel]

Gutenberg v. 3.5+ breaks some blocks. Needs testing and updates for all blocks.

[efuller]

I started looking into this today.

I pushed a branch, but no commits as of yet: https://github.com/WebDevStudios/WDS-Blocks/tree/feature/%2364-support-for-3-7-0

I upgraded my local Gutenberg to 3.7.0.

The image and video background options do not work globally. There is no button being supplied to upload/set a file:

https://d.pr/i/Z1YHio

https://d.pr/i/98mBHY

Other than the issue above, the following blocks look to be in working order:

• Call to action
• Default
• Github Gist
• Hero

The rest of the blocks do not seems to show up for selection. This is most likely due to some console errors.

It looks like withAPIData has been deprecated. As best I can tell, we will now need to use withSelect. You can find documentation on it here:

https://wordpress.org/gutenberg/handbook/blocks/creating-dynamic-blocks/ https://github.com/WordPress/gutenberg/issues/7390 ( for more context )

[jomurgel]

Pushed branch: feature/#64-gutenberg-3.9.0-fixes which contains the following updates for 3.7+ (tested on 3.9).

All blocks (except Users Grid, notes below) work now as expected in 3.9. A few items deprecating in 4.0, but I think all of those potential issues are already resolved as of now.

Changed

• Removed all deprecated instances of withAPIData and replaced with new withSelect option for pulling posts. Resolves issue with related/recent posts block.

Added

• Added custom block category WDS Blocks and housed all blocks under that heading.

Updated

• General data validation updates.
• Cleans up some outputs.

Pending

The one block I can't get working at this moment is the user grid block. It uses the samepost-renderer.js partial that the Related Posts block uses, but I think the issue might be around the way we're pulling in the post object by user of the getEntityRecords function inside the select.core

• https://github.com/WordPress/gutenberg/blob/master/docs/data/data-core.md

This works fine with posts and there's another option for categories getEntityRecords( 'taxonomy', 'categories' ) for example, but it doesn't appear that anything I try for users eg. getEntityRecords( 'postType', 'users' ) returns anything. Since there's a lack of WP team documentation we just have to track down how this is being used and/or if it works with users at all.

There is a getUserQueryResults function which takes in state and queryID, but I wasn't able to get that working either, again potentially because of lack of documentation.

[jomurgel]

I reworked the withSelect to just make use of the apiFetch function to make the requests which work for both the users and posts. However, it's returning a promise to the selectedResults that I cannot resolve.

export default withSelect( ( select, props ) => {
    const { posts } = props;

    if ( undefined !== posts && '[]' !== posts ) {
        const selectedResultsQuery = JSON.parse( posts ).map( item => {
            return `include[]=${ item.id }&orderby=include`;
        } );

        if ( 0 < selectedResultsQuery.length ) {
            const selectedResultsFilter = selectedResultsQuery.join( '&' );

            const selectedResults = apiFetch( { path: `/wp/v2/${ props.attributes.queryFor }?_embed&${ selectedResultsFilter }&orderby=include` } )
                .then( ( response ) => {
                    if ( response ) {
                        return response;
                    }
                } )
                .catch( ( error ) => console.log( error ) /* eslint-disable-line */ );

            return {
                selectedResults: selectedResults,
            };
        }
    }
} )( PostRenderer );

I can't tell if it's a result of withSelect or and issue with my promise. Going to have to look into this more.