refactor(email-plugin): Update to new Shipping-related API changes

packages/email-plugin/src/default-email-handlers.ts

@@ -22,19 +22,29 @@ export const orderConfirmationHandler = new EmailEventListener('order-confirmati
     .on(OrderStateTransitionEvent)
     .filter(event => event.toState === 'PaymentSettled' && !!event.order.customer)
     .loadData(async context => {
-        let shippingMethod: ShippingMethod | undefined;
-        if (!context.event.order.shippingMethod && context.event.order.shippingMethodId) {
-            shippingMethod = await context.injector
-                .get(TransactionalConnection)
-                .getRepository(ShippingMethod)
-                .findOne(context.event.order.shippingMethodId);
+        const shippingMethods: ShippingMethod[] = [];
+
+        for (const line of context.event.order.shippingLines || []) {
+            let shippingMethod: ShippingMethod | undefined;
+            if (!line.shippingMethod && line.shippingMethodId) {
+                shippingMethod = await context.injector
+                    .get(TransactionalConnection)
+                    .getRepository(ShippingMethod)
+                    .findOne(line.shippingMethodId);
+            } else if (line.shippingMethod) {
+                shippingMethod = line.shippingMethod;
+            }
+            if (shippingMethod) {
+                shippingMethods.push(shippingMethod);
+            }
         }
-        return { shippingMethod };
+
+        return { shippingMethods };
     })
     .setRecipient(event => event.order.customer!.emailAddress)
     .setFrom(`{{ fromAddress }}`)
     .setSubject(`Order confirmation for #{{ order.code }}`)
-    .setTemplateVars(event => ({ order: event.order, shippingMethod: event.data.shippingMethod }))
+    .setTemplateVars(event => ({ order: event.order, shippingMethods: event.data.shippingMethods }))
     .setMockEvent(mockOrderStateTransitionEvent);
 
 export const emailVerificationHandler = new EmailEventListener('email-verification')

packages/email-plugin/src/mock-events.ts

@@ -83,12 +83,19 @@ export const mockOrderStateTransitionEvent = new OrderStateTransitionEvent(
         subTotal: 15144,
         subTotalWithTax: 18173,
         shipping: 1000,
-        shippingMethod: {
-            code: 'express-flat-rate',
-            name: 'Express Shipping',
-            description: 'Express Shipping',
-            id: '2',
-        },
+        shippingLines: [
+            {
+                listPrice: 1000,
+                listPriceIncludesTax: true,
+                taxLines: [{ taxRate: 20, description: 'shipping tax' }],
+                shippingMethod: {
+                    code: 'express-flat-rate',
+                    name: 'Express Shipping',
+                    description: 'Express Shipping',
+                    id: '2',
+                },
+            },
+        ],
         shippingAddress: {
             fullName: 'Test Customer',
             company: '',

packages/email-plugin/templates/order-confirmation/body.hbs

@@ -114,15 +114,17 @@
             {{/each}}
             <tr class="order-row">
                 <td colspan="3">Sub-total:</td>
-                <td>${{ formatMoney order.subTotal }}</td>
+                <td>${{ formatMoney order.subTotalWithTax }}</td>
             </tr>
+            {{#each shippingMethods }}
             <tr class="order-row">
-                <td colspan="3">Shipping ({{ shippingMethod.name }}):</td>
-                <td>${{ formatMoney order.shipping }}</td>
+                <td colspan="3">Shipping ({{ name }}):</td>
+                <td>${{ formatMoney priceWithTax }}</td>
             </tr>
+            {{/each}}
             <tr class="order-row total-row">
                 <td colspan="3">Total:</td>
-                <td>${{ formatMoney order.total }}</td>
+                <td>${{ formatMoney order.totalWithTax }}</td>
             </tr>
         </mj-table>
     </mj-column>