Skip to content
This repository has been archived by the owner on Feb 23, 2024. It is now read-only.

Add abstract legacy template block #4991

Merged
merged 5 commits into from Oct 29, 2021
Merged

Conversation

tjcafferkey
Copy link
Contributor

@tjcafferkey tjcafferkey commented Oct 26, 2021

Fixes #4972

Description

This will add a block which given a template attribute will enable us to render a specific core PHP template.

Whats not included

This PR does not include any visual placeholder UI work, or individual template work which will be done as part of the PR for that specific template (e.g. single-product.php). This is purely an abstract block which will enable us to render those templates in future PRs

Testing

Manual Testing

How to test the changes in this Pull Request:

  1. Checkout and build this branch
  2. If this PR hasn't been merged, temporarily copy the changes to your dev environment. (If it has been merged, please ping so we can rebase this PR)
  3. Add the below snippet to woo-blocks/templates/block-templates/single-product.html
  4. Go to Site Editor and switch to the Single Product template. You should see the placeholder block there.
  5. Go to a product page on the frontend of your website and it should render "This method will render the single product template"
<!-- wp:template-part {"slug":"header","tagName":"header","className":"site-header","layout":{"inherit":true} /-->
<!-- wp:woocommerce/legacy-template { "template": "single-product" } /-->
<!-- wp:template-part {"slug":"footer","tagName":"footer","className":"site-footer","layout":{"inherit":true} /-->

Changelog

FSE: Add abstract block legacy template for core PHP templates.

@tjcafferkey tjcafferkey self-assigned this Oct 26, 2021
@tjcafferkey tjcafferkey added focus: FSE Work related to prepare WooCommerce for FSE. focus: template Related to API powering block template functionality in the Site Editor labels Oct 26, 2021
@rubikuserbot rubikuserbot requested review from a team and dinhtungdu and removed request for a team October 26, 2021 14:07
@github-actions
Copy link
Contributor

github-actions bot commented Oct 26, 2021

Size Change: +11.4 kB (+1%)

Total Size: 1.12 MB

Filename Size Change
build/active-filters-frontend.js 8.33 kB +8 B (0%)
build/active-filters.js 8.01 kB -2 B (0%)
build/all-products-frontend.js 23.3 kB -1 B (0%)
build/all-products.js 38 kB +167 B (0%)
build/all-reviews.js 9.57 kB -2 B (0%)
build/atomic-block-components/add-to-cart--atomic-block-components/button--atomic-block-components/image---a7e2bb9b.js 3.19 kB -2 B (0%)
build/atomic-block-components/add-to-cart--atomic-block-components/button.js 1.82 kB +1 B (0%)
build/atomic-block-components/add-to-cart--atomic-block-components/image--atomic-block-components/title.js 334 B +2 B (+1%)
build/atomic-block-components/add-to-cart-frontend.js 8.51 kB -2 B (0%)
build/atomic-block-components/button-frontend.js 1.74 kB -3 B (0%)
build/atomic-block-components/button.js 875 B +1 B (0%)
build/atomic-block-components/category-list-frontend.js 465 B +1 B (0%)
build/atomic-block-components/image-frontend.js 1.88 kB +1 B (0%)
build/atomic-block-components/price-frontend.js 2.14 kB -1 B (0%)
build/atomic-block-components/rating.js 565 B -1 B (0%)
build/atomic-block-components/sale-badge.js 869 B +1 B (0%)
build/atomic-block-components/sku-frontend.js 391 B -1 B (0%)
build/atomic-block-components/sku.js 392 B -1 B (0%)
build/atomic-block-components/stock-indicator-frontend.js 612 B +1 B (0%)
build/atomic-block-components/summary-frontend.js 906 B -2 B (0%)
build/atomic-block-components/summary.js 912 B +1 B (0%)
build/atomic-block-components/title-frontend.js 1.64 kB +86 B (+6%) 🔍
build/atomic-block-components/title.js 1.46 kB +84 B (+6%) 🔍
build/attribute-filter-frontend.js 18.3 kB +4 B (0%)
build/attribute-filter.js 12.1 kB -5 B (0%)
build/cart-blocks/accepted-payment-methods-frontend.js 1.38 kB -5 B (0%)
build/cart-blocks/checkout-button-frontend.js 1.23 kB -3 B (0%)
build/cart-blocks/express-payment--checkout-blocks/express-payment--checkout-blocks/payment-frontend.js 4.73 kB +6 B (0%)
build/cart-blocks/express-payment-frontend.js 1.58 kB -2 B (0%)
build/cart-blocks/filled-cart-frontend.js 806 B -2 B (0%)
build/cart-blocks/line-items-frontend.js 5.86 kB +52 B (+1%)
build/cart-blocks/order-summary--checkout-blocks/billing-address--checkout-blocks/shipping-address-frontend.js 3.69 kB -2 B (0%)
build/cart-blocks/order-summary-frontend.js 7.42 kB +9 B (0%)
build/cart-blocks/totals-frontend.js 323 B +1 B (0%)
build/cart-frontend.js 52.9 kB +36 B (0%)
build/cart.js 50.6 kB +78 B (0%)
build/checkout-blocks/actions-frontend.js 1.51 kB -3 B (0%)
build/checkout-blocks/billing-address-frontend.js 2.67 kB +5 B (0%)
build/checkout-blocks/contact-information-frontend.js 3.89 kB -4 B (0%)
build/checkout-blocks/express-payment-frontend.js 1.93 kB +3 B (0%)
build/checkout-blocks/fields-frontend.js 346 B -1 B (0%)
build/checkout-blocks/order-note-frontend.js 1.56 kB -1 B (0%)
build/checkout-blocks/order-summary-frontend.js 12.8 kB +41 B (0%)
build/checkout-blocks/payment-frontend.js 4.58 kB -2 B (0%)
build/checkout-blocks/shipping-address-frontend.js 3.06 kB +6 B (0%)
build/checkout-blocks/shipping-methods-frontend.js 5.55 kB -6 B (0%)
build/checkout-blocks/terms-frontend.js 1.65 kB -2 B (0%)
build/checkout-blocks/totals-frontend.js 329 B -1 B (0%)
build/checkout-frontend.js 55.1 kB +2 B (0%)
build/checkout.js 54 kB +57 B (0%)
build/featured-category.js 7.73 kB -1 B (0%)
build/featured-product.js 9.42 kB -5 B (0%)
build/handpicked-products.js 6.27 kB +7 B (0%)
build/mini-cart-component-frontend.js 45 kB +8.07 kB (+22%) 🚨
build/mini-cart-frontend.js 2.33 kB +6 B (0%)
build/mini-cart.js 5.72 kB +433 B (+8%) 🔍
build/price-filter-frontend.js 14.4 kB -12 B (0%)
build/price-filter.js 9.65 kB -4 B (0%)
build/product-best-sellers.js 6.62 kB -8 B (0%)
build/product-categories.js 3.38 kB +1 B (0%)
build/product-category.js 7.49 kB -3 B (0%)
build/product-new.js 6.77 kB -8 B (0%)
build/product-on-sale.js 7.11 kB -17 B (0%)
build/product-search.js 2.68 kB +2 B (0%)
build/product-tag.js 6.6 kB +8 B (0%)
build/product-top-rated.js 6.74 kB -6 B (0%)
build/products-by-attribute.js 7.7 kB -3 B (0%)
build/reviews-by-category.js 11.4 kB -10 B (0%)
build/reviews-by-product.js 13 kB -10 B (0%)
build/reviews-frontend.js 8.96 kB +6 B (0%)
build/single-product-frontend.js 26.6 kB +20 B (0%)
build/single-product.js 9.77 kB -4 B (0%)
build/stock-filter-frontend.js 8.77 kB +11 B (0%)
build/stock-filter.js 7.81 kB -2 B (0%)
build/vendors--atomic-block-components/add-to-cart--cart-blocks/order-summary--checkout-blocks/billing-ad--c5eb4dcd-frontend.js 16.1 kB +1 B (0%)
build/vendors--atomic-block-components/add-to-cart-frontend.js 4.77 kB -8 B (0%)
build/vendors--atomic-block-components/price--cart-blocks/line-items--cart-blocks/order-summary--checkout--8a3571de-frontend.js 5.71 kB -1 B (0%)
build/vendors--cart-blocks/order-summary--checkout-blocks/billing-address--checkout-blocks/order-summary---eb4d2cec-frontend.js 5.02 kB -1 B (0%)
build/wc-blocks-style-rtl.css 21.1 kB +438 B (+2%)
build/wc-blocks-style.css 21 kB +439 B (+2%)
build/wc-blocks-vendors.js 254 kB +25 B (0%)
build/wc-blocks.js 3.49 kB -1 B (0%)
build/legacy-template.js 1.45 kB +1.45 kB (new file) 🆕
ℹ️ View Unchanged
Filename Size
build/atomic-block-components/add-to-cart.js 7.84 kB
build/atomic-block-components/category-list.js 470 B
build/atomic-block-components/image.js 1.35 kB
build/atomic-block-components/price.js 2.11 kB
build/atomic-block-components/rating-frontend.js 561 B
build/atomic-block-components/sale-badge-frontend.js 859 B
build/atomic-block-components/stock-indicator.js 611 B
build/atomic-block-components/tag-list-frontend.js 466 B
build/atomic-block-components/tag-list.js 471 B
build/blocks-checkout.js 21.1 kB
build/cart-blocks/empty-cart-frontend.js 349 B
build/cart-blocks/items-frontend.js 303 B
build/price-format.js 1.37 kB
build/vendors--cart-blocks/line-items--checkout-blocks/order-summary-frontend.js 3.1 kB
build/wc-blocks-data.js 11.3 kB
build/wc-blocks-editor-style-rtl.css 15.6 kB
build/wc-blocks-editor-style.css 15.6 kB
build/wc-blocks-google-analytics.js 1.98 kB
build/wc-blocks-middleware.js 1.47 kB
build/wc-blocks-registry.js 3.71 kB
build/wc-blocks-shared-context.js 1.54 kB
build/wc-blocks-shared-hocs.js 1.75 kB
build/wc-blocks-vendors-style-rtl.css 1.37 kB
build/wc-blocks-vendors-style.css 1.37 kB
build/wc-payment-method-bacs.js 806 B
build/wc-payment-method-cheque.js 806 B
build/wc-payment-method-cod.js 898 B
build/wc-payment-method-paypal.js 839 B
build/wc-payment-method-stripe.js 12.2 kB
build/wc-settings.js 2.91 kB

compressed-size-action

@tjcafferkey tjcafferkey marked this pull request as ready for review October 26, 2021 14:25
Copy link
Contributor

@Aljullu Aljullu left a comment

Choose a reason for hiding this comment

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

This is testing well and code looks good.

I pushed a couple of commits directly:

  • 019caae: to make the placeholder text translatable. I'm not sure if that text was final or it will be replaced by a nicer placeholder in the future, but just in case. 🙂
  • d68491e: locked the block so it can't be removed (while still being possible to move it around).

Besides that, I wonder if the block should be renamed to WooCommerce Legacy Template in order to make it clear it's only intended to be used for WooCommerce templates. @tjcafferkey I will leave it up to you to decide.

@tjcafferkey
Copy link
Contributor Author

Thank you for committing those changes directly @Aljullu I've now learned how to lock blocks, and we can move this PR along quicker 🙌🏻

I've updated the block title to be WooCommerce Legacy Template like you suggested it definitely makes more sense.

@tjcafferkey tjcafferkey merged commit 6a49370 into trunk Oct 29, 2021
@tjcafferkey tjcafferkey deleted the add/legacy-template-block branch October 29, 2021 07:31
@nielslange nielslange changed the title Abstract LegacyTemplate block Add abstract legacy template block Nov 15, 2021
@nielslange nielslange added the type: enhancement The issue is a request for an enhancement. label Nov 16, 2021
@frontdevde frontdevde added the skip-changelog PRs that you don't want to appear in the changelog. label Nov 16, 2021
jonny-bull pushed a commit to jonny-bull/woocommerce-gutenberg-products-block that referenced this pull request Dec 14, 2021
* Legacy Template block

* Return render_single_product value

* Make placeholder text translatable

* Don't allow removing the block

* Update block title

Co-authored-by: Albert Juhé Lluveras <contact@albertjuhe.com>
jonny-bull pushed a commit to jonny-bull/woocommerce-gutenberg-products-block that referenced this pull request Dec 16, 2021
* Legacy Template block

* Return render_single_product value

* Make placeholder text translatable

* Don't allow removing the block

* Update block title

Co-authored-by: Albert Juhé Lluveras <contact@albertjuhe.com>
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
focus: FSE Work related to prepare WooCommerce for FSE. focus: template Related to API powering block template functionality in the Site Editor skip-changelog PRs that you don't want to appear in the changelog. type: enhancement The issue is a request for an enhancement.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Create LegacyTemplate abstract block
4 participants