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

Fix display of itemised taxes (https://github.com/woocommerce/woocommerce-blocks/pull/4279) 

* Add price to itemised tax rates & hide Total when itemised taxes are on

* Update snapshots for taxes in sidebar
This commit is contained in:
Thomas Roberts 2021-05-26 14:04:42 +01:00 committed by GitHub
parent d2b4a91f1f
commit 61755f0f01
4 changed files with 72 additions and 86 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

78
plugins/woocommerce-blocks/assets/js/blocks/cart-checkout/cart/test/__snapshots__/block.js.snap
View File

@ -1312,35 +1312,26 @@ exports[`Testing cart Shows individual tax lines if the store is set to do so 1`
</fieldset>
</div>
<div
class="wc-block-components-totals-item wc-block-components-totals-taxes"
class="wc-block-components-totals-taxes"
>
<span
class="wc-block-components-totals-item__label"
>
Taxes
</span>
<span
class="wc-block-formatted-money-amount wc-block-components-formatted-money-amount wc-block-components-totals-item__value"
>
$6.00
</span>
<div
class="wc-block-components-totals-item__description"
class="wc-block-components-totals-item wc-block-components-totals-taxes__grouped-rate"
>
<div
class="wc-block-components-totals-item wc-block-components-totals-taxes__tax-line"
<span
class="wc-block-components-totals-item__label"
>
<span
class="wc-block-components-totals-item__label"
>
Sales tax
</span>
<div
class="wc-block-components-totals-item__description"
/>
</div>
Sales tax
</span>
<span
class="wc-block-formatted-money-amount wc-block-components-formatted-money-amount wc-block-components-totals-item__value"
>
$6.00
</span>
<div
class="wc-block-components-totals-item__description"
/>
</div>
</div>
<div
class="wc-block-components-totals-item wc-block-components-totals-footer-item"
@ -2017,35 +2008,26 @@ exports[`Testing cart Shows rate percentages after tax lines if the block is set
</fieldset>
</div>
<div
class="wc-block-components-totals-item wc-block-components-totals-taxes"
class="wc-block-components-totals-taxes"
>
<span
class="wc-block-components-totals-item__label"
>
Taxes
</span>
<span
class="wc-block-formatted-money-amount wc-block-components-formatted-money-amount wc-block-components-totals-item__value"
>
$6.00
</span>
<div
class="wc-block-components-totals-item__description"
class="wc-block-components-totals-item wc-block-components-totals-taxes__grouped-rate"
>
<div
class="wc-block-components-totals-item wc-block-components-totals-taxes__tax-line"
<span
class="wc-block-components-totals-item__label"
>
<span
class="wc-block-components-totals-item__label"
>
Sales tax 20%
</span>
<div
class="wc-block-components-totals-item__description"
/>
</div>
Sales tax 20%
</span>
<span
class="wc-block-formatted-money-amount wc-block-components-formatted-money-amount wc-block-components-totals-item__value"
>
$6.00
</span>
<div
class="wc-block-components-totals-item__description"
/>
</div>
</div>
<div
class="wc-block-components-totals-item wc-block-components-totals-footer-item"

39
plugins/woocommerce-blocks/assets/js/blocks/cart-checkout/checkout/sidebar/test/__snapshots__/index.js.snap
View File

@ -97,35 +97,26 @@ exports[`Testing checkout sidebar Shows rate percentages after tax lines if the
</div>
</div>
<div
class="wc-block-components-totals-item wc-block-components-totals-taxes"
class="wc-block-components-totals-taxes"
>
<span
class="wc-block-components-totals-item__label"
>
Taxes
</span>
<span
class="wc-block-formatted-money-amount wc-block-components-formatted-money-amount wc-block-components-totals-item__value"
>
$6.00
</span>
<div
class="wc-block-components-totals-item__description"
class="wc-block-components-totals-item wc-block-components-totals-taxes__grouped-rate"
>
<div
class="wc-block-components-totals-item wc-block-components-totals-taxes__tax-line"
<span
class="wc-block-components-totals-item__label"
>
<span
class="wc-block-components-totals-item__label"
>
Sales tax 20%
</span>
<div
class="wc-block-components-totals-item__description"
/>
</div>
Sales tax 20%
</span>
<span
class="wc-block-formatted-money-amount wc-block-components-formatted-money-amount wc-block-components-totals-item__value"
>
$6.00
</span>
<div
class="wc-block-components-totals-item__description"
/>
</div>
</div>
<div
class="wc-block-components-totals-item wc-block-components-totals-footer-item"

27
plugins/woocommerce-blocks/packages/checkout/totals/taxes/index.tsx
View File

@ -40,29 +40,38 @@ const TotalsTaxes = ( {
return null;
}
const itemisedTaxItems: ReactElement | null = getSetting(
const showItemisedTaxes = getSetting(
'displayItemizedTaxes',
false
) ? (
<>
{ taxLines.map( ( { name, rate }, i ) => {
) as boolean;
const itemisedTaxItems: ReactElement | null = showItemisedTaxes ? (
<div
className={ classnames(
'wc-block-components-totals-taxes',
className
) }
>
{ taxLines.map( ( { name, rate, price }, i ) => {
const label = `${ name }${
showRateAfterTaxName ? ` ${ rate }` : ''
}`;
return (
<TotalsItem
key={ `tax-line-${ i }` }
className="wc-block-components-totals-taxes__tax-line"
className="wc-block-components-totals-taxes__grouped-rate"
currency={ currency }
label={ label }
value={ null }
value={ parseInt( price, 10 ) }
/>
);
} ) }{ ' ' }
</>
</div>
) : null;
return (
return showItemisedTaxes ? (
itemisedTaxItems
) : (
<>
<TotalsItem
className={ classnames(
@ -72,7 +81,7 @@ const TotalsTaxes = ( {
currency={ currency }
label={ __( 'Taxes', 'woo-gutenberg-products-block' ) }
value={ parseInt( totalTax, 10 ) }
description={ itemisedTaxItems }
description={ null }
/>
</>
);

14
plugins/woocommerce-blocks/packages/checkout/totals/taxes/style.scss
View File

@ -1,6 +1,10 @@
.wc-block-components-totals-item__description
.wc-block-components-totals-item.wc-block-components-totals-taxes__tax-line {
padding: 0;
@include font-size(small);
margin: $gap-smallest / 2;
.wc-block-components-totals-item.wc-block-components-totals-taxes__grouped-rate {
margin: $gap-smallest 0;
&:first-child {
margin-top: 0;
}
&:last-child {
margin-bottom: 0;
}
}