Selaa lähdekoodia

redux cartDetail 数据类型优化

fogwind 15 tuntia sitten
vanhempi
commit
0e33910614

+ 32 - 17
src/graphql/cart/mutations/AddProductToCart.ts

@@ -1,6 +1,7 @@
-import { gql } from "@apollo/client";
+import { gql, TypedDocumentNode } from "@apollo/client";
+import { AddToCartData } from "@/types/cart/type";
 
-export const CREATE_ADD_PRODUCT_IN_CART = gql`
+export const CREATE_ADD_PRODUCT_IN_CART: TypedDocumentNode<AddToCartData> = gql`
   mutation createAddProductInCart(
     $cartId: Int
     $productId: Int!
@@ -18,11 +19,11 @@ export const CREATE_ADD_PRODUCT_IN_CART = gql`
       addProductInCart {
         id
         cartToken
-        subtotal
-        taxAmount
-        subtotal
-        shippingAmount
-        grandTotal
+        sessionToken
+        appliedTaxes
+        itemsQty
+        isGuest
+        itemsCount
         items {
           edges {
             node {
@@ -30,8 +31,8 @@ export const CREATE_ADD_PRODUCT_IN_CART = gql`
               cartId
               productId
               name
-               price
-               baseImage
+              price
+              baseImage
               sku
               quantity
               type
@@ -40,16 +41,30 @@ export const CREATE_ADD_PRODUCT_IN_CART = gql`
             }
           }
         }
-        success
-        message
-        sessionToken
-        isGuest
-        itemsQty
-        itemsCount
-        paymentMethod
-        paymentMethodTitle
+        subtotal
+        subTotalInclTax
+        discountAmount
+        taxAmount
+        taxTotal
+        shippingAmount
+        shippingAmountInclTax
+        grandTotal
+        formattedSubtotal
+        formattedSubTotalInclTax
+        formattedDiscountAmount
+        formattedTaxAmount
+        formattedTaxTotal
+        formattedShippingAmount
+        formattedShippingAmountInclTax
+        formattedGrandTotal
+        couponCode
         selectedShippingRate
         selectedShippingRateTitle
+        paymentMethod
+        paymentMethodTitle
+        haveStockableItems
+        success
+        message
       }
     }
   }

+ 30 - 12
src/graphql/cart/mutations/CreateMergeCart.ts

@@ -1,6 +1,7 @@
-import { gql } from "@apollo/client";
+import { gql, TypedDocumentNode } from "@apollo/client";
+import { CreateMergeCartData } from "@/types/cart/type";
 
-export const CREATE_MERGE_CART = gql`
+export const CREATE_MERGE_CART: TypedDocumentNode<CreateMergeCartData> = gql`
   mutation createMergeCart(
     $cartId: Int!
   ) {
@@ -11,15 +12,10 @@ export const CREATE_MERGE_CART = gql`
     ) {
       mergeCart {
         id
+        appliedTaxes
         itemsQty
-        taxAmount
-        subtotal
-        shippingAmount
-        grandTotal
-        paymentMethod
-        paymentMethodTitle
-        selectedShippingRate
-        selectedShippingRateTitle
+        isGuest
+        itemsCount
         items {
           edges {
             node {
@@ -27,8 +23,8 @@ export const CREATE_MERGE_CART = gql`
               cartId
               productId
               name
-               price
-               baseImage
+              price
+              baseImage
               sku
               quantity
               type
@@ -37,6 +33,28 @@ export const CREATE_MERGE_CART = gql`
             }
           }
         }
+        subtotal
+        subTotalInclTax
+        discountAmount
+        taxAmount
+        taxTotal
+        shippingAmount
+        shippingAmountInclTax
+        grandTotal
+        formattedSubtotal
+        formattedSubTotalInclTax
+        formattedDiscountAmount
+        formattedTaxAmount
+        formattedTaxTotal
+        formattedShippingAmount
+        formattedShippingAmountInclTax
+        formattedGrandTotal
+        couponCode
+        selectedShippingRate
+        selectedShippingRateTitle
+        paymentMethod
+        paymentMethodTitle
+        haveStockableItems
       }
     }
   }

+ 25 - 9
src/graphql/cart/mutations/GetCartItem.ts

@@ -1,19 +1,15 @@
-import { gql } from "@apollo/client";
+import { gql, TypedDocumentNode } from "@apollo/client";
+import { GetCartItemData } from "@/types/cart/type";
 
-export const GET_CART_ITEM = gql`
+export const GET_CART_ITEM: TypedDocumentNode<GetCartItemData> = gql`
   mutation GetCartItem {
     createReadCart(input: {}) {
       readCart {
         id
-        itemsCount
-        taxAmount
-        grandTotal
-        shippingAmount
-        selectedShippingRate
-        selectedShippingRateTitle
-        subtotal
+        appliedTaxes
         itemsQty
         isGuest
+        itemsCount
         items {
           edges {
             node {
@@ -31,8 +27,28 @@ export const GET_CART_ITEM = gql`
             }
           }
         }
+        subtotal
+        subTotalInclTax
+        discountAmount
+        taxAmount
+        taxTotal
+        shippingAmount
+        shippingAmountInclTax
+        grandTotal
+        formattedSubtotal
+        formattedSubTotalInclTax
+        formattedDiscountAmount
+        formattedTaxAmount
+        formattedTaxTotal
+        formattedShippingAmount
+        formattedShippingAmountInclTax
+        formattedGrandTotal
+        couponCode
+        selectedShippingRate
+        selectedShippingRateTitle
         paymentMethod
         paymentMethodTitle
+        haveStockableItems
       }
     }
   }

+ 39 - 25
src/graphql/cart/mutations/RemoveCartItem.ts

@@ -1,41 +1,55 @@
-import { gql } from "@apollo/client";
+import { gql, TypedDocumentNode } from "@apollo/client";
+import { RemoveCartItemData } from "@/types/cart/type";
 
-export const REMOVE_CART_ITEM = gql`
-  mutation RemoveCartItem(
-    $cartItemId: Int!
-  ) {
-    createRemoveCartItem(
-      input: {
-        cartItemId: $cartItemId
-      }
-    ) {
+export const REMOVE_CART_ITEM: TypedDocumentNode<RemoveCartItemData> = gql`
+  mutation RemoveCartItem( $cartItemId: Int! ) {
+    createRemoveCartItem(input: { cartItemId: $cartItemId }) {
       removeCartItem {
-      id
-      cartToken
-       taxAmount
-        shippingAmount
-        subtotal
-        grandTotal
-      items {
-        totalCount
-        edges {
-          node {
-            id
+        id
+        appliedTaxes
+        itemsQty
+        isGuest
+        itemsCount
+        items {
+          edges {
+            node {
+              id
               cartId
               productId
               name
-               price
-               baseImage
+              price
+              baseImage
               sku
               quantity
               type
               productUrlKey
               canChangeQty
+            }
           }
         }
+        subtotal
+        subTotalInclTax
+        discountAmount
+        taxAmount
+        taxTotal
+        shippingAmount
+        shippingAmountInclTax
+        grandTotal
+        formattedSubtotal
+        formattedSubTotalInclTax
+        formattedDiscountAmount
+        formattedTaxAmount
+        formattedTaxTotal
+        formattedShippingAmount
+        formattedShippingAmountInclTax
+        formattedGrandTotal
+        couponCode
+        selectedShippingRate
+        selectedShippingRateTitle
+        paymentMethod
+        paymentMethodTitle
+        haveStockableItems
       }
-        itemsQty
-    }
     }
   }
 `;

+ 28 - 11
src/graphql/cart/mutations/UpdateCartItems.ts

@@ -1,6 +1,7 @@
-import { gql } from "@apollo/client";
+import { gql, TypedDocumentNode } from "@apollo/client";
+import { UpdateCartItemData } from "@/types/cart/type";
 
-export const UPDATE_CART_ITEM = gql
+export const UPDATE_CART_ITEM: TypedDocumentNode<UpdateCartItemData> = gql
   `
   mutation UpdateCartItem(
     $cartItemId: Int!
@@ -14,10 +15,10 @@ export const UPDATE_CART_ITEM = gql
     ) {
       updateCartItem {
         id
-        taxAmount
-        shippingAmount
-        subtotal
-        grandTotal
+        appliedTaxes
+        itemsQty
+        isGuest
+        itemsCount
         items {
           edges {
             node {
@@ -25,8 +26,8 @@ export const UPDATE_CART_ITEM = gql
               cartId
               productId
               name
-               price
-               baseImage
+              price
+              baseImage
               sku
               quantity
               type
@@ -35,12 +36,28 @@ export const UPDATE_CART_ITEM = gql
             }
           }
         }
-        itemsQty
+        subtotal
+        subTotalInclTax
+        discountAmount
+        taxAmount
+        taxTotal
+        shippingAmount
+        shippingAmountInclTax
         grandTotal
-        paymentMethod
-        paymentMethodTitle
+        formattedSubtotal
+        formattedSubTotalInclTax
+        formattedDiscountAmount
+        formattedTaxAmount
+        formattedTaxTotal
+        formattedShippingAmount
+        formattedShippingAmountInclTax
+        formattedGrandTotal
+        couponCode
         selectedShippingRate
         selectedShippingRateTitle
+        paymentMethod
+        paymentMethodTitle
+        haveStockableItems
       }
     }
   }

+ 8 - 0
src/graphql/cart/mutations/readme.md

@@ -0,0 +1,8 @@
+AddProductToCart
+CreateMergeCart
+GetCartItem
+RemoveCartItem
+UpdateCartItems
+
+以上这几个接口返回数据的字段要一样
+因为调完这几个接口后都需要更新redux中的购物车数据

+ 8 - 19
src/store/slices/cart-slice.ts

@@ -1,22 +1,13 @@
 import { AddressDataTypes } from "@/types/types";
 import { PayloadAction, createSlice } from "@reduxjs/toolkit";
-
-export interface Cart {
-  id: string;
-  itemsQty: number;
-  taxAmount: number;
-  shippingAmount: number;
-  grandTotal: number;
-  items: any;
-  paymentMethod: string;
-  paymentMethodTitle: string;
-  // shippingMethod: string; // shippingMethod的值其实与selectedShippingRate的值相等
-  selectedShippingRate: string;
-  selectedShippingRateTitle: string;
-}
+import {CartDetail} from "@/types/cart/type";
+import { 
+    ShipAddressFormData,
+    BillAddressFormData,
+} from "@/types/checkout/type";
 
 interface CartState {
-  cart?: Cart;
+  cart?: CartDetail;
   billingAddress: AddressDataTypes | null;
   shippingAddress: AddressDataTypes | null;
 }
@@ -31,14 +22,12 @@ const cartSlice = createSlice({
   name: "cartDetail",
   initialState,
   reducers: {
-    addItem: (state, action: PayloadAction<Cart>) => {
+    addItem: (state, action: PayloadAction<CartDetail>) => {
       state.cart = { ...action.payload };
     },
-    updateCart: (state, action: PayloadAction<Partial<Cart>>) => {
+    updateCart: (state, action: PayloadAction<Partial<CartDetail>>) => {
       if (state.cart) {
         state.cart = { ...state.cart, ...action.payload };
-      } else {
-        state.cart = action.payload as Cart;
       }
     },
     clearCart(state) {

+ 34 - 170
src/types/cart/type.ts

@@ -18,36 +18,50 @@ export interface CartItemEdge {
   node: CartItem;
 }
 
-// Cart Item Edge for Modal (same structure as CartItemEdge)
-export interface CartItemEdgeForModal {
-  node: CartItem;
-}
-
 // Items connection
 export interface CartItemsConnection {
   edges: CartItemEdge[];
-}
-
-// Read Cart
-export interface ReadCart {
+} 
+// CartDetail
+export interface CartDetail {
   id: string;
+  appliedTaxes: Record<string, string>;
+  itemsQty: number; //Total quantity of all items
+  isGuest: boolean;
   itemsCount: number;
+  items: CartItemsConnection;
+  subtotal: number; // Subtotal before discounts and taxes
+  subTotalInclTax: number;
+  // baseSubtotal: number;
+  discountAmount: number;
+  // baseDiscountAmount: number;
   taxAmount: number;
-  grandTotal: number;
+  taxTotal: number;
   shippingAmount: number;
+  shippingAmountInclTax: number;
+  grandTotal: number;
+
+  formattedSubtotal: string;
+  formattedSubTotalInclTax: string;
+  formattedDiscountAmount: string;
+  formattedTaxAmount: string;
+  formattedTaxTotal: string;
+  formattedShippingAmount: string;
+  formattedShippingAmountInclTax: string;
+  formattedGrandTotal: string;
+  couponCode: string | null;
+  
   selectedShippingRate: string | null;
   selectedShippingRateTitle: string | null;
-  subtotal: number;
-  itemsQty: number;
-  isGuest: boolean;
-  items: CartItemsConnection;
   paymentMethod: string | null;
   paymentMethodTitle: string | null;
+
+  haveStockableItems: boolean;
 }
 
 // createReadCart payload
 export interface CreateReadCart {
-  readCart: ReadCart;
+  readCart: CartDetail;
 }
 
 // Mutation response data
@@ -60,46 +74,11 @@ export interface ReadCartOperation {
 }
 
 // Add Product In Cart
-export interface AddToCartItem {
-  id: string;
-  cartId: string;
-  productId: string;
-  name: string;
-  price: number;
-  baseImage: string | null;
-  sku: string;
-  quantity: number;
-  type: string;
-  productUrlKey: string;
-  canChangeQty: boolean;
-}
-
-export interface AddToCartItemEdge {
-  node: AddToCartItem;
-}
-
-export interface AddToCartItemsConnection {
-  edges: AddToCartItemEdge[];
-}
-
-export interface AddProductInCart {
-  id: string;
+export interface AddProductInCart extends CartDetail {
   cartToken: string;
-  subtotal: number;
-  taxAmount: number;
-  shippingAmount: number;
-  grandTotal: number;
-  itemsQty: number;
-  itemsCount: number;
-  isGuest: boolean;
   sessionToken: string;
   success: boolean;
   message: string;
-  items: AddToCartItemsConnection;
-  paymentMethod: string | null;
-  paymentMethodTitle: string | null;
-  selectedShippingRate: string | null;
-  selectedShippingRateTitle: string | null;
 }
 
 export interface CreateAddProductInCart {
@@ -116,10 +95,6 @@ export interface AddToCartVariables {
   quantity: number;
 }
 
-export interface AddToCartOperation {
-  data: AddToCartData;
-  variables: AddToCartVariables;
-}
 
 // Guest Cart Token
 export interface CartToken {
@@ -147,42 +122,8 @@ export interface CreateCartTokenOperation {
 }
 
 // Merge Cart
-
-export interface MergeCartItem {
-  id: string;
-  cartId: string;
-  productId: string;
-  name: string;
-  price: number;
-  baseImage: string | null;
-  sku: string;
-  quantity: number;
-  type: string;
-  productUrlKey: string;
-  canChangeQty: boolean;
-}
-
-export interface MergeCartItemEdge {
-  node: MergeCartItem;
-}
-export interface MergeCartItemsConnection {
-  edges: MergeCartItemEdge[];
-}
-export interface MergeCart {
-  id: string;
-  itemsQty: number;
-  taxAmount: number;
-  subtotal: number;
-  shippingAmount: number;
-  grandTotal: number;
-  paymentMethod: string | null;
-  paymentMethodTitle: string | null;
-  selectedShippingRate: string | null;
-  selectedShippingRateTitle: string | null;
-  items: MergeCartItemsConnection;
-}
 export interface CreateMergeCartPayload {
-  mergeCart: MergeCart;
+  mergeCart: CartDetail;
 }
 export interface CreateMergeCartData {
   createMergeCart: CreateMergeCartPayload;
@@ -196,42 +137,8 @@ export interface CreateMergeCartOperation {
 }
 
 // Remove Cart Item
-export interface RemoveCartItemNode {
-  id: string;
-  cartId: string;
-  productId: string;
-  name: string;
-  price: number;
-  baseImage: string | null;
-  sku: string;
-  quantity: number;
-  type: string;
-  productUrlKey: string;
-  canChangeQty: boolean;
-}
-
-export interface RemoveCartItemEdge {
-  node: RemoveCartItemNode;
-}
-export interface RemoveCartItemsConnection {
-  totalCount: number;
-  edges: RemoveCartItemEdge[];
-}
-
-export interface RemoveCartItem {
-  id: string;
-  _id: string;
-  cartToken: string;
-  taxAmount: number;
-  shippingAmount: number;
-  subtotal: number;
-  grandTotal: number;
-  itemsQty: number;
-  items: RemoveCartItemsConnection;
-}
-
 export interface CreateRemoveCartItemPayload {
-  removeCartItem: RemoveCartItem;
+  removeCartItem: CartDetail;
 }
 
 export interface RemoveCartItemData {
@@ -242,48 +149,9 @@ export interface RemoveCartItemVariables {
   cartItemId: number;
 }
 
-export interface RemoveCartItemOperation {
-  data: RemoveCartItemData;
-  variables: RemoveCartItemVariables;
-}
-
 // Update Cart Item
-export interface UpdateCartItemNode {
-  id: string;
-  cartId: string;
-  productId: string;
-  name: string;
-  price: number;
-  baseImage: string | null;
-  sku: string;
-  quantity: number;
-  type: string;
-  productUrlKey: string;
-  canChangeQty: boolean;
-}
-
-export interface UpdateCartItemEdge {
-  node: UpdateCartItemNode;
-}
-
-export interface UpdateCartItemsConnection {
-  edges: UpdateCartItemEdge[];
-}
-export interface UpdateCartItem {
-  id: string;
-  taxAmount: number;
-  shippingAmount: number;
-  subtotal: number;
-  grandTotal: number;
-  itemsQty: number;
-  items: UpdateCartItemsConnection;
-  paymentMethod: string | null;
-  paymentMethodTitle: string | null;
-  selectedShippingRate: string | null;
-  selectedShippingRateTitle: string | null;
-}
 export interface CreateUpdateCartItemPayload {
-  updateCartItem: UpdateCartItem;
+  updateCartItem: CartDetail;
 }
 export interface UpdateCartItemData {
   createUpdateCartItem: CreateUpdateCartItemPayload;
@@ -291,8 +159,4 @@ export interface UpdateCartItemData {
 export interface UpdateCartItemVariables {
   cartItemId: number;
   quantity: number;
-}
-export interface UpdateCartItemOperation {
-  data: UpdateCartItemData;
-  variables: UpdateCartItemVariables;
-}
+}

+ 37 - 0
src/utils/cartDetailTools.ts

@@ -0,0 +1,37 @@
+import { CartDetail } from "@/types/cart/type";
+export function formatCartDetail(cart:CartDetail): CartDetail { 
+    return {
+        id: cart.id,
+        appliedTaxes: cart.appliedTaxes,
+        itemsQty: cart.itemsQty,
+        isGuest: cart.isGuest,
+        itemsCount: cart.itemsCount,
+        items: cart.items,
+        subtotal: cart.subtotal,
+        subTotalInclTax: cart.subTotalInclTax,
+        discountAmount: cart.discountAmount,
+        taxAmount: cart.taxAmount,
+        taxTotal: cart.taxTotal,
+        shippingAmount: cart.shippingAmount,
+        shippingAmountInclTax: cart.shippingAmountInclTax,
+        grandTotal: cart.grandTotal,
+    
+        formattedSubtotal: cart.formattedSubtotal,
+        formattedSubTotalInclTax: cart.formattedSubTotalInclTax,
+
+        formattedDiscountAmount: cart.formattedDiscountAmount,
+        formattedTaxAmount: cart.formattedTaxAmount,
+        formattedTaxTotal: cart.formattedTaxTotal,
+        formattedShippingAmount: cart.formattedShippingAmount,
+        formattedShippingAmountInclTax: cart.formattedShippingAmountInclTax,
+        formattedGrandTotal: cart.formattedGrandTotal,
+        couponCode: cart.couponCode,
+
+        selectedShippingRate: cart.selectedShippingRate,
+        selectedShippingRateTitle: cart.selectedShippingRateTitle,
+        paymentMethod: cart.paymentMethod,
+        paymentMethodTitle: cart.paymentMethodTitle,
+    
+        haveStockableItems: cart.haveStockableItems,
+    };
+}

+ 8 - 30
src/utils/hooks/useAddToCart.ts

@@ -14,8 +14,7 @@ import {
   REMOVE_CART_ITEM,
   UPDATE_CART_ITEM,
 } from "@/graphql";
-import { AddToCartData, RemoveCartItemData, UpdateCartItemData } from "@/types/cart/type";
-
+import { formatCartDetail } from "@/utils/cartDetailTools";
 
 
 
@@ -24,7 +23,7 @@ export const useAddProduct = () => {
   const { createGuestToken, resetGuestToken } = useGuestCartToken();
   const { showToast } = useCustomToast();
 
-  const [mutateAsync, { loading: isCartLoading }] = useMutation<AddToCartData>(
+  const [mutateAsync, { loading: isCartLoading }] = useMutation(
     CREATE_ADD_PRODUCT_IN_CART,
     {
       onCompleted: (res) => {
@@ -37,18 +36,7 @@ export const useAddProduct = () => {
         }
         if (responseData) {
           if (responseData.success) {
-            const cartDetail = {
-              id: responseData.id,
-              itemsQty: responseData.itemsQty,
-              taxAmount: responseData.taxAmount,
-              shippingAmount: responseData.shippingAmount,
-              grandTotal: responseData.grandTotal,
-              items: responseData.items,
-              paymentMethod: responseData.paymentMethod || '',
-              paymentMethodTitle: responseData.paymentMethodTitle || '',
-              selectedShippingRate: responseData.selectedShippingRate || '',
-              selectedShippingRateTitle: responseData.selectedShippingRateTitle || '',
-            };
+            const cartDetail = formatCartDetail(responseData);
             dispatch(addItem(cartDetail));
             showToast("Product added to cart successfully", "success");
           }
@@ -102,14 +90,15 @@ export const useAddProduct = () => {
   };
 
   //--------Remove Cart Product Quantity--------//
-  const [removeFromCart, { loading: isRemoveLoading }] = useMutation<RemoveCartItemData>(
+  const [removeFromCart, { loading: isRemoveLoading }] = useMutation(
     REMOVE_CART_ITEM,
     {
       onCompleted: async (response) => {
         const responseData = response?.createRemoveCartItem?.removeCartItem;
         if (isObject(responseData)) {
           const message = "Cart item removed successfully";
-          dispatch(addItem(responseData as any));
+          const cartDetail = formatCartDetail(responseData);
+          dispatch(addItem(cartDetail));
           showToast(message as string, "warning");
 
           if (!responseData?.itemsQty) {
@@ -139,25 +128,14 @@ export const useAddProduct = () => {
   };
 
   //---------Update Cart Product Quantity--------//
-  const [updateCartItem, { loading: isUpdateLoading }] = useMutation<UpdateCartItemData>(
+  const [updateCartItem, { loading: isUpdateLoading }] = useMutation(
     UPDATE_CART_ITEM,
     {
       onCompleted: (response) => {
         const responseData = response?.createUpdateCartItem?.updateCartItem;
 
         if (isObject(responseData)) {
-          const cartDetail = {
-            id: responseData.id,
-            itemsQty: responseData.itemsQty,
-            taxAmount: responseData.taxAmount,
-            shippingAmount: responseData.shippingAmount,
-            grandTotal: responseData.grandTotal,
-            items: responseData.items,
-            paymentMethod: responseData.paymentMethod || '',
-            paymentMethodTitle: responseData.paymentMethodTitle || '',
-            selectedShippingRate: responseData.selectedShippingRate || '',
-            selectedShippingRateTitle: responseData.selectedShippingRateTitle || '',
-          };
+          const cartDetail = formatCartDetail(responseData);
           dispatch(addItem(cartDetail));
         } else {
           showToast("Something went wrong!", "warning");

+ 4 - 17
src/utils/hooks/useCartDetail.ts

@@ -6,8 +6,7 @@ import { addItem } from "@/store/slices/cart-slice";
 import { useCallback, useEffect, useState, useRef } from "react";
 import { GET_CART_ITEM } from "@/graphql";
 import { getCartToken } from "@/utils/getCartToken";
-import { GetCartItemData } from "@/types/cart/type";
-
+import { formatCartDetail } from "@/utils/cartDetailTools";
 
 
 export function useCartDetail() {
@@ -16,30 +15,18 @@ export function useCartDetail() {
   const [isInFlight, setIsInFlight] = useState(false);
   const isInFlightRef = useRef(false);
 
-  const [getCartDetailMutation, { data, loading: isLoading, error }] =
-    useMutation<GetCartItemData>(GET_CART_ITEM, {
+  const [getCartDetailMutation, { data, loading: isLoading, error }] =  useMutation(GET_CART_ITEM, {
       onCompleted: (response) => {
         const cartData = response?.createReadCart?.readCart;
         if (cartData) {
-          const cartDetail = {
-            id: cartData.id,
-            itemsQty: cartData.itemsQty,
-            taxAmount: cartData.taxAmount,
-            shippingAmount: cartData.shippingAmount,
-            grandTotal: cartData.grandTotal,
-            items: cartData.items,
-            paymentMethod: cartData.paymentMethod || '',
-            paymentMethodTitle: cartData.paymentMethodTitle || '',
-            selectedShippingRate: cartData.selectedShippingRate || '',
-            selectedShippingRateTitle: cartData.selectedShippingRateTitle || '',
-          };
+          const cartDetail = formatCartDetail(cartData);
           dispatch(addItem(cartDetail));
         }
       },
       onError: (error) => {
         console.error("Cart detail error:", error);
       },
-    });
+  });
 
   const getCartDetail = useCallback(async () => {
     const token = getCartToken();

+ 3 - 14
src/utils/hooks/useMergeCart.ts

@@ -6,12 +6,12 @@ import { addItem } from "@/store/slices/cart-slice";
 import { CREATE_MERGE_CART } from "@/graphql";
 import { GUEST_CART_ID } from "@/utils/constants";
 import { setCookie } from "@utils/cookie-tools";
-import { CreateMergeCartData } from "@/types/cart/type";
+import { formatCartDetail } from "@/utils/cartDetailTools";
 
 export function useMergeCart() {
   const dispatch = useAppDispatch();
 
-  const [mergeCart, { loading: isLoading }] = useMutation<CreateMergeCartData>(CREATE_MERGE_CART, {
+  const [mergeCart, { loading: isLoading }] = useMutation(CREATE_MERGE_CART, {
     onCompleted: (response) => {
       const responseData = response?.createMergeCart?.mergeCart;
       if (!responseData) {
@@ -22,18 +22,7 @@ export function useMergeCart() {
       if (cartId !== null && typeof cartId !== "undefined") {
         setCookie(GUEST_CART_ID, String(cartId));
       }
-      const cartDetail = {
-        id: responseData.id,
-        itemsQty: responseData.itemsQty,
-        taxAmount: responseData.taxAmount,
-        shippingAmount: responseData.shippingAmount,
-        grandTotal: responseData.grandTotal,
-        items: responseData.items,
-        paymentMethod: responseData.paymentMethod || '',
-        paymentMethodTitle: responseData.paymentMethodTitle || '',
-        selectedShippingRate: responseData.selectedShippingRate || '',
-        selectedShippingRateTitle: responseData.selectedShippingRateTitle || '',
-      };
+      const cartDetail = formatCartDetail(responseData);
 
       dispatch(addItem(cartDetail));
     },