Update SummaryCard.Combinations to handle all combinations selected (#90

) * Update SummaryCard.Combinations to handle all combinations selected * Cover all 7 combinations with tests * Include "no combinations" in combinations && include selection in test name * Fix linting errors * Add changeset entry
Shopify · Aug 29, 2023 · 8d41bb8 · 8d41bb8
1 parent 93c8542
commit 8d41bb8
Show file tree

Hide file tree

Showing 4 changed files with 21 additions and 55 deletions.
diff --git a/.changeset/moody-files-rest.md b/.changeset/moody-files-rest.md
@@ -0,0 +1,5 @@
+---
+'@shopify/discount-app-components': patch
+---
+
+Add support for discount stacking in Summary Card.
diff --git a/locales/en.json b/locales/en.json
@@ -216,7 +216,8 @@
           "productAndOrder": "Combines with product and order discounts",
           "productAndShipping": "Combines with product and shipping discounts",
           "orderAndShipping": "Combines with order and shipping discounts"
-        }
+        },
+        "combinesAll": "Combines with product, order, and shipping discounts"
       },
       "CustomerEligibility": {
         "allCustomers": "All customers",

diff --git a/src/components/SummaryCard/components/Combinations/Combinations.tsx b/src/components/SummaryCard/components/Combinations/Combinations.tsx
@@ -42,6 +42,8 @@ function getContent(combinations: DiscountClass[], i18n: I18n) {
         )}`,
         I18N_SCOPE,
       );
+    case 3:
+      return i18n.translate(`combinesAll`, I18N_SCOPE);
     default:
       return '';
   }

diff --git a/src/components/SummaryCard/components/Combinations/tests/Combinations.test.tsx b/src/components/SummaryCard/components/Combinations/tests/Combinations.test.tsx
@@ -3,35 +3,24 @@ import {mountWithApp} from 'tests/utilities';
 
 import {Combinations} from '../Combinations';
 
-import {DiscountClass} from '~/constants';
-
 describe('<Combinations />', () => {
-  it('renders nothing when no combination options are set', () => {
-    const combinations = mountWithApp(
-      <Combinations
-        combinesWith={{
-          orderDiscounts: false,
-          productDiscounts: false,
-          shippingDiscounts: false,
-        }}
-      />,
-    );
-
-    expect(combinations.find(Combinations)).toBeNull();
-  });
-
   it.each`
-    combinesWithProduct | combinesWithOrder | combinesWithShipping | selectedCombinations
-    ${true}             | ${false}          | ${false}             | ${[DiscountClass.Product]}
-    ${false}            | ${true}           | ${false}             | ${[DiscountClass.Order]}
-    ${false}            | ${false}          | ${true}              | ${[DiscountClass.Shipping]}
+    combinesWithProduct | combinesWithOrder | combinesWithShipping | expectedText
+    ${false}            | ${false}          | ${false}             | ${`Can't combine with other discounts`}
+    ${true}             | ${true}           | ${true}              | ${`Combines with product, order, and shipping discounts`}
+    ${true}             | ${true}           | ${false}             | ${`Combines with product and order discounts`}
+    ${true}             | ${false}          | ${true}              | ${`Combines with product and shipping discounts`}
+    ${false}            | ${true}           | ${true}              | ${`Combines with order and shipping discounts`}
+    ${true}             | ${false}          | ${false}             | ${`Combines with product discounts`}
+    ${false}            | ${true}           | ${false}             | ${`Combines with order discounts`}
+    ${false}            | ${false}          | ${true}              | ${`Combines with shipping discounts`}
   `(
-    'renders combination summary when one combination option is set',
+    'renders the summary when combinesWith `product: $combinesWithProduct, order: $combinesWithOrder, shipping: $combinesWithShipping`',
     ({
       combinesWithProduct,
       combinesWithOrder,
       combinesWithShipping,
-      selectedCombinations,
+      expectedText,
     }) => {
       const combinations = mountWithApp(
         <Combinations
@@ -43,38 +32,7 @@ describe('<Combinations />', () => {
         />,
       );
 
-      expect(combinations).toContainReactText(
-        `Combines with ${selectedCombinations[0].toLowerCase()} discounts`,
-      );
-    },
-  );
-
-  it.each`
-    combinesWithProduct | combinesWithOrder | combinesWithShipping | selectedCombinations
-    ${true}             | ${true}           | ${false}             | ${[DiscountClass.Product, DiscountClass.Order]}
-    ${true}             | ${false}          | ${true}              | ${[DiscountClass.Product, DiscountClass.Shipping]}
-    ${false}            | ${true}           | ${true}              | ${[DiscountClass.Order, DiscountClass.Shipping]}
-  `(
-    'renders combination summary when two combination options are set',
-    ({
-      combinesWithProduct,
-      combinesWithOrder,
-      combinesWithShipping,
-      selectedCombinations,
-    }) => {
-      const combinations = mountWithApp(
-        <Combinations
-          combinesWith={{
-            productDiscounts: combinesWithProduct,
-            orderDiscounts: combinesWithOrder,
-            shippingDiscounts: combinesWithShipping,
-          }}
-        />,
-      );
-
-      expect(combinations).toContainReactText(
-        `Combines with ${selectedCombinations[0].toLowerCase()} and ${selectedCombinations[1].toLowerCase()} discounts`,
-      );
+      expect(combinations).toContainReactText(expectedText);
     },
   );
 });