From 698d39d42984eb62f08b0789b09626c0ec9a7912 Mon Sep 17 00:00:00 2001 From: Aaron Robertshaw <60436221+aaronrobertshaw@users.noreply.github.com> Date: Tue, 29 Nov 2022 17:09:46 +0800 Subject: [PATCH] Query: Remove color block supports --- docs/reference-guides/core-blocks.md | 4 +- .../src/post-template/block.json | 8 + packages/block-library/src/query/block.json | 8 - .../block-library/src/query/deprecated.js | 150 +++++++++++++++++ .../blocks/core__query__deprecated-3.html | 23 +++ .../blocks/core__query__deprecated-3.json | 151 ++++++++++++++++++ .../core__query__deprecated-3.parsed.json | 128 +++++++++++++++ .../core__query__deprecated-3.serialized.html | 23 +++ 8 files changed, 485 insertions(+), 10 deletions(-) create mode 100644 test/integration/fixtures/blocks/core__query__deprecated-3.html create mode 100644 test/integration/fixtures/blocks/core__query__deprecated-3.json create mode 100644 test/integration/fixtures/blocks/core__query__deprecated-3.parsed.json create mode 100644 test/integration/fixtures/blocks/core__query__deprecated-3.serialized.html diff --git a/docs/reference-guides/core-blocks.md b/docs/reference-guides/core-blocks.md index e3601a1f0a5093..d2d66fc0d12de3 100644 --- a/docs/reference-guides/core-blocks.md +++ b/docs/reference-guides/core-blocks.md @@ -572,7 +572,7 @@ Contains the block elements used to render a post, like the title, date, feature - **Name:** core/post-template - **Category:** theme -- **Supports:** align, typography (fontSize, lineHeight), ~~html~~, ~~reusable~~ +- **Supports:** align, color (background, gradients, link, text), typography (fontSize, lineHeight), ~~html~~, ~~reusable~~ - **Attributes:** ## Post Terms @@ -617,7 +617,7 @@ An advanced block that allows displaying post types based on different query par - **Name:** core/query - **Category:** theme -- **Supports:** align (full, wide), color (background, gradients, link, text), ~~html~~ +- **Supports:** align (full, wide), ~~html~~ - **Attributes:** displayLayout, namespace, query, queryId, tagName ## No results diff --git a/packages/block-library/src/post-template/block.json b/packages/block-library/src/post-template/block.json index 380b6d55f71fad..bc9910b47d1dc5 100644 --- a/packages/block-library/src/post-template/block.json +++ b/packages/block-library/src/post-template/block.json @@ -22,6 +22,14 @@ "__experimentalLayout": { "allowEditing": false }, + "color": { + "gradients": true, + "link": true, + "__experimentalDefaultControls": { + "background": true, + "text": true + } + }, "typography": { "fontSize": true, "lineHeight": true, diff --git a/packages/block-library/src/query/block.json b/packages/block-library/src/query/block.json index cd09e22ee57f75..1974761962ec91 100644 --- a/packages/block-library/src/query/block.json +++ b/packages/block-library/src/query/block.json @@ -50,14 +50,6 @@ "supports": { "align": [ "wide", "full" ], "html": false, - "color": { - "gradients": true, - "link": true, - "__experimentalDefaultControls": { - "background": true, - "text": true - } - }, "__experimentalLayout": true }, "editorStyle": "wp-block-query-editor" diff --git a/packages/block-library/src/query/deprecated.js b/packages/block-library/src/query/deprecated.js index 42ac3dc4f1c49d..fae25b485ab974 100644 --- a/packages/block-library/src/query/deprecated.js +++ b/packages/block-library/src/query/deprecated.js @@ -1,12 +1,18 @@ /** * WordPress dependencies */ +import { createBlock } from '@wordpress/blocks'; import { InnerBlocks, useInnerBlocksProps, useBlockProps, } from '@wordpress/block-editor'; +/** + * Internal dependencies + */ +import cleanEmptyObject from '../utils/clean-empty-object'; + const migrateToTaxQuery = ( attributes ) => { const { query } = attributes; const { categoryIds, tagIds, ...newQuery } = query; @@ -25,7 +31,151 @@ const migrateToTaxQuery = ( attributes ) => { }; }; +const colorSupportedInnerBlocks = [ + 'core/post-template', + 'core/query-pagination', + 'core/query-no-results', +]; + const deprecated = [ + // Version with color support prior to moving it to the PostTemplate block. + { + attributes: { + queryId: { + type: 'number', + }, + query: { + type: 'object', + default: { + perPage: null, + pages: 0, + offset: 0, + postType: 'post', + order: 'desc', + orderBy: 'date', + author: '', + search: '', + exclude: [], + sticky: '', + inherit: true, + taxQuery: null, + parents: [], + }, + }, + tagName: { + type: 'string', + default: 'div', + }, + displayLayout: { + type: 'object', + default: { + type: 'list', + }, + }, + namespace: { + type: 'string', + }, + }, + supports: { + align: [ 'wide', 'full' ], + html: false, + color: { + gradients: true, + link: true, + __experimentalDefaultControls: { + background: true, + text: true, + }, + }, + __experimentalLayout: true, + }, + isEligible( attributes ) { + const { style, backgroundColor, gradient, textColor } = attributes; + return ( + backgroundColor || + gradient || + textColor || + style?.color || + style?.elements?.link + ); + }, + migrate: ( attributes, innerBlocks ) => { + // Remove color style attributes from the Query block. + const { + style, + backgroundColor, + gradient, + textColor, + ...newAttributes + } = attributes; + + const hasColorStyles = + backgroundColor || + gradient || + textColor || + style?.color || + style?.elements?.link; + + // If the query block doesn't currently have any color styles, + // nothing needs migrating. + if ( ! hasColorStyles ) { + return [ attributes, innerBlocks ]; + } + + if ( style ) { + newAttributes.style = cleanEmptyObject( { + ...style, + color: undefined, + elements: { + ...style.elements, + link: undefined, + }, + } ); + } + + // Apply the color styles and attributes to the inner PostTemplate, + // Query Pagination, and Query No Results blocks. + const updatedInnerBlocks = innerBlocks.map( ( innerBlock ) => { + if ( ! colorSupportedInnerBlocks.includes( innerBlock.name ) ) { + return innerBlock; + } + + const hasStyles = + style?.color || + style?.elements?.link || + innerBlock.attributes.style; + + const newStyles = hasStyles + ? cleanEmptyObject( { + ...innerBlock.attributes.style, + color: style?.color, + elements: style?.elements?.link + ? { link: style?.elements?.link } + : undefined, + } ) + : undefined; + + return createBlock( + innerBlock.name, + { + ...innerBlock.attributes, + backgroundColor, + gradient, + textColor, + style: newStyles, + }, + innerBlock.innerBlocks + ); + } ); + + return [ newAttributes, updatedInnerBlocks ]; + }, + save( { attributes: { tagName: Tag = 'div' } } ) { + const blockProps = useBlockProps.save(); + const innerBlocksProps = useInnerBlocksProps.save( blockProps ); + return ; + }, + }, // Version with `categoryIds and tagIds`. { attributes: { diff --git a/test/integration/fixtures/blocks/core__query__deprecated-3.html b/test/integration/fixtures/blocks/core__query__deprecated-3.html new file mode 100644 index 00000000000000..9da20c78184e2a --- /dev/null +++ b/test/integration/fixtures/blocks/core__query__deprecated-3.html @@ -0,0 +1,23 @@ + + + \ No newline at end of file diff --git a/test/integration/fixtures/blocks/core__query__deprecated-3.json b/test/integration/fixtures/blocks/core__query__deprecated-3.json new file mode 100644 index 00000000000000..dedceb745f778a --- /dev/null +++ b/test/integration/fixtures/blocks/core__query__deprecated-3.json @@ -0,0 +1,151 @@ +[ + { + "name": "core/query", + "isValid": true, + "attributes": { + "queryId": 3, + "query": { + "perPage": 3, + "pages": 0, + "offset": 0, + "postType": "post", + "order": "desc", + "orderBy": "date", + "author": "", + "search": "", + "exclude": [], + "sticky": "", + "inherit": false + }, + "tagName": "div", + "displayLayout": { + "type": "flex", + "columns": 3 + }, + "align": "wide" + }, + "innerBlocks": [ + { + "name": "core/post-template", + "isValid": true, + "attributes": { + "textColor": "pale-cyan-blue", + "fontSize": "large", + "style": { + "color": { + "background": "#284d5f" + }, + "elements": { + "link": { + "color": { + "text": "var:preset|color|luminous-vivid-amber" + } + } + } + } + }, + "innerBlocks": [ + { + "name": "core/post-title", + "isValid": true, + "attributes": { + "level": 2, + "isLink": false, + "rel": "", + "linkTarget": "_self" + }, + "innerBlocks": [] + }, + { + "name": "core/post-date", + "isValid": true, + "attributes": { + "isLink": false, + "displayType": "date" + }, + "innerBlocks": [] + }, + { + "name": "core/post-excerpt", + "isValid": true, + "attributes": { + "showMoreOnNewLine": true + }, + "innerBlocks": [] + } + ] + }, + { + "name": "core/query-pagination", + "isValid": true, + "attributes": { + "paginationArrow": "none", + "textColor": "pale-cyan-blue", + "style": { + "color": { + "background": "#284d5f" + }, + "elements": { + "link": { + "color": { + "text": "var:preset|color|luminous-vivid-amber" + } + } + } + } + }, + "innerBlocks": [ + { + "name": "core/query-pagination-previous", + "isValid": true, + "attributes": {}, + "innerBlocks": [] + }, + { + "name": "core/query-pagination-numbers", + "isValid": true, + "attributes": {}, + "innerBlocks": [] + }, + { + "name": "core/query-pagination-next", + "isValid": true, + "attributes": {}, + "innerBlocks": [] + } + ] + }, + { + "name": "core/query-no-results", + "isValid": true, + "attributes": { + "textColor": "pale-cyan-blue", + "style": { + "color": { + "background": "#284d5f" + }, + "elements": { + "link": { + "color": { + "text": "var:preset|color|luminous-vivid-amber" + } + } + } + } + }, + "innerBlocks": [ + { + "name": "core/paragraph", + "isValid": true, + "attributes": { + "content": "No results found.", + "dropCap": false, + "placeholder": "Add text or blocks that will display when a query returns no results." + }, + "innerBlocks": [] + } + ] + } + ] + } +] diff --git a/test/integration/fixtures/blocks/core__query__deprecated-3.parsed.json b/test/integration/fixtures/blocks/core__query__deprecated-3.parsed.json new file mode 100644 index 00000000000000..a26e573bac314b --- /dev/null +++ b/test/integration/fixtures/blocks/core__query__deprecated-3.parsed.json @@ -0,0 +1,128 @@ +[ + { + "blockName": "core/query", + "attrs": { + "queryId": 3, + "query": { + "perPage": 3, + "pages": 0, + "offset": 0, + "postType": "post", + "order": "desc", + "orderBy": "date", + "author": "", + "search": "", + "exclude": [], + "sticky": "", + "inherit": false + }, + "displayLayout": { + "type": "flex", + "columns": 3 + }, + "align": "wide", + "style": { + "color": { + "background": "#284d5f" + }, + "elements": { + "link": { + "color": { + "text": "var:preset|color|luminous-vivid-amber" + } + } + } + }, + "textColor": "pale-cyan-blue" + }, + "innerBlocks": [ + { + "blockName": "core/post-template", + "attrs": { + "fontSize": "large" + }, + "innerBlocks": [ + { + "blockName": "core/post-title", + "attrs": {}, + "innerBlocks": [], + "innerHTML": "", + "innerContent": [] + }, + { + "blockName": "core/post-date", + "attrs": {}, + "innerBlocks": [], + "innerHTML": "", + "innerContent": [] + }, + { + "blockName": "core/post-excerpt", + "attrs": {}, + "innerBlocks": [], + "innerHTML": "", + "innerContent": [] + } + ], + "innerHTML": "\n\n\n\n\n\n", + "innerContent": [ "\n", null, "\n\n", null, "\n\n", null, "\n" ] + }, + { + "blockName": "core/query-pagination", + "attrs": {}, + "innerBlocks": [ + { + "blockName": "core/query-pagination-previous", + "attrs": {}, + "innerBlocks": [], + "innerHTML": "", + "innerContent": [] + }, + { + "blockName": "core/query-pagination-numbers", + "attrs": {}, + "innerBlocks": [], + "innerHTML": "", + "innerContent": [] + }, + { + "blockName": "core/query-pagination-next", + "attrs": {}, + "innerBlocks": [], + "innerHTML": "", + "innerContent": [] + } + ], + "innerHTML": "\n\n\n\n\n\n", + "innerContent": [ "\n", null, "\n\n", null, "\n\n", null, "\n" ] + }, + { + "blockName": "core/query-no-results", + "attrs": {}, + "innerBlocks": [ + { + "blockName": "core/paragraph", + "attrs": { + "placeholder": "Add text or blocks that will display when a query returns no results." + }, + "innerBlocks": [], + "innerHTML": "\n

No results found.

\n", + "innerContent": [ "\n

No results found.

\n" ] + } + ], + "innerHTML": "\n\n", + "innerContent": [ "\n", null, "\n" ] + } + ], + "innerHTML": "\n
\n\n\n\n
\n", + "innerContent": [ + "\n
", + null, + "\n\n", + null, + "\n\n", + null, + "
\n" + ] + } +] diff --git a/test/integration/fixtures/blocks/core__query__deprecated-3.serialized.html b/test/integration/fixtures/blocks/core__query__deprecated-3.serialized.html new file mode 100644 index 00000000000000..f72d62ebcba585 --- /dev/null +++ b/test/integration/fixtures/blocks/core__query__deprecated-3.serialized.html @@ -0,0 +1,23 @@ + +
+ + + + + + + + + + + + + + + + + +

No results found.

+ +
+