✨ feat: useGetActiveOrderForCheckout

:%s

framework/commerce/types/cart.ts

@@ -1,5 +1,5 @@
-import { Shipping } from 'src/components/icons';
-import type { Discount, Measurement, Image } from './common'
+import { ShippingMethod } from '@framework/schema';
+import type { Discount, Image, Measurement } from './common';
 
 export type SelectedOption = {
   // The option's id.
@@ -60,6 +60,31 @@ export type ProductVariant = {
 
 // Shopping cart, a.k.a Checkout
 export type Cart = {
+  id: string
+  // ID of the customer to which the cart belongs.
+  customerId?: string
+  // The email assigned to this cart
+  email?: string
+  // The date and time when the cart was created.
+  createdAt: string
+  // The currency used for this cart
+  currency: { code: string }
+  // Specifies if taxes are included in the line items.
+  taxesIncluded: boolean
+  lineItems: LineItem[]
+  // The sum of all the prices of all the items in the cart.
+  // Duties, taxes, shipping and discounts excluded.
+  lineItemsSubtotalPrice: number
+  // Price of the cart before duties, shipping and taxes.
+  subtotalPrice: number
+  // The sum of all the prices of all the items in the cart.
+  // Duties, taxes and discounts included.
+  totalPrice: number
+  // Discounts that have been applied on the cart.
+  discounts?: Discount[]
+}
+
+export type CartCheckout = {
   id: string
   // ID of the customer to which the cart belongs.
   customerId?: string
@@ -97,6 +122,10 @@ export type Cart = {
   // Discounts that have been applied on the cart.
   discounts?: Discount[]
   totalDiscount: number
+  shippingLine: {
+    priceWithTax: number
+    shippingMethod: ShippingMethod
+  }
 }
 
 /**

framework/vendure/schema.d.ts

@@ -3066,6 +3066,11 @@ export type CartFragment = { __typename?: 'Order' } & Pick<
     { __typename?: 'Discount' } & Pick<Discount, 'type' | 'description' | 'amount' | 'amountWithTax'>
   >
   customer?: Maybe<{ __typename?: 'Customer' } & Pick<Customer, 'id' | 'firstName' | 'lastName' | 'emailAddress'>>
+  shippingLines: Array<
+        Pick<ShippingLine, 'priceWithTax'> & {
+            shippingMethod: Pick<ShippingMethod, 'id' | 'code' | 'name' | 'description'>;
+        }
+    >
   lines: Array<
     { __typename?: 'OrderLine' } & Pick<
       OrderLine,

framework/vendure/utils/fragments/cart-fragment.ts

@@ -9,25 +9,8 @@ export const cartFragment = /* GraphQL */ `
     total
     totalWithTax
     currencyCode
-    discounts {
-      type
-      description
-      amount
-      amountWithTax
-    }
     customer {
       id
-      firstName
-      lastName
-      emailAddress
-    }
-    shippingAddress {
-      streetLine1
-      city
-      province
-      postalCode
-      countryCode
-      phoneNumber
     }
     lines {
       id

framework/vendure/utils/normalize.ts

@@ -1,6 +1,6 @@
-import { Cart } from '@commerce/types/cart'
-import { ProductCard, Product } from '@commerce/types/product'
-import { CartFragment, SearchResultFragment, Favorite } from '../schema'
+import { Cart, CartCheckout } from '@commerce/types/cart'
+import { Product, ProductCard } from '@commerce/types/product'
+import { CartFragment, Favorite, SearchResultFragment, ShippingMethod } from '../schema'
 
 export function normalizeSearchResult(item: SearchResultFragment): ProductCard {
   return {
@@ -36,6 +36,41 @@ export function normalizeFavoriteProductResult(item: Favorite) {
 
 
 export function normalizeCart(order: CartFragment): Cart {
+  return {
+    id: order.id.toString(),
+    createdAt: order.createdAt,
+    taxesIncluded: true,
+    lineItemsSubtotalPrice: order.subTotalWithTax / 100,
+    currency: { code: order.currencyCode },
+    subtotalPrice: order.subTotalWithTax / 100,
+    totalPrice: order.totalWithTax / 100,
+    customerId: order.customer?.id,
+    lineItems: order.lines?.map((l) => ({
+      id: l.id,
+      name: l.productVariant.name,
+      quantity: l.quantity,
+      slug: l.productVariant.product.slug,
+      variantId: l.productVariant.id,
+      productId: l.productVariant.productId,
+      images: [{ url: l.featuredAsset?.preview + '?preset=thumb' || '' }],
+      discounts: l.discounts.map((d) => ({ value: d.amount / 100 })),
+      path: '',
+      variant: {
+        id: l.productVariant.id,
+        name: l.productVariant.name,
+        sku: l.productVariant.sku,
+        price: l.discountedUnitPriceWithTax / 100,
+        listPrice: l.unitPriceWithTax / 100,
+        image: {
+          url: l.featuredAsset?.preview + '?preset=thumb' || '',
+        },
+        requiresShipping: true,
+      },
+    })),
+  }
+}
+
+export function normalizeCartForCheckout(order: CartFragment): CartCheckout {
   return {
     id: order.id.toString(),
     createdAt: order.createdAt,
@@ -59,6 +94,10 @@ export function normalizeCart(order: CartFragment): Cart {
       countryCode: order.shippingAddress?.countryCode || '',
       phoneNumber: order.shippingAddress?.phoneNumber || '',
     },
+    shippingLine: {
+      priceWithTax: order.shippingLines[0].priceWithTax,
+      shippingMethod: order.shippingLines[0].shippingMethod as ShippingMethod
+    },
     totalDiscount: order.discounts?.reduce((total, item) => total + item.amountWithTax, 0) / 100 || 0,
     discounts: order.discounts.map(item => {
       return { value: item.amountWithTax, description: item.description }

framework/vendure/utils/queries/active-order-for-checkout-query.ts

@@ -0,0 +1,116 @@
+export const getActiveOrderForCheckoutQuery = /* GraphQL */ `
+query getActiveOrderForCheckout {
+  activeOrder {
+    ...Cart
+    shippingAddress {
+      ...OrderAddress
+      __typename
+    }
+    __typename
+  }
+}
+
+fragment Cart on Order {
+  id
+  code
+  state
+  active
+  customer {
+    id
+    firstName
+    lastName
+    emailAddress
+  }
+  lines {
+    id
+    featuredAsset {
+      ...Asset
+      __typename
+    }
+    unitPrice
+    unitPriceWithTax
+    quantity
+    linePriceWithTax
+    discountedLinePriceWithTax
+    unitPriceWithTax
+    discountedUnitPriceWithTax
+    productVariant {
+      id
+      name
+      price
+      priceWithTax
+      stockLevel
+      productId
+      product {
+          slug
+        }
+      __typename
+    }
+    discounts {
+      amount
+      amountWithTax
+      description
+      adjustmentSource
+      type
+      __typename
+    }
+    __typename
+  }
+  totalQuantity
+  subTotal
+  subTotalWithTax
+  total
+  totalWithTax
+  shipping
+  shippingWithTax
+  currencyCode
+  shippingLines {
+    priceWithTax
+    shippingMethod {
+      id
+      code
+      name
+      description
+      __typename
+    }
+    __typename
+  }
+  discounts {
+    amount
+    amountWithTax
+    description
+    adjustmentSource
+    type
+    __typename
+  }
+  __typename
+}
+
+fragment Asset on Asset {
+  id
+  width
+  height
+  name
+  preview
+  focalPoint {
+    x
+    y
+    __typename
+  }
+  __typename
+}
+
+fragment OrderAddress on OrderAddress {
+  fullName
+  company
+  streetLine1
+  streetLine2
+  city
+  province
+  postalCode
+  country
+  phoneNumber
+  __typename
+}
+`
+