feat(payment): PAYPAL-4935 added CartActionCreator for handling/storing cart information

Author: bc-nick

packages/core/src/cart/cart-action-creator.ts

@@ -0,0 +1,42 @@
+import { createAction, createErrorAction, ThunkAction } from '@bigcommerce/data-store';
+import { Observable, Observer } from 'rxjs';
+
+import { RequestOptions } from '@bigcommerce/checkout-sdk/payment-integration-api';
+
+import { InternalCheckoutSelectors } from '../checkout';
+import { cachableAction } from '../common/data-store';
+import ActionOptions from '../common/data-store/action-options';
+
+import { CartActionType, LoadCartAction } from './cart-actions';
+import CartRequestSender from './cart-request-sender';
+
+export default class CartActionCreator {
+    constructor(private _cartRequestSender: CartRequestSender) {}
+
+    @cachableAction
+    loadCard(
+        cartId: string,
+        options?: RequestOptions & ActionOptions,
+    ): ThunkAction<LoadCartAction, InternalCheckoutSelectors> {
+        return (store) => {
+            return Observable.create((observer: Observer<LoadCartAction>) => {
+                const state = store.getState();
+                const host = state.config.getHost();
+
+                observer.next(createAction(CartActionType.LoadCartRequested, undefined));
+
+                this._cartRequestSender
+                    .loadCard(cartId, host, options)
+                    .then((response) => {
+                        observer.next(
+                            createAction(CartActionType.LoadCartSucceeded, response.body),
+                        );
+                        observer.complete();
+                    })
+                    .catch((response) => {
+                        observer.error(createErrorAction(CartActionType.LoadCartFailed, response));
+                    });
+            });
+        };
+    }
+}

packages/core/src/cart/cart-actions.ts

@@ -0,0 +1,26 @@
+import { Action } from '@bigcommerce/data-store';
+
+import Cart from './cart';
+
+export enum CartActionType {
+    LoadCartRequested = 'LOAD_CART_REQUESTED',
+    LoadCartSucceeded = 'LOAD_CART_SUCCEEDED',
+    LoadCartFailed = 'LOAD_CART_FAILED',
+}
+
+export type LoadCartAction =
+    | LoadCartRequestedAction
+    | LoadCartSucceededAction
+    | LoadCartFailedAction;
+
+export interface LoadCartRequestedAction extends Action {
+    type: CartActionType.LoadCartRequested;
+}
+
+export interface LoadCartSucceededAction extends Action<Cart> {
+    type: CartActionType.LoadCartSucceeded;
+}
+
+export interface LoadCartFailedAction extends Action<Error> {
+    type: CartActionType.LoadCartFailed;
+}

packages/core/src/cart/cart-reducer.ts

@@ -13,6 +13,7 @@ import {
 import { ConsignmentAction, ConsignmentActionType } from '../shipping';
 
 import Cart from './cart';
+import { CartActionType, LoadCartAction } from './cart-actions';
 import CartState, { CartErrorsState, CartStatusesState, DEFAULT_STATE } from './cart-state';
 
 export default function cartReducer(state: CartState = DEFAULT_STATE, action: Action): CartState {
@@ -32,7 +33,8 @@ function dataReducer(
         | CheckoutAction
         | ConsignmentAction
         | CouponAction
-        | GiftCertificateAction,
+        | GiftCertificateAction
+        | LoadCartAction,
 ): Cart | undefined {
     switch (action.type) {
         case BillingAddressActionType.UpdateBillingAddressSucceeded:
@@ -48,6 +50,9 @@ function dataReducer(
         case GiftCertificateActionType.RemoveGiftCertificateSucceeded:
             return objectMerge(data, action.payload && action.payload.cart);
 
+        case CartActionType.LoadCartSucceeded:
+            return objectMerge(data, action.payload && action.payload);
+
         default:
             return data;
     }

packages/core/src/cart/cart-request-sender.ts

@@ -4,6 +4,8 @@ import { BuyNowCartRequestBody, Cart } from '@bigcommerce/checkout-sdk/payment-i
 
 import { ContentType, RequestOptions, SDK_VERSION_HEADERS } from '../common/http-request';
 
+import { HeadlessCartRequestResponse, mapToCart } from './headless-cart';
+
 export default class CartRequestSender {
     constructor(private _requestSender: RequestSender) {}
 
@@ -19,4 +21,41 @@ export default class CartRequestSender {
 
         return this._requestSender.post(url, { body, headers, timeout });
     }
+
+    async loadCard(
+        cartId: string,
+        host?: string,
+        options?: RequestOptions,
+    ): Promise<Response<Cart>> {
+        const path = 'cart-information';
+        const url = host ? `${host}/${path}` : `/${path}`;
+
+        const requestOptions: RequestOptions = {
+            ...options,
+            params: {
+                cartId,
+            },
+        };
+
+        return this._requestSender
+            .get<HeadlessCartRequestResponse>(url, {
+                ...requestOptions,
+            })
+            .then(this.transformToCartResponse);
+    }
+
+    private transformToCartResponse(
+        response: Response<HeadlessCartRequestResponse>,
+    ): Response<Cart> {
+        const {
+            body: {
+                data: { site },
+            },
+        } = response;
+
+        return {
+            ...response,
+            body: mapToCart(site),
+        };
+    }
 }

packages/core/src/cart/headless-cart/headless-cart-request-response.ts

@@ -0,0 +1,7 @@
+import HeadlessCartResponse from './headless-cart';
+
+export interface HeadlessCartRequestResponse {
+    data: {
+        site: HeadlessCartResponse;
+    };
+}

packages/core/src/cart/headless-cart/headless-cart.ts

@@ -0,0 +1,135 @@
+interface BaseFieldFragment {
+    value: number;
+}
+
+export interface HeadlessLineItem {
+    name: string;
+    entityId: string;
+    quantity: number;
+    productEntityId: number;
+    brand: string;
+    // parentEntityId: number;
+    couponAmount: {
+        value: number;
+    };
+    discountedAmount: {
+        value: number;
+    };
+    discounts: Array<{
+        discountedAmount: {
+            value: number;
+        };
+        entityId: string;
+    }>;
+    extendedListPrice: {
+        value: number;
+    };
+    extendedSalePrice: {
+        value: number;
+    };
+    imageUrl: string;
+    isTaxable: boolean;
+    listPrice: {
+        value: number;
+    };
+    originalPrice: {
+        value: number;
+    };
+    salePrice: {
+        value: number;
+    };
+    sku: string;
+    url: string;
+    variantEntityId: number;
+    selectedOptions: Array<{
+        __typename: string;
+        value: string;
+        valueEntityId: number;
+        entityId: number;
+        name: string;
+    }>;
+}
+
+interface HeadlessPhysicalItem extends HeadlessLineItem {
+    isShippingRequired: boolean;
+    giftWrapping?: {
+        amount: {
+            value: number;
+        };
+        message: string;
+        name: string;
+    } | null;
+}
+
+interface HeadlessDigitalItem extends HeadlessLineItem {
+    // these fields can be optional because I did not see them in response
+    downloadFileUrls: string[];
+    downloadPageUrl: string;
+    downloadSize: string;
+}
+
+export interface HeadlessCustomItem {
+    entityId: string;
+    listPrice: BaseFieldFragment;
+    extendedListPrice: BaseFieldFragment;
+    name: string;
+    quantity: number;
+    sku: string;
+}
+
+export interface HeadlessGiftCertificates {
+    amount: BaseFieldFragment;
+    name: string;
+    theme: string;
+    entityId: string | number;
+    isTaxable: boolean;
+    message: string;
+    sender: {
+        email: string;
+        name: string;
+    };
+    recipient: {
+        email: string;
+        name: string;
+    };
+}
+
+export interface HeadlessLineItems {
+    physicalItems: HeadlessPhysicalItem[];
+    digitalItems: HeadlessDigitalItem[];
+    customItems: HeadlessCustomItem[];
+    giftCertificates?: HeadlessGiftCertificates[];
+}
+
+export default interface HeadlessCartResponse {
+    cart: {
+        amount: BaseFieldFragment; // cart amount;
+        baseAmount: BaseFieldFragment;
+        entityId: string;
+        id: string;
+        createdAt: {
+            utc: string;
+        };
+        updatedAt: {
+            utc: string;
+        };
+        discounts: Array<{
+            discountedAmount: BaseFieldFragment;
+            entityId: string;
+        }>;
+        discountedAmount: BaseFieldFragment;
+        isTaxIncluded: boolean;
+        currencyCode: string;
+        lineItems: HeadlessLineItems;
+    };
+    checkout: {
+        coupons: Array<{
+            entityId: string;
+            code: string;
+            couponType: string;
+            discountedAmount: {
+                value: number;
+            };
+        }>;
+    };
+}

packages/core/src/cart/headless-cart/index.ts

@@ -0,0 +1,3 @@
+export { default as HeadlessCartResponse } from './headless-cart';
+export { default as mapToCart } from './map-to-cart';
+export { HeadlessCartRequestResponse } from './headless-cart-request-response';

packages/core/src/cart/headless-cart/map-to-cart-line-item.ts

@@ -0,0 +1,62 @@
+import { LineItem } from '../line-item';
+
+import { HeadlessLineItem } from './headless-cart';
+
+export default function mapToLineItem(lineItem: HeadlessLineItem): LineItem {
+    const {
+        entityId,
+        name,
+        quantity,
+        productEntityId,
+        brand,
+        couponAmount,
+        discountedAmount,
+        discounts,
+        extendedListPrice,
+        extendedSalePrice,
+        imageUrl,
+        isTaxable,
+        listPrice,
+        salePrice,
+        sku,
+        url,
+        variantEntityId,
+        selectedOptions,
+    } = lineItem;
+
+    return {
+        id: entityId,
+        name,
+        quantity,
+        productId: productEntityId,
+        brand,
+        couponAmount: couponAmount.value,
+        discountAmount: discountedAmount.value,
+        discounts: discounts.map((discount) => ({
+            discountedAmount: discount.discountedAmount.value,
+            // TODO:: discount item does not have name field in response body when making request using REST API, but there is name in interface, for a while set name as entityID
+            name: discount.entityId,
+        })),
+        extendedListPrice: extendedListPrice.value,
+        extendedSalePrice: extendedSalePrice.value,
+        imageUrl,
+        isTaxable,
+        listPrice: listPrice.value,
+        salePrice: salePrice.value,
+        sku,
+        url,
+        variantId: variantEntityId,
+        options: selectedOptions?.map((option) => ({
+            name: option.name,
+            nameId: option.entityId,
+            value: option.value,
+            valueId: option.valueEntityId,
+        })),
+
+        // TODO:: we do not have any information regarding to fields below in the GraphQL Storefront doc
+        addedByPromotion: false,
+        comparisonPrice: 0,
+        extendedComparisonPrice: 0,
+        retailPrice: 0,
+    };
+}