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

Enhancement/pickup location editor improvements (https://github.com/woocommerce/woocommerce-blocks/pull/7446) 

* Hide form step descriptions when empty unless block has focus

* Make editor style match frontend

* Add links to settings in sidebar

* update sample costs

* phpcs
This commit is contained in:
Mike Jolley 2022-10-25 14:59:40 +01:00 committed by Nadir Seghir
parent bc2a52b85d
commit 3d0109f1dc
6 changed files with 87 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
plugins/woocommerce-blocks/assets/js/blocks/checkout/form-step/editor.scss
View File

@ -4,8 +4,11 @@
}
.wc-block-components-checkout-step__description-placeholder {
opacity: 0.5;
display: none;
.is-selected & {
display: block;
}
}
.wc-block-components-checkout-step__title {
display: flex;
width: 100%;

41
plugins/woocommerce-blocks/assets/js/blocks/checkout/inner-blocks/checkout-shipping-method-block/edit.tsx
View File

@ -3,15 +3,16 @@
* External dependencies
*/
import classnames from 'classnames';
import { useState } from '@wordpress/element';
import { __ } from '@wordpress/i18n';
import {
PanelBody,
ToggleControl,
__experimentalRadio as Radio,
__experimentalRadioGroup as RadioGroup,
ExternalLink,
} from '@wordpress/components';
import { Icon, store, shipping } from '@wordpress/icons';
import { ADMIN_URL, getSetting } from '@woocommerce/settings';
import {
InspectorControls,
useBlockProps,
@ -21,6 +22,7 @@ import { useShippingData } from '@woocommerce/base-context/hooks';
import { innerBlockAreas } from '@woocommerce/blocks-checkout';
import { useDispatch, useSelect } from '@wordpress/data';
import { CHECKOUT_STORE_KEY } from '@woocommerce/block-data';
import ExternalLinkCard from '@woocommerce/editor-components/external-link-card';
/**
* Internal dependencies
@ -238,6 +240,43 @@ export const Edit = ( {
}
/>
</PanelBody>
<PanelBody
title={ __(
'Shipping Methods',
'woo-gutenberg-products-block'
) }
>
<p className="wc-block-checkout__controls-text">
{ __(
'Methods can be made managed in your store settings.',
'woo-gutenberg-products-block'
) }
</p>
<ExternalLinkCard
key={ 'shipping_methods' }
href={ `${ ADMIN_URL }admin.php?page=wc-settings&tab=shipping` }
title={ __(
'Shipping',
'woo-gutenberg-products-block'
) }
description={ __(
'Manage your shipping zones, methods, and rates.',
'woo-gutenberg-products-block'
) }
/>
<ExternalLinkCard
key={ 'pickup_location' }
href={ `${ ADMIN_URL }admin.php?page=wc-settings&tab=shipping&section=pickup_location` }
title={ __(
'Local Pickup',
'woo-gutenberg-products-block'
) }
description={ __(
'Allow customers to choose a local pickup location during checkout.',
'woo-gutenberg-products-block'
) }
/>
</PanelBody>
</InspectorControls>
<RadioGroup
id="shipping-method"

13
plugins/woocommerce-blocks/assets/js/blocks/checkout/inner-blocks/checkout-shipping-method-block/style.scss
View File

@ -5,6 +5,7 @@
justify-content: space-between;
}
.edit-post-visual-editor .wc-block-checkout__shipping-method-option,
.wc-block-checkout__shipping-method-option {
flex-grow: 1;
display: flex;
@ -19,9 +20,19 @@
color: inherit;
background-color: transparent;
border: none;
box-shadow: none !important;
outline: 1px solid currentColor;
border-radius: 0 !important;
&.components-button:hover:not(:disabled),
&.components-button:focus:not(:disabled),
&:focus,
&:hover {
background-color: #d5d5d5;
border-color: #d5d5d5;
color: #333;
}
&.wc-block-checkout__shipping-method-option--selected {
outline-width: 2px;
outline: 3px solid currentColor;
}
}

32
plugins/woocommerce-blocks/assets/js/previews/shipping-rates.ts
View File

@ -45,17 +45,39 @@ export const previewShippingRates: CartResponseShippingRate[] = [
currency_thousand_separator: ',',
currency_prefix: '$',
currency_suffix: '',
name: __( 'Free shipping', 'woo-gutenberg-products-block' ),
name: __(
'Flat rate shipping',
'woo-gutenberg-products-block'
),
description: '',
delivery_time: '',
price: '000',
price: '500',
taxes: '0',
rate_id: 'free_shipping:1',
rate_id: 'flat_rate:0',
instance_id: 0,
meta_data: [],
method_id: 'flat_rate',
selected: true,
},
{
currency_code: 'USD',
currency_symbol: '$',
currency_minor_unit: 2,
currency_decimal_separator: '.',
currency_thousand_separator: ',',
currency_prefix: '$',
currency_suffix: '',
name: __( 'Free shipping', 'woo-gutenberg-products-block' ),
description: '',
delivery_time: '',
price: '0',
taxes: '0',
rate_id: 'free_shipping:1',
instance_id: 0,
meta_data: [],
method_id: 'flat_rate',
selected: false,
},
{
currency_code: 'USD',
currency_symbol: '$',
@ -67,7 +89,7 @@ export const previewShippingRates: CartResponseShippingRate[] = [
name: __( 'Local pickup', 'woo-gutenberg-products-block' ),
description: '',
delivery_time: '',
price: '200',
price: '0',
taxes: '0',
rate_id: 'pickup_location:1',
instance_id: 1,
@ -95,7 +117,7 @@ export const previewShippingRates: CartResponseShippingRate[] = [
name: __( 'Local pickup', 'woo-gutenberg-products-block' ),
description: '',
delivery_time: '',
price: '200',
price: '0',
taxes: '0',
rate_id: 'pickup_location:2',
instance_id: 1,

3
plugins/woocommerce-blocks/src/BlockTypes/Checkout.php
View File

@ -256,6 +256,9 @@ class Checkout extends AbstractBlock {
$formatted_shipping_methods = array_reduce(
$shipping_methods,
function( $acc, $method ) {
if ( 'pickup_location' === $method->id ) {
return $acc;
}
if ( $method->supports( 'settings' ) ) {
$acc[] = [
'id' => $method->id,

2
plugins/woocommerce-blocks/src/Shipping/PickupLocation.php
View File

@ -15,7 +15,7 @@ class PickupLocation extends WC_Shipping_Method {
*/
public function __construct() {
$this->id = 'pickup_location';
$this->method_title = __( 'Pickup Locations', 'woo-gutenberg-products-block' );
$this->method_title = __( 'Local Pickup', 'woo-gutenberg-products-block' );
$this->method_description = __( 'Allow customers to choose a local pickup location during checkout.', 'woo-gutenberg-products-block' );
$this->init();
}