Steve-Dee-Designs
/
woocommerce
mirror of https://github.com/woocommerce/woocommerce.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Configure link for the proceed to checkout button (https://github.com/woocommerce/woocommerce-blocks/pull/1981) 

* Add link for proceed to checkout button

* Fixes to indenting/types

* Update snaps

* Update notice
This commit is contained in:
Mike Jolley 2020-03-17 10:30:52 +00:00 committed by GitHub
parent cdfb457341
commit bd6c7f657c
10 changed files with 133 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
plugins/woocommerce-blocks/assets/js/blocks/cart-checkout/cart/attributes.js
View File

@ -15,6 +15,10 @@ const blockAttributes = {
type: 'boolean',
default: IS_SHIPPING_COST_HIDDEN,
},
checkoutPageId: {
type: 'number',
default: 0,
},
};
export default blockAttributes;

120
plugins/woocommerce-blocks/assets/js/blocks/cart-checkout/cart/edit.js
View File

@ -2,27 +2,76 @@
* External dependencies
*/
import { __ } from '@wordpress/i18n';
import FeedbackPrompt from '@woocommerce/block-components/feedback-prompt';
import { InspectorControls } from '@wordpress/block-editor';
import { Disabled, PanelBody, ToggleControl } from '@wordpress/components';
import {
Disabled,
PanelBody,
ToggleControl,
SelectControl,
Notice,
} from '@wordpress/components';
import PropTypes from 'prop-types';
import { withFeedbackPrompt } from '@woocommerce/block-hocs';
import ViewSwitcher from '@woocommerce/block-components/view-switcher';
import { SHIPPING_ENABLED } from '@woocommerce/block-settings';
import { SHIPPING_ENABLED, CART_PAGE_ID } from '@woocommerce/block-settings';
import BlockErrorBoundary from '@woocommerce/base-components/block-error-boundary';
import { EditorProvider } from '@woocommerce/base-context';
import { EditorProvider, useEditorContext } from '@woocommerce/base-context';
import { useSelect } from '@wordpress/data';
import { __experimentalCreateInterpolateElement } from 'wordpress-element';
import { getAdminLink } from '@woocommerce/settings';
/**
* Internal dependencies
*/
import FullCart from './full-cart';
import EmptyCart from './empty-cart';
import './editor.scss';
const BlockSettings = ( { attributes, setAttributes } ) => {
const { isShippingCalculatorEnabled, isShippingCostHidden } = attributes;
const {
isShippingCalculatorEnabled,
isShippingCostHidden,
checkoutPageId,
} = attributes;
const pages =
useSelect( ( select ) => {
return select( 'core' ).getEntityRecords( 'postType', 'page', {
status: 'publish',
orderby: 'title',
order: 'asc',
per_page: 100,
} );
}, [] ) || null;
const { currentPostId } = useEditorContext();
return (
<InspectorControls>
{ currentPostId !== CART_PAGE_ID && (
<Notice
className="wc-block-cart__page-notice"
isDismissible={ false }
status="warning"
>
{ __experimentalCreateInterpolateElement(
__(
'If you would like to use this block as your default cart you must update your <a>page settings in WooCommerce</a>.',
'woo-gutenberg-products-block'
),
{
a: (
// eslint-disable-next-line jsx-a11y/anchor-has-content
<a
href={ getAdminLink(
'admin.php?page=wc-settings&tab=advanced'
) }
target="_blank"
rel="noopener noreferrer"
/>
),
}
) }
</Notice>
) }
<PanelBody
title={ __( 'Shipping rates', 'woo-gutenberg-products-block' ) }
>
@ -59,6 +108,50 @@ const BlockSettings = ( { attributes, setAttributes } ) => {
}
/>
</PanelBody>
{ ( currentPostId !== CART_PAGE_ID || checkoutPageId ) && pages && (
<PanelBody
title={ __(
'Proceed to Checkout button',
'woo-gutenberg-products-block'
) }
>
<SelectControl
label={ __(
'Link to',
'woo-gutenberg-products-block'
) }
value={ checkoutPageId }
options={ [
...[
{
label: __(
'WooCommerce Checkout Page',
'woo-gutenberg-products-block'
),
value: 0,
},
],
...Object.values( pages ).map( ( page ) => {
return {
label: page.title.raw,
value: parseInt( page.id, 10 ),
};
} ),
] }
onChange={ ( value ) =>
setAttributes( {
checkoutPageId: parseInt( value, 10 ),
} )
}
/>
</PanelBody>
) }
<FeedbackPrompt
text={ __(
'We are currently working on improving our cart and checkout blocks, providing merchants with the tools and customization options they need.',
'woo-gutenberg-products-block'
) }
/>
</InspectorControls>
);
};
@ -67,7 +160,6 @@ const BlockSettings = ( { attributes, setAttributes } ) => {
* Component to handle edit mode of "Cart Block".
*/
const CartEditor = ( { className, attributes, setAttributes } ) => {
const { isShippingCalculatorEnabled, isShippingCostHidden } = attributes;
return (
<div className={ className }>
<ViewSwitcher
@ -114,12 +206,7 @@ const CartEditor = ( { className, attributes, setAttributes } ) => {
<Disabled>
<EditorProvider>
<FullCart
isShippingCostHidden={
isShippingCostHidden
}
isShippingCalculatorEnabled={
isShippingCalculatorEnabled
}
attributes={ attributes }
/>
</EditorProvider>
</Disabled>
@ -154,9 +241,4 @@ CartEditor.propTypes = {
className: PropTypes.string,
};
export default withFeedbackPrompt(
__(
'We are currently working on improving our cart and checkout blocks, providing merchants with the tools and customization options they need.',
'woo-gutenberg-products-block'
)
)( CartEditor );
export default CartEditor;

3
plugins/woocommerce-blocks/assets/js/blocks/cart-checkout/cart/editor.scss Normal file
View File

@ -0,0 +1,3 @@
.wc-block-cart__page-notice {
margin: 0;
}

7
plugins/woocommerce-blocks/assets/js/blocks/cart-checkout/cart/frontend.js
View File

@ -32,12 +32,7 @@ const Block = ( { emptyCart, attributes } ) => {
<RawHTML>{ emptyCart }</RawHTML>
) : (
<LoadingMask showSpinner={ true } isLoading={ cartIsLoading }>
<FullCart
isShippingCalculatorEnabled={
attributes.isShippingCalculatorEnabled
}
isShippingCostHidden={ attributes.isShippingCostHidden }
/>
<FullCart attributes={ attributes } />
</LoadingMask>
) }
</>

4
plugins/woocommerce-blocks/assets/js/blocks/cart-checkout/cart/full-cart/checkout-button/index.js
View File

@ -15,12 +15,12 @@ import { MastercardLogo, VisaLogo } from './payment-logos'; // @todo we want to
/**
* Checkout button rendered in the full cart page.
*/
const CheckoutButton = () => {
const CheckoutButton = ( { link } ) => {
return (
<div className="wc-block-cart__submit-container">
<Button
className="wc-block-cart__submit-button"
href={ CHECKOUT_URL }
href={ link || CHECKOUT_URL }
>
{ __( 'Proceed to Checkout', 'woo-gutenberg-products-block' ) }
</Button>

14
plugins/woocommerce-blocks/assets/js/blocks/cart-checkout/cart/full-cart/index.js
View File

@ -27,6 +27,7 @@ import {
SidebarLayout,
Main,
} from '@woocommerce/base-components/sidebar-layout';
import { getSetting } from '@woocommerce/settings';
/**
* Internal dependencies
@ -41,8 +42,9 @@ import './editor.scss';
/**
* Component that renders the Cart block when user has something in cart aka "full".
*/
const Cart = ( { isShippingCalculatorEnabled, isShippingCostHidden } ) => {
const Cart = ( { attributes } ) => {
const { cartItems, cartTotals, cartIsLoading } = useStoreCart();
const { isShippingCalculatorEnabled, isShippingCostHidden } = attributes;
const {
applyCoupon,
@ -117,7 +119,12 @@ const Cart = ( { isShippingCalculatorEnabled, isShippingCostHidden } ) => {
currency={ totalsCurrency }
values={ cartTotals }
/>
<CheckoutButton />
<CheckoutButton
link={ getSetting(
'page-' + attributes?.checkoutPageId,
false
) }
/>
</CardBody>
</Card>
</Sidebar>
@ -126,8 +133,7 @@ const Cart = ( { isShippingCalculatorEnabled, isShippingCostHidden } ) => {
};
Cart.propTypes = {
isShippingCalculatorEnabled: PropTypes.bool,
isShippingCostHidden: PropTypes.bool,
attributes: PropTypes.object.isRequired,
};
export default Cart;

11
plugins/woocommerce-blocks/assets/js/blocks/cart-checkout/checkout/block.js
View File

@ -332,13 +332,10 @@ const Block = ( {
<div className="wc-block-checkout__actions">
{ attributes.showReturnToCart && (
<ReturnToCartButton
link={
getSetting(
'page-' +
attributes?.cartPageId,
false
)
}
link={ getSetting(
'page-' + attributes?.cartPageId,
false
) }
/>
) }
<PlaceOrderButton />

2
plugins/woocommerce-blocks/assets/js/blocks/cart-checkout/checkout/edit.js
View File

@ -267,7 +267,7 @@ const BlockSettings = ( { attributes, setAttributes } ) => {
'WooCommerce Cart Page',
'woo-gutenberg-products-block'
),
value: '',
value: 0,
},
],
...Object.values( pages ).map( ( page ) => {

6
plugins/woocommerce-blocks/src/BlockTypes/Cart.php
View File

@ -49,6 +49,12 @@ class Cart extends AbstractBlock {
$data_registry = Package::container()->get(
\Automattic\WooCommerce\Blocks\Assets\AssetDataRegistry::class
);
if ( ! empty( $attributes['checkoutPageId'] ) && ! $data_registry->exists( 'page-' . $attributes['checkoutPageId'] ) ) {
$permalink = get_permalink( $attributes['checkoutPageId'] );
if ( $permalink ) {
$data_registry->add( 'page-' . $attributes['checkoutPageId'], get_permalink( $attributes['checkoutPageId'] ) );
}
}
if ( ! $data_registry->exists( 'shippingCountries' ) ) {
$data_registry->add( 'shippingCountries', WC()->countries->get_shipping_countries() );
}

2
plugins/woocommerce-blocks/tests/e2e-tests/specs/backend/__snapshots__/cart.test.js.snap
View File

@ -2,7 +2,7 @@
exports[`Cart Block can be created 1`] = `
"<!-- wp:woocommerce/cart -->
<div class=\\"wp-block-woocommerce-cart is-loading\\" data-is-shipping-calculator-enabled=\\"true\\" data-is-shipping-cost-hidden=\\"false\\"><!-- wp:image {\\"align\\":\\"center\\",\\"sizeSlug\\":\\"small\\"} -->
<div class=\\"wp-block-woocommerce-cart is-loading\\" data-is-shipping-calculator-enabled=\\"true\\" data-is-shipping-cost-hidden=\\"false\\" data-checkout-page-id=\\"0\\"><!-- wp:image {\\"align\\":\\"center\\",\\"sizeSlug\\":\\"small\\"} -->
<div class=\\"wp-block-image\\"><figure class=\\"aligncenter size-small\\"><img src=\\"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzgiIGhlaWdodD0iMzgiIHZpZXdCb3g9IjAgMCAzOCAzOCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE5IDBDOC41MDQwMyAwIDAgOC41MDQwMyAwIDE5QzAgMjkuNDk2IDguNTA0MDMgMzggMTkgMzhDMjkuNDk2IDM4IDM4IDI5LjQ5NiAzOCAxOUMzOCA4LjUwNDAzIDI5LjQ5NiAwIDE5IDBaTTI1LjEyOSAxMi44NzFDMjYuNDg1MSAxMi44NzEgMjcuNTgwNiAxMy45NjY1IDI3LjU4MDYgMTUuMzIyNkMyNy41ODA2IDE2LjY3ODYgMjYuNDg1MSAxNy43NzQyIDI1LjEyOSAxNy43NzQyQzIzLjc3MyAxNy43NzQyIDIyLjY3NzQgMTYuNjc4NiAyMi42Nzc0IDE1LjMyMjZDMjIuNjc3NCAxMy45NjY1IDIzLjc3MyAxMi44NzEgMjUuMTI5IDEyLjg3MVpNMTEuNjQ1MiAzMS4yNTgxQzkuNjE0OTIgMzEuMjU4MSA3Ljk2Nzc0IDI5LjY0OTIgNy45Njc3NCAyNy42NTczQzcuOTY3NzQgMjYuMTI1IDEwLjE1MTIgMjMuMDI5OCAxMS4xNTQ4IDIxLjY5NjhDMTEuNCAyMS4zNjczIDExLjg5MDMgMjEuMzY3MyAxMi4xMzU1IDIxLjY5NjhDMTMuMTM5MSAyMy4wMjk4IDE1LjMyMjYgMjYuMTI1IDE1LjMyMjYgMjcuNjU3M0MxNS4zMjI2IDI5LjY0OTIgMTMuNjc1NCAzMS4yNTgxIDExLjY0NTIgMzEuMjU4MVpNMTIuODcxIDE3Ljc3NDJDMTEuNTE0OSAxNy43NzQyIDEwLjQxOTQgMTYuNjc4NiAxMC40MTk0IDE1LjMyMjZDMTAuNDE5NCAxMy45NjY1IDExLjUxNDkgMTIuODcxIDEyLjg3MSAxMi44NzFDMTQuMjI3IDEyLjg3MSAxNS4zMjI2IDEzLjk2NjUgMTUuMzIyNiAxNS4zMjI2QzE1LjMyMjYgMTYuNjc4NiAxNC4yMjcgMTcuNzc0MiAxMi44NzEgMTcuNzc0MlpNMjUuOTEwNSAyOS41ODc5QzI0LjE5NDQgMjcuNTM0NyAyMS42NzM4IDI2LjM1NDggMTkgMjYuMzU0OEMxNy4zNzU4IDI2LjM1NDggMTcuMzc1OCAyMy45MDMyIDE5IDIzLjkwMzJDMjIuNDAxNiAyMy45MDMyIDI1LjYxMTcgMjUuNDA0OCAyNy43ODc1IDI4LjAyNUMyOC44NDQ4IDI5LjI4MTUgMjYuOTI5NCAzMC44MjE0IDI1LjkxMDUgMjkuNTg3OVoiIGZpbGw9ImJsYWNrIi8+Cjwvc3ZnPgo=\\" alt=\\"\\"/></figure></div>
<!-- /wp:image -->