Create the `Products by Attribute` template #7660

albarin · 2022-11-11T09:48:37Z

The goal of this PR is to add a new Products by Attribute template.

Fixes #7647

Testing

Automated Tests

Changes in this PR are covered by Automated Tests.
- Unit tests
- E2E tests

User Facing Testing

Make sure you are using a blocks theme.
Go to the site editor and click on Browse all templates (or /wp-admin/site-editor.php?postType=wp_template).
Check that the Products by Attribute template shows on the list.
Click on it and make sure it shows the legacy grid block.
Edit the template and add a block on top of it and save.
Go to Products>Attribute (/wp-admin/edit.php?post_type=product&page=product_attributes).
Edit one of the attributes, check the Enable archives? checkbox, and save.
Go back to the attributes list and click Configure terms on the attribute you just edited it.
Click on View on one of the terms to view it in the frontend.
Make sure you see the edits you made on the Product by Attribute template.

WooCommerce Visibility

WooCommerce Core
Feature plugin
Experimental

Changelog

Add the Products by Attribute template

github-actions · 2022-11-11T09:50:29Z

The release ZIP for this PR is accessible via:

https://wcblocks.wpcomstaging.com/wp-content/uploads/woocommerce-gutenberg-products-block-7660.zip

github-actions · 2022-11-11T09:51:39Z

TypeScript Errors Report

Files with errors: 432
Total errors: 2079

⚠️ ⚠️ This PR introduces new TS errors on 2 files:

assets/js/atomic/blocks/product-elements/image/test/block.test.js

assets/js/data/payment/check-payment-methods.ts

github-actions · 2022-11-11T09:54:00Z

Size Change: -61 B (0%)

Total Size: 991 kB

Filename	Size	Change
`build/all-products-frontend.js`	26.4 kB	+1 B (0%)
`build/all-products.js`	33.5 kB	-11 B (0%)
`build/cart-blocks/cart-cross-sells-products-frontend.js`	4.67 kB	-12 B (0%)
`build/cart-frontend.js`	54.5 kB	+2 B (0%)
`build/cart.js`	46.3 kB	-13 B (0%)
`build/legacy-template.js`	2.85 kB	+13 B (0%)
`build/product-image-frontend.js`	1.9 kB	-13 B (-1%)
`build/product-image.js`	3.92 kB	-13 B (0%)
`build/single-product-frontend.js`	32.2 kB	+1 B (0%)
`build/wc-blocks-data.js`	18.5 kB	-16 B (0%)

ℹ️ View Unchanged

Filename	Size
`build/active-filters-frontend.js`	7.74 kB
`build/active-filters-wrapper-frontend.js`	6.02 kB
`build/active-filters.js`	7.32 kB
`build/all-reviews.js`	7.79 kB
`build/attribute-filter-frontend.js`	22.6 kB
`build/attribute-filter-wrapper-frontend.js`	7.13 kB
`build/attribute-filter.js`	12.2 kB
`build/blocks-checkout.js`	18.5 kB
`build/cart-blocks/cart-accepted-payment-methods-frontend.js`	1.37 kB
`build/cart-blocks/cart-cross-sells-frontend.js`	253 B
`build/cart-blocks/cart-cross-sells-products--product-add-to-cart-frontend.js`	5.47 kB
`build/cart-blocks/cart-express-payment--checkout-blocks/express-payment-frontend.js`	5.01 kB
`build/cart-blocks/cart-express-payment-frontend.js`	764 B
`build/cart-blocks/cart-items-frontend.js`	298 B
`build/cart-blocks/cart-line-items--mini-cart-contents-block/products-table-frontend.js`	5.29 kB
`build/cart-blocks/cart-line-items-frontend.js`	1.07 kB
`build/cart-blocks/cart-order-summary-frontend.js`	1.11 kB
`build/cart-blocks/cart-totals-frontend.js`	320 B
`build/cart-blocks/empty-cart-frontend.js`	346 B
`build/cart-blocks/filled-cart-frontend.js`	783 B
`build/cart-blocks/order-summary-coupon-form-frontend.js`	1.73 kB
`build/cart-blocks/order-summary-discount-frontend.js`	2.16 kB
`build/cart-blocks/order-summary-fee-frontend.js`	273 B
`build/cart-blocks/order-summary-heading-frontend.js`	455 B
`build/cart-blocks/order-summary-shipping--checkout-blocks/order-summary-shipping-frontend.js`	5.66 kB
`build/cart-blocks/order-summary-shipping-frontend.js`	428 B
`build/cart-blocks/order-summary-subtotal-frontend.js`	273 B
`build/cart-blocks/order-summary-taxes-frontend.js`	433 B
`build/cart-blocks/proceed-to-checkout-frontend.js`	1.19 kB
`build/checkout-blocks/actions-frontend.js`	1.77 kB
`build/checkout-blocks/billing-address--checkout-blocks/shipping-address-frontend.js`	3.9 kB
`build/checkout-blocks/billing-address-frontend.js`	952 B
`build/checkout-blocks/contact-information-frontend.js`	1.77 kB
`build/checkout-blocks/express-payment-frontend.js`	1.12 kB
`build/checkout-blocks/fields-frontend.js`	343 B
`build/checkout-blocks/order-note-frontend.js`	1.14 kB
`build/checkout-blocks/order-summary-cart-items-frontend.js`	3.67 kB
`build/checkout-blocks/order-summary-coupon-form-frontend.js`	1.89 kB
`build/checkout-blocks/order-summary-discount-frontend.js`	2.28 kB
`build/checkout-blocks/order-summary-fee-frontend.js`	275 B
`build/checkout-blocks/order-summary-frontend.js`	1.11 kB
`build/checkout-blocks/order-summary-shipping-frontend.js`	603 B
`build/checkout-blocks/order-summary-subtotal-frontend.js`	273 B
`build/checkout-blocks/order-summary-taxes-frontend.js`	433 B
`build/checkout-blocks/payment-frontend.js`	7.77 kB
`build/checkout-blocks/shipping-address-frontend.js`	1.06 kB
`build/checkout-blocks/shipping-methods-frontend.js`	4.89 kB
`build/checkout-blocks/terms-frontend.js`	1.63 kB
`build/checkout-blocks/totals-frontend.js`	323 B
`build/checkout-frontend.js`	56.6 kB
`build/checkout.js`	40.3 kB
`build/featured-category.js`	13.2 kB
`build/featured-product.js`	13.4 kB
`build/filter-wrapper-frontend.js`	13.8 kB
`build/filter-wrapper.js`	2.41 kB
`build/general-style-rtl.css`	1.29 kB
`build/general-style.css`	1.29 kB
`build/handpicked-products.js`	7.29 kB
`build/mini-cart-component-frontend.js`	20 kB
`build/mini-cart-contents-block/empty-cart-frontend.js`	366 B
`build/mini-cart-contents-block/filled-cart-frontend.js`	230 B
`build/mini-cart-contents-block/footer-frontend.js`	2.97 kB
`build/mini-cart-contents-block/items-frontend.js`	237 B
`build/mini-cart-contents-block/products-table-frontend.js`	591 B
`build/mini-cart-contents-block/shopping-button-frontend.js`	288 B
`build/mini-cart-contents-block/title-frontend.js`	368 B
`build/mini-cart-contents.js`	17.1 kB
`build/mini-cart-frontend.js`	1.77 kB
`build/mini-cart.js`	4.29 kB
`build/price-filter-frontend.js`	13.6 kB
`build/price-filter-wrapper-frontend.js`	7.01 kB
`build/price-filter.js`	8.37 kB
`build/price-format.js`	1.19 kB
`build/product-add-to-cart--product-button--product-category-list--product-image--product-price--product-r--a0326d00.js`	226 B
`build/product-add-to-cart--product-button--product-image--product-rating--product-title.js`	151 B
`build/product-add-to-cart-frontend.js`	1.25 kB
`build/product-add-to-cart.js`	8.36 kB
`build/product-best-sellers.js`	7.62 kB
`build/product-button--product-category-list--product-image--product-price--product-rating--product-sale-b--e17c7c01.js`	431 B
`build/product-button--product-image--product-rating--product-sale-badge--product-title.js`	302 B
`build/product-button-frontend.js`	1.89 kB
`build/product-button.js`	3.82 kB
`build/product-categories.js`	2.36 kB
`build/product-category-list-frontend.js`	884 B
`build/product-category-list.js`	502 B
`build/product-category.js`	8.62 kB
`build/product-new.js`	7.63 kB
`build/product-on-sale.js`	7.95 kB
`build/product-price-frontend.js`	1.92 kB
`build/product-price.js`	1.53 kB
`build/product-query.js`	2.89 kB
`build/product-rating-frontend.js`	1.2 kB
`build/product-rating.js`	787 B
`build/product-sale-badge-frontend.js`	1.15 kB
`build/product-sale-badge.js`	812 B
`build/product-search.js`	2.62 kB
`build/product-sku-frontend.js`	377 B
`build/product-sku.js`	376 B
`build/product-stock-indicator-frontend.js`	1.01 kB
`build/product-stock-indicator.js`	646 B
`build/product-summary-frontend.js`	1.29 kB
`build/product-summary.js`	921 B
`build/product-tag-list-frontend.js`	878 B
`build/product-tag-list.js`	498 B
`build/product-tag.js`	8 kB
`build/product-title-frontend.js`	1.33 kB
`build/product-title.js`	3.3 kB
`build/product-top-rated.js`	7.86 kB
`build/products-by-attribute.js`	8.54 kB
`build/rating-filter-frontend.js`	7.16 kB
`build/rating-filter-wrapper-frontend.js`	5.41 kB
`build/rating-filter.js`	5.79 kB
`build/reviews-by-category.js`	11.2 kB
`build/reviews-by-product.js`	12.3 kB
`build/reviews-frontend.js`	7.01 kB
`build/single-product.js`	10 kB
`build/stock-filter-frontend.js`	7.78 kB
`build/stock-filter-wrapper-frontend.js`	6.03 kB
`build/stock-filter.js`	6.7 kB
`build/vendors--attribute-filter-wrapper--mini-cart-contents-block/footer-frontend.js`	6.86 kB
`build/vendors--attribute-filter-wrapper-frontend.js`	8.22 kB
`build/vendors--cart-blocks/cart-cross-sells-products--cart-blocks/cart-line-items--cart-blocks/cart-order--671ca56f-frontend.js`	5.26 kB
`build/vendors--cart-blocks/cart-cross-sells-products--cart-blocks/order-summary-shipping--checkout-blocks--18f9376a-frontend.js`	19.1 kB
`build/vendors--cart-blocks/cart-cross-sells-products--product-add-to-cart-frontend.js`	7.53 kB
`build/vendors--cart-blocks/cart-line-items--checkout-blocks/order-summary-cart-items--mini-cart-contents---233ab542-frontend.js`	3.14 kB
`build/vendors--cart-blocks/order-summary-shipping--checkout-blocks/billing-address--checkout-blocks/order--5b8feb0b-frontend.js`	4.85 kB
`build/wc-blocks-editor-style-rtl.css`	5.24 kB
`build/wc-blocks-editor-style.css`	5.24 kB
`build/wc-blocks-google-analytics.js`	1.56 kB
`build/wc-blocks-middleware.js`	931 B
`build/wc-blocks-registry.js`	2.92 kB
`build/wc-blocks-shared-context.js`	1.51 kB
`build/wc-blocks-shared-hocs.js`	1.72 kB
`build/wc-blocks-style-rtl.css`	24.2 kB
`build/wc-blocks-style.css`	24.2 kB
`build/wc-blocks-vendors-style-rtl.css`	1.95 kB
`build/wc-blocks-vendors-style.css`	1.95 kB
`build/wc-blocks-vendors.js`	62.4 kB
`build/wc-blocks.js`	2.63 kB
`build/wc-payment-method-bacs.js`	816 B
`build/wc-payment-method-cheque.js`	811 B
`build/wc-payment-method-cod.js`	909 B
`build/wc-payment-method-paypal.js`	837 B
`build/wc-settings.js`	2.6 kB

_{compressed-size-action}

github-actions · 2022-11-11T09:55:05Z

Script Dependencies Report

There is no changed script dependency between this branch and trunk.

This comment was automatically generated by the ./github/compare-assets action.

albarin · 2022-11-14T13:01:35Z

Hey, I'm mentioning here @gigitux, @Aljullu, and @nerrad since you were involved in the initial conversations around adding this new template and maybe can provide some good feedback. Thanks 🙌

gigitux

I tested the PR and it works correctly! Great job!
Instead of using taxonomy-pa, I think that it is more clear if we use a name like taxonomy-product_attribute. What do you think?

src/Templates/ProductAttributeTemplate.php

src/BlockTypes/ClassicTemplate.php

src/BlockTemplatesController.php

src/Utils/BlockTemplateUtils.php

gigitux

Thanks for updating the PR! Great work! 💪
LGTM!

thealexandrelara

I reviewed and tested it and everything looks great. Great work! LGTM!

albarin force-pushed the add/7647-products-by-attr-template branch from e2bbdc4 to b3cb445 Compare November 11, 2022 09:51

albarin force-pushed the add/7647-products-by-attr-template branch 5 times, most recently from b4ff3fd to 9ff0c72 Compare November 11, 2022 16:25

Create the Products by Attribute template

adecf91

albarin force-pushed the add/7647-products-by-attr-template branch from 9ff0c72 to adecf91 Compare November 11, 2022 16:52

albarin and others added 4 commits November 14, 2022 12:41

Merge branch 'trunk' into add/7647-products-by-attr-template

b7cc4b2

bot: update checkstyle.xml

4104718

Fix typo

f2735c8

Merge branch 'trunk' into add/7647-products-by-attr-template

fd01cf6

albarin marked this pull request as ready for review November 14, 2022 12:59

rubikuserbot requested review from a team and sunyatasattva and removed request for a team November 14, 2022 12:59

albarin requested a review from thealexandrelara November 14, 2022 12:59

gigitux suggested changes Nov 14, 2022

View reviewed changes

albarin added 2 commits November 14, 2022 15:22

Rename template to taxonomy-product_attribute

0b53e9e

Rename test template file

8cb2aea

albarin requested a review from gigitux November 14, 2022 14:26

gigitux approved these changes Nov 14, 2022

View reviewed changes

github-actions bot added this to the 9.0.0 milestone Nov 14, 2022

github-actions bot added the status: ready to merge label Nov 14, 2022

thealexandrelara approved these changes Nov 14, 2022

View reviewed changes

albarin and others added 5 commits November 15, 2022 09:27

Merge branch 'trunk' into add/7647-products-by-attr-template

167a679

Merge branch 'trunk' into add/7647-products-by-attr-template

5bb2adf

bot: update checkstyle.xml

e05f362

Merge branch 'trunk' into add/7647-products-by-attr-template

4700d49

Fix test enabling archives for shade attribute

4785f14

albarin added the focus: template Related to API powering block template functionality in the Site Editor label Nov 16, 2022

albarin merged commit b7e090a into trunk Nov 16, 2022

albarin deleted the add/7647-products-by-attr-template branch November 16, 2022 13:37

github-actions bot removed the status: ready to merge label Nov 16, 2022

albarin mentioned this pull request Nov 17, 2022

Add support for the Product by attribute template woocommerce/woocommerce#35617

Merged

8 tasks

danieldudzic added the type: enhancement The issue is a request for an enhancement. label Nov 21, 2022

senadir mentioned this pull request Dec 7, 2022

Update WooCommerce blocks package to 9.1.0 woocommerce/woocommerce#35876

Closed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Create the `Products by Attribute` template #7660

Create the `Products by Attribute` template #7660

Uh oh!

albarin commented Nov 11, 2022 •

edited

Loading

Uh oh!

github-actions bot commented Nov 11, 2022

Uh oh!

github-actions bot commented Nov 11, 2022 •

edited

Loading

Uh oh!

github-actions bot commented Nov 11, 2022 •

edited

Loading

Uh oh!

github-actions bot commented Nov 11, 2022 •

edited

Loading

Uh oh!

albarin commented Nov 14, 2022

Uh oh!

gigitux left a comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

gigitux left a comment

Uh oh!

thealexandrelara left a comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

5 participants

Create the Products by Attribute template #7660

Create the Products by Attribute template #7660

Uh oh!

Conversation

albarin commented Nov 11, 2022 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Testing

Automated Tests

User Facing Testing

WooCommerce Visibility

Changelog

Uh oh!

github-actions bot commented Nov 11, 2022

Uh oh!

github-actions bot commented Nov 11, 2022 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

TypeScript Errors Report

Uh oh!

github-actions bot commented Nov 11, 2022 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

github-actions bot commented Nov 11, 2022 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Script Dependencies Report

Uh oh!

albarin commented Nov 14, 2022

Uh oh!

gigitux left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

gigitux left a comment

Choose a reason for hiding this comment

Uh oh!

thealexandrelara left a comment

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

5 participants

Create the `Products by Attribute` template #7660

Create the `Products by Attribute` template #7660

albarin commented Nov 11, 2022 •

edited

Loading

github-actions bot commented Nov 11, 2022 •

edited

Loading

github-actions bot commented Nov 11, 2022 •

edited

Loading

github-actions bot commented Nov 11, 2022 •

edited

Loading