From 4b41d7d7f82461813b3464d1b4f931c442bce3be Mon Sep 17 00:00:00 2001 From: Raluca Stan Date: Wed, 9 Feb 2022 11:57:36 +0100 Subject: [PATCH 1/3] Add the correct appender button for non empty groups --- .../cart/inner-blocks/cart-items-block/edit.tsx | 1 - .../cart/inner-blocks/cart-totals-block/edit.tsx | 1 - .../cart/inner-blocks/empty-cart-block/edit.tsx | 6 +----- .../inner-blocks/empty-mini-cart-contents-block/edit.tsx | 5 +---- .../inner-blocks/mini-cart-items-block/edit.tsx | 1 - .../checkout/inner-blocks/checkout-fields-block/edit.tsx | 1 - .../checkout/inner-blocks/checkout-totals-block/edit.tsx | 1 - 7 files changed, 2 insertions(+), 14 deletions(-) diff --git a/assets/js/blocks/cart-checkout/cart/inner-blocks/cart-items-block/edit.tsx b/assets/js/blocks/cart-checkout/cart/inner-blocks/cart-items-block/edit.tsx index fc4df087b9d..0871ad60d67 100644 --- a/assets/js/blocks/cart-checkout/cart/inner-blocks/cart-items-block/edit.tsx +++ b/assets/js/blocks/cart-checkout/cart/inner-blocks/cart-items-block/edit.tsx @@ -28,7 +28,6 @@ export const Edit = ( { clientId }: { clientId: string } ): JSX.Element => { allowedBlocks={ allowedBlocks } template={ defaultTemplate } templateLock={ false } - renderAppender={ InnerBlocks.ButtonBlockAppender } /> ); diff --git a/assets/js/blocks/cart-checkout/cart/inner-blocks/cart-totals-block/edit.tsx b/assets/js/blocks/cart-checkout/cart/inner-blocks/cart-totals-block/edit.tsx index 615fc753539..82042dccc06 100644 --- a/assets/js/blocks/cart-checkout/cart/inner-blocks/cart-totals-block/edit.tsx +++ b/assets/js/blocks/cart-checkout/cart/inner-blocks/cart-totals-block/edit.tsx @@ -34,7 +34,6 @@ export const Edit = ( { clientId }: { clientId: string } ): JSX.Element => { allowedBlocks={ allowedBlocks } template={ defaultTemplate } templateLock={ false } - renderAppender={ InnerBlocks.ButtonBlockAppender } /> ); diff --git a/assets/js/blocks/cart-checkout/cart/inner-blocks/empty-cart-block/edit.tsx b/assets/js/blocks/cart-checkout/cart/inner-blocks/empty-cart-block/edit.tsx index 78dc6abdb09..026682211f6 100644 --- a/assets/js/blocks/cart-checkout/cart/inner-blocks/empty-cart-block/edit.tsx +++ b/assets/js/blocks/cart-checkout/cart/inner-blocks/empty-cart-block/edit.tsx @@ -94,11 +94,7 @@ export const Edit = ( { clientId }: { clientId: string } ): JSX.Element => { { ...blockProps } hidden={ currentView !== 'woocommerce/empty-cart-block' } > - + ); }; diff --git a/assets/js/blocks/cart-checkout/mini-cart-contents/inner-blocks/empty-mini-cart-contents-block/edit.tsx b/assets/js/blocks/cart-checkout/mini-cart-contents/inner-blocks/empty-mini-cart-contents-block/edit.tsx index 4e92cf82faa..9ca7a9f66ee 100644 --- a/assets/js/blocks/cart-checkout/mini-cart-contents/inner-blocks/empty-mini-cart-contents-block/edit.tsx +++ b/assets/js/blocks/cart-checkout/mini-cart-contents/inner-blocks/empty-mini-cart-contents-block/edit.tsx @@ -20,10 +20,7 @@ export const Edit = (): JSX.Element => { currentView !== 'woocommerce/empty-mini-cart-contents-block' } > - + ); }; diff --git a/assets/js/blocks/cart-checkout/mini-cart-contents/inner-blocks/mini-cart-items-block/edit.tsx b/assets/js/blocks/cart-checkout/mini-cart-contents/inner-blocks/mini-cart-items-block/edit.tsx index c85b71eb7ce..cf549146343 100644 --- a/assets/js/blocks/cart-checkout/mini-cart-contents/inner-blocks/mini-cart-items-block/edit.tsx +++ b/assets/js/blocks/cart-checkout/mini-cart-contents/inner-blocks/mini-cart-items-block/edit.tsx @@ -20,7 +20,6 @@ export const Edit = (): JSX.Element => {
diff --git a/assets/js/blocks/checkout/inner-blocks/checkout-fields-block/edit.tsx b/assets/js/blocks/checkout/inner-blocks/checkout-fields-block/edit.tsx index eb35dfef8df..819a84678be 100644 --- a/assets/js/blocks/checkout/inner-blocks/checkout-fields-block/edit.tsx +++ b/assets/js/blocks/checkout/inner-blocks/checkout-fields-block/edit.tsx @@ -64,7 +64,6 @@ export const Edit = ( { allowedBlocks={ allowedBlocks } templateLock={ false } template={ defaultTemplate } - renderAppender={ InnerBlocks.ButtonBlockAppender } /> diff --git a/assets/js/blocks/checkout/inner-blocks/checkout-totals-block/edit.tsx b/assets/js/blocks/checkout/inner-blocks/checkout-totals-block/edit.tsx index ad271e3f359..70df014d862 100644 --- a/assets/js/blocks/checkout/inner-blocks/checkout-totals-block/edit.tsx +++ b/assets/js/blocks/checkout/inner-blocks/checkout-totals-block/edit.tsx @@ -57,7 +57,6 @@ export const Edit = ( { allowedBlocks={ allowedBlocks } templateLock={ false } template={ defaultTemplate } - renderAppender={ InnerBlocks.ButtonBlockAppender } /> ); From 52ab3d71156279c722c543988fa5b1643fcd2fee Mon Sep 17 00:00:00 2001 From: Raluca Stan Date: Wed, 9 Feb 2022 15:39:31 +0100 Subject: [PATCH 2/3] Revert "Add the correct appender button for non empty groups" This reverts commit 4b41d7d7f82461813b3464d1b4f931c442bce3be. --- .../cart/inner-blocks/cart-items-block/edit.tsx | 1 + .../cart/inner-blocks/cart-totals-block/edit.tsx | 1 + .../cart/inner-blocks/empty-cart-block/edit.tsx | 6 +++++- .../inner-blocks/empty-mini-cart-contents-block/edit.tsx | 5 ++++- .../inner-blocks/mini-cart-items-block/edit.tsx | 1 + .../checkout/inner-blocks/checkout-fields-block/edit.tsx | 1 + .../checkout/inner-blocks/checkout-totals-block/edit.tsx | 1 + 7 files changed, 14 insertions(+), 2 deletions(-) diff --git a/assets/js/blocks/cart-checkout/cart/inner-blocks/cart-items-block/edit.tsx b/assets/js/blocks/cart-checkout/cart/inner-blocks/cart-items-block/edit.tsx index 0871ad60d67..fc4df087b9d 100644 --- a/assets/js/blocks/cart-checkout/cart/inner-blocks/cart-items-block/edit.tsx +++ b/assets/js/blocks/cart-checkout/cart/inner-blocks/cart-items-block/edit.tsx @@ -28,6 +28,7 @@ export const Edit = ( { clientId }: { clientId: string } ): JSX.Element => { allowedBlocks={ allowedBlocks } template={ defaultTemplate } templateLock={ false } + renderAppender={ InnerBlocks.ButtonBlockAppender } /> ); diff --git a/assets/js/blocks/cart-checkout/cart/inner-blocks/cart-totals-block/edit.tsx b/assets/js/blocks/cart-checkout/cart/inner-blocks/cart-totals-block/edit.tsx index 82042dccc06..615fc753539 100644 --- a/assets/js/blocks/cart-checkout/cart/inner-blocks/cart-totals-block/edit.tsx +++ b/assets/js/blocks/cart-checkout/cart/inner-blocks/cart-totals-block/edit.tsx @@ -34,6 +34,7 @@ export const Edit = ( { clientId }: { clientId: string } ): JSX.Element => { allowedBlocks={ allowedBlocks } template={ defaultTemplate } templateLock={ false } + renderAppender={ InnerBlocks.ButtonBlockAppender } /> ); diff --git a/assets/js/blocks/cart-checkout/cart/inner-blocks/empty-cart-block/edit.tsx b/assets/js/blocks/cart-checkout/cart/inner-blocks/empty-cart-block/edit.tsx index 026682211f6..78dc6abdb09 100644 --- a/assets/js/blocks/cart-checkout/cart/inner-blocks/empty-cart-block/edit.tsx +++ b/assets/js/blocks/cart-checkout/cart/inner-blocks/empty-cart-block/edit.tsx @@ -94,7 +94,11 @@ export const Edit = ( { clientId }: { clientId: string } ): JSX.Element => { { ...blockProps } hidden={ currentView !== 'woocommerce/empty-cart-block' } > - +
); }; diff --git a/assets/js/blocks/cart-checkout/mini-cart-contents/inner-blocks/empty-mini-cart-contents-block/edit.tsx b/assets/js/blocks/cart-checkout/mini-cart-contents/inner-blocks/empty-mini-cart-contents-block/edit.tsx index 9ca7a9f66ee..4e92cf82faa 100644 --- a/assets/js/blocks/cart-checkout/mini-cart-contents/inner-blocks/empty-mini-cart-contents-block/edit.tsx +++ b/assets/js/blocks/cart-checkout/mini-cart-contents/inner-blocks/empty-mini-cart-contents-block/edit.tsx @@ -20,7 +20,10 @@ export const Edit = (): JSX.Element => { currentView !== 'woocommerce/empty-mini-cart-contents-block' } > - + ); }; diff --git a/assets/js/blocks/cart-checkout/mini-cart-contents/inner-blocks/mini-cart-items-block/edit.tsx b/assets/js/blocks/cart-checkout/mini-cart-contents/inner-blocks/mini-cart-items-block/edit.tsx index cf549146343..c85b71eb7ce 100644 --- a/assets/js/blocks/cart-checkout/mini-cart-contents/inner-blocks/mini-cart-items-block/edit.tsx +++ b/assets/js/blocks/cart-checkout/mini-cart-contents/inner-blocks/mini-cart-items-block/edit.tsx @@ -20,6 +20,7 @@ export const Edit = (): JSX.Element => {
diff --git a/assets/js/blocks/checkout/inner-blocks/checkout-fields-block/edit.tsx b/assets/js/blocks/checkout/inner-blocks/checkout-fields-block/edit.tsx index 819a84678be..eb35dfef8df 100644 --- a/assets/js/blocks/checkout/inner-blocks/checkout-fields-block/edit.tsx +++ b/assets/js/blocks/checkout/inner-blocks/checkout-fields-block/edit.tsx @@ -64,6 +64,7 @@ export const Edit = ( { allowedBlocks={ allowedBlocks } templateLock={ false } template={ defaultTemplate } + renderAppender={ InnerBlocks.ButtonBlockAppender } /> diff --git a/assets/js/blocks/checkout/inner-blocks/checkout-totals-block/edit.tsx b/assets/js/blocks/checkout/inner-blocks/checkout-totals-block/edit.tsx index 70df014d862..ad271e3f359 100644 --- a/assets/js/blocks/checkout/inner-blocks/checkout-totals-block/edit.tsx +++ b/assets/js/blocks/checkout/inner-blocks/checkout-totals-block/edit.tsx @@ -57,6 +57,7 @@ export const Edit = ( { allowedBlocks={ allowedBlocks } templateLock={ false } template={ defaultTemplate } + renderAppender={ InnerBlocks.ButtonBlockAppender } /> ); From cd54c4ffdcc96fada77a6320b155ddd6b5ac9ac1 Mon Sep 17 00:00:00 2001 From: Raluca Stan Date: Wed, 9 Feb 2022 16:07:05 +0100 Subject: [PATCH 3/3] Force position relative for custom InnerBlocks.ButtonBlockAppender appenders. Removing InnerBlocks.ButtonBlockAppender from renderAppender = {InnerBlocks.ButtonBlockAppender } results in the black appender button beeing shown only when the block is selected, and we need the appender to be visible by default. --- assets/js/blocks/cart-checkout/cart/editor.scss | 9 +++++++++ .../cart-checkout/mini-cart-contents/editor.scss | 13 +++++++++++++ assets/js/blocks/checkout/styles/editor.scss | 6 ++++++ 3 files changed, 28 insertions(+) diff --git a/assets/js/blocks/cart-checkout/cart/editor.scss b/assets/js/blocks/cart-checkout/cart/editor.scss index d39e5532fbb..d3d93d5b5b2 100644 --- a/assets/js/blocks/cart-checkout/cart/editor.scss +++ b/assets/js/blocks/cart-checkout/cart/editor.scss @@ -20,3 +20,12 @@ body.wc-lock-selected-block--remove { } } +.wp-block-woocommerce-cart-items-block, +.wp-block-woocommerce-cart-totals-block, +.wp-block-woocommerce-empty-cart-block { + // Temporary fix after the appender button was positioned absolute + // See https://github.com/woocommerce/woocommerce-gutenberg-products-block/issues/5742#issuecomment-1032804168 + .block-list-appender { + position: relative; + } +} diff --git a/assets/js/blocks/cart-checkout/mini-cart-contents/editor.scss b/assets/js/blocks/cart-checkout/mini-cart-contents/editor.scss index 8fc4e5b4a0e..27b36bb5b36 100644 --- a/assets/js/blocks/cart-checkout/mini-cart-contents/editor.scss +++ b/assets/js/blocks/cart-checkout/mini-cart-contents/editor.scss @@ -21,6 +21,13 @@ flex-direction: column; height: 100%; } + + // Temporary fix after the appender button was positioned absolute + // See https://github.com/woocommerce/woocommerce-gutenberg-products-block/issues/5742#issuecomment-1032804168 + .block-list-appender { + position: relative; + } + } .wp-block-woocommerce-mini-cart-products-table-block { @@ -52,5 +59,11 @@ box-sizing: border-box; padding: $gap-largest $gap $gap; } + + // Temporary fix after the appender button was positioned absolute + // See https://github.com/woocommerce/woocommerce-gutenberg-products-block/issues/5742#issuecomment-1032804168 + .block-list-appender { + position: relative; + } } } diff --git a/assets/js/blocks/checkout/styles/editor.scss b/assets/js/blocks/checkout/styles/editor.scss index 69acbf866b6..fceab401626 100644 --- a/assets/js/blocks/checkout/styles/editor.scss +++ b/assets/js/blocks/checkout/styles/editor.scss @@ -23,6 +23,12 @@ .block-editor-block-list__layout { display: block; } + + // Temporary fix after the appender button was positioned absolute + // See https://github.com/woocommerce/woocommerce-gutenberg-products-block/issues/5742#issuecomment-1032804168 + .block-list-appender { + position: relative; + } } }