71 lines
1.4 KiB
TypeScript
71 lines
1.4 KiB
TypeScript
/**
|
|
* External dependencies
|
|
*/
|
|
import classnames from 'classnames';
|
|
import { __ } from '@wordpress/i18n';
|
|
import { getSetting } from '@woocommerce/settings';
|
|
import type { CartFeeItem, Currency } from '@woocommerce/types';
|
|
import type { ReactElement } from 'react';
|
|
|
|
/**
|
|
* Internal dependencies
|
|
*/
|
|
import TotalsItem from '../item';
|
|
|
|
export interface TotalsFeesProps {
|
|
/**
|
|
* Currency
|
|
*/
|
|
currency: Currency;
|
|
/**
|
|
* Cart fees
|
|
*/
|
|
cartFees: CartFeeItem[];
|
|
/**
|
|
* Component wrapper classname
|
|
*
|
|
* @default 'wc-block-components-totals-fees'
|
|
*/
|
|
className?: string;
|
|
}
|
|
|
|
const TotalsFees = ( {
|
|
currency,
|
|
cartFees,
|
|
className,
|
|
}: TotalsFeesProps ): ReactElement | null => {
|
|
return (
|
|
<>
|
|
{ cartFees.map( ( { id, key, name, totals }, index ) => {
|
|
const feesValue = parseInt( totals.total, 10 );
|
|
|
|
if ( ! feesValue ) {
|
|
return null;
|
|
}
|
|
|
|
const feesTaxValue = parseInt( totals.total_tax, 10 );
|
|
|
|
return (
|
|
<TotalsItem
|
|
key={ id || `${ index }-${ name }` }
|
|
className={ classnames(
|
|
'wc-block-components-totals-fees',
|
|
'wc-block-components-totals-fees__' + key,
|
|
className
|
|
) }
|
|
currency={ currency }
|
|
label={ name || __( 'Fee', 'woocommerce' ) }
|
|
value={
|
|
getSetting( 'displayCartPricesIncludingTax', false )
|
|
? feesValue + feesTaxValue
|
|
: feesValue
|
|
}
|
|
/>
|
|
);
|
|
} ) }
|
|
</>
|
|
);
|
|
};
|
|
|
|
export default TotalsFees;
|