[지라이슈없음] [주문결제] 사이드바에 노출되는 금액 상이

com.twin.app.shoptime/src/views/CheckOutPanel/components/OrderItemCard.jsx

@@ -1,9 +1,11 @@
-import React, { memo } from "react";
+import React, { memo, useMemo } from "react";
+
+import { useSelector } from "react-redux";
 
 import Spottable from "@enact/spotlight/Spottable";
 
 import CustomImage from "../../../components/CustomImage/CustomImage";
-import { $L } from "../../../utils/helperMethods";
+import { $L, formatCurrencyValue } from "../../../utils/helperMethods";
 import css from "./OrderItemCard.module.less";
 
 const OrderItemContainer = Spottable("div");
@@ -18,8 +20,6 @@ export default memo(function OrderItemCard({
   imgUrls,
   prdtNm,
   prodQty,
-  price2,
-  price3,
   prdtOpt,
   patncLogPath,
   prdtId,
@@ -31,6 +31,22 @@ export default memo(function OrderItemCard({
   expsPrdtNo,
   ...rest
 }) {
+  const priceTotalData = useSelector(
+    (state) => state.checkout?.checkoutTotalData
+  );
+
+  const formattedPrices = useMemo(() => {
+    return {
+      discounted: priceTotalData?.totProdPrc
+        ? formatCurrencyValue(priceTotalData?.totProdPrc, currSign, currSignLoc)
+        : "-",
+
+      shipping: priceTotalData?.totDlvrAmt
+        ? formatCurrencyValue(priceTotalData?.totDlvrAmt, currSign, currSignLoc)
+        : "-",
+    };
+  }, [priceTotalData, currSign, currSignLoc]);
+
   return (
     <OrderItemContainer className={css.itemContainer} {...rest}>
       <div className={css.itemHeader}>
@@ -58,14 +74,19 @@ export default memo(function OrderItemCard({
           <p className={css.prodQty}>Qty: {prodQty}</p>
           <p className={css.priceWrap}>
             <span className={css.itemPrice}>
-              {currSignLoc === "L"
-                ? `${currSign} ${price2 || price3}`
-                : `${price2 || price3} ${currSign}`}
+              <span className={css.discountedPrice}>
+                {formattedPrices.discounted}
+              </span>
+              {/* {originalPrice && originalPrice !== discountedPrice && (
+                <span className={css.originalPrice}>
+                  {formattedPrices.original}
+                </span>
+              )} */}
+            </span>
+            <span className={css.shippingPrice}>
+              {`${$L("S&H")}: `}
+              {formattedPrices.shipping}
             </span>
-            {`${$L("S&H")}: `}
-            {currSignLoc === "L"
-              ? `${currSign} ${shippingCharge || 0.0}`
-              : `${shippingCharge || 0.0} ${currSign}`}
             {auctProdYn === "Y" && !auctFinalPriceChgDt && (
               <div className={css.noticeBox}>
                 {$L("Purchased products will be paid at the final price.")}

com.twin.app.shoptime/src/views/CheckOutPanel/container/OrderItemsSideBar.jsx

@@ -7,6 +7,7 @@ import SpotlightContainerDecorator from "@enact/spotlight/SpotlightContainerDeco
 
 import TIConButton from "../../../components/TIconButton/TIconButton";
 import TVirtualGridList from "../../../components/TVirtualGridList/TVirtualGridList";
+import usePriceInfo from "../../../hooks/usePriceInfo";
 import { $L } from "../../../utils/helperMethods";
 import OrderItemCard, { SIZES } from "../components/OrderItemCard";
 import css from "./OrderItemsSideBar.module.less";
@@ -33,8 +34,6 @@ export default function OrderItemsSideBar({ closeSideBar }) {
           imgUrls={item.imgUrls}
           prdtNm={item.prdtNm}
           prodQty={item.prodQty}
-          price2={item.price2}
-          price3={item.price3}
           prdtOpt={item.prdtOpt}
           patncLogPath={item.patncLogPath}
           prdtId={item.prdtId}