diff --git a/packages/venia-ui/lib/components/CartPage/PriceSummary/__tests__/__snapshots__/discountSummary.spec.js.snap b/packages/venia-ui/lib/components/CartPage/PriceSummary/__tests__/__snapshots__/discountSummary.spec.js.snap
index 4d19127097..f2541ae8cb 100644
--- a/packages/venia-ui/lib/components/CartPage/PriceSummary/__tests__/__snapshots__/discountSummary.spec.js.snap
+++ b/packages/venia-ui/lib/components/CartPage/PriceSummary/__tests__/__snapshots__/discountSummary.spec.js.snap
@@ -1,14 +1,38 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
+exports[`renders "Discount applied" label if label data is empty 1`] = `
+Array [
+
+ Discounts applied
+ ,
+
+ -
+
+ $
+
+
+ 1
+
+
+ .
+
+
+ 00
+
+ ,
+]
+`;
+
exports[`renders accumulated discount value 1`] = `
Array [
-
+ Discounts applied
,
+ Rebate
+ ,
+
+ -
+
+ $
+
+
+ 1
+
+
+ .
+
+
+ 00
+
+ ,
+]
+`;
+
exports[`renders discount summary line item correctly 1`] = `
Array [
-
+ Special rebate
,
{
expect(tree.toJSON()).toMatchSnapshot();
});
+
+test('renders discount label value from data ', () => {
+ const props = {
+ ...defaultProps,
+ data: [
+ {
+ amount: {
+ value: 1,
+ currency: 'USD'
+ },
+ label: 'Rebate'
+ }
+ ]
+ };
+ const tree = createTestInstance();
+
+ expect(tree.toJSON()).toMatchSnapshot();
+});
+
+test('renders "Discount applied" label if label data is empty', () => {
+ const props = {
+ ...defaultProps,
+ data: [
+ {
+ amount: {
+ value: 1,
+ currency: 'USD'
+ }
+ }
+ ]
+ };
+ const tree = createTestInstance();
+
+ expect(tree.toJSON()).toMatchSnapshot();
+});
diff --git a/packages/venia-ui/lib/components/CartPage/PriceSummary/discountSummary.js b/packages/venia-ui/lib/components/CartPage/PriceSummary/discountSummary.js
index 3463d98a74..2853684e33 100644
--- a/packages/venia-ui/lib/components/CartPage/PriceSummary/discountSummary.js
+++ b/packages/venia-ui/lib/components/CartPage/PriceSummary/discountSummary.js
@@ -1,5 +1,5 @@
import React, { Fragment } from 'react';
-import { FormattedMessage } from 'react-intl';
+import { useIntl } from 'react-intl';
import Price from '@magento/venia-ui/lib/components/Price';
import { useStyle } from '../../../classify';
@@ -22,6 +22,7 @@ const getDiscount = (discounts = []) => {
return DEFAULT_AMOUNT;
} else {
return {
+ label: discounts[0].label,
currency: discounts[0].amount.currency,
value: discounts.reduce(
(acc, discount) => acc + discount.amount.value,
@@ -40,6 +41,14 @@ const getDiscount = (discounts = []) => {
const DiscountSummary = props => {
const classes = useStyle({}, props.classes);
const discount = getDiscount(props.data);
+ const { formatMessage } = useIntl();
+
+ const label = discount.label
+ ? discount.label
+ : formatMessage({
+ id: 'discountSummary.lineItemLabel',
+ defaultMessage: 'Discounts applied'
+ });
return discount.value ? (
@@ -47,10 +56,7 @@ const DiscountSummary = props => {
className={classes.lineItemLabel}
data-cy="PriceSummary-DiscountSummary-label"
>
-
+ {label}
button) {
background-color: hsl(205 004% 048%) !important;
}
+
+:global(.venia-home-banner-text > div) {
+ flex-direction: unset !important;
+ justify-content: normal !important;
+}
+
+@media (max-width: 960px) {
+ :global(.venia-home-banner-text > div) {
+ flex-direction: column !important;
+ justify-content: center !important;
+ }
+}