[통합로그API No.24] MyOrder 페이지에서 주문취소를 하였을때 해당 사유와 상품 정보 로그 수집

com.twin.app.shoptime/src/utils/Config.js

@@ -602,6 +602,7 @@ export const LOG_CONTEXT_NAME = {
   THEME_CURATION: "shoptime.themeCuration",
   CATEGORY: "shoptime.category",
   ENTRY: "shoptime.entry",
+  MYORDER: "shoptime.myorder",
 };
 
 export const LOG_MESSAGE_ID = {
@@ -616,6 +617,7 @@ export const LOG_MESSAGE_ID = {
   SMB: "AL_SBM",
   GNB: "AL_GNB_CLICK",
   BUTTONCLICK: "AL_BUTTON_CLICK",
+  BUTTON_CANCEL: "AL_BUTTON_CANCEL",
   TOGGLE_CLICK: "AL_TOGGLE_CLICK",
   MYPAGE_DELETE: "AL_MYPAGE_DELETE",
   MYPAGE_CLICK: "AL_MYPAGE_CLICK",

com.twin.app.shoptime/src/views/MyPagePanel/MyPageSub/MyOrders/MyOrders.jsx

@@ -144,7 +144,8 @@ export default function MyOrders({ title, panelInfo, isOnTop }) {
     panelInfo.dropDownTab ? panelInfo.dropDownTab : 0
   );
   const [styleChange, setStyleChange] = useState(false);
-
+  const [selectedCancelItem, setSelectedCancelItem] = useState(null);
+  const [cancelReason, setCancelReason] = useState("");
   const listContainerRef = useRef(null);
   const tabRef = usePrevious(selectedTab);
   const dropDownTabRef = usePrevious(dropDownTab);
@@ -440,6 +441,8 @@ export default function MyOrders({ title, panelInfo, isOnTop }) {
         })
       );
 
+      setCancelReason(detailCdNm);
+
       setTimeout(() => {
         Spotlight.focus("tPopupBtn2");
       }, 0);
@@ -470,10 +473,24 @@ export default function MyOrders({ title, panelInfo, isOnTop }) {
     const { reqChngRsn: reqRsn } = params;
     const reqTpNm = "Cancel";
 
+    const { prdtId, prdtNm, brndNm } = selectedCancelItem;
+
     dispatch(setHidePopup());
     dispatch(paymentTotalCancel(params, moveToCancelTab));
     dispatch(sendLogOrderChange({ reqRsn, reqTpNm }));
-  }, [dispatch, popup, moveToCancelTab]);
+
+    if (selectedCancelItem)
+      dispatch(
+        sendLogTotalRecommend({
+          contextName: Config.LOG_CONTEXT_NAME.MYORDER,
+          messageId: Config.LOG_MESSAGE_ID.BUTTON_CANCEL,
+          productId: prdtId,
+          productTitle: prdtNm,
+          brand: brndNm,
+          reason: cancelReason,
+        })
+      );
+  }, [dispatch, popup, selectedCancelItem, moveToCancelTab]);
 
   useEffect(() => {
     Spotlight.focus();
@@ -581,6 +598,7 @@ export default function MyOrders({ title, panelInfo, isOnTop }) {
                         key={"order" + index}
                         onClickBuyAgain={onClickBuyAgain}
                         doSendLogOrderBtnClick={doSendLogOrderBtnClick}
+                        setSelectedCancelItem={setSelectedCancelItem}
                       />
                     ))
                   ) : (
@@ -594,6 +612,7 @@ export default function MyOrders({ title, panelInfo, isOnTop }) {
                       onClickBuyAgain={onClickBuyAgain}
                       cancelItem={true}
                       doSendLogOrderBtnClick={doSendLogOrderBtnClick}
+                      setSelectedCancelItem={setSelectedCancelItem}
                     />
                   ))
                 ) : (

com.twin.app.shoptime/src/views/MyPagePanel/MyPageSub/MyOrders/components/OrderListCard.jsx

@@ -25,6 +25,7 @@ export default memo(function OrderListCard({
   onClickBuyAgain,
   cancelItem = false,
   doSendLogOrderBtnClick,
+  setSelectedCancelItem,
 }) {
   const {
     ordNo,
@@ -86,6 +87,7 @@ export default memo(function OrderListCard({
         doSendLogOrderBtnClick={doSendLogOrderBtnClick}
         ordNo={ordNo}
         mbrNo={mbrNo}
+        setSelectedCancelItem={setSelectedCancelItem}
       />
     </OrderListCardContainer>
   );

com.twin.app.shoptime/src/views/MyPagePanel/MyPageSub/MyOrders/components/OrderListCardStatus.jsx

@@ -42,6 +42,7 @@ export default function OrderListCardStatus({
   onClickBuyAgain,
   cancelItem,
   doSendLogOrderBtnClick,
+  setSelectedCancelItem,
   ordNo,
   mbrNo,
 }) {
@@ -67,6 +68,7 @@ export default function OrderListCardStatus({
     invTrceId,
     dlvrMeth,
     deliveryUrl,
+    brndNm,
   } = orderProductInfo || {};
 
   const {
@@ -117,16 +119,18 @@ export default function OrderListCardStatus({
         { reasonTpCd: ITEM_STATUS_TYPE.cancel },
         () => {
           dispatch(
-            setShowPopup(Config.ACTIVE_POPUP.orderCancelPopup, { data: ordNo })
+            setShowPopup(Config.ACTIVE_POPUP.orderCancelPopup, {
+              data: ordNo,
+            })
           );
         }
       )
     );
-
+    setSelectedCancelItem(orderProductInfo);
     if (doSendLogOrderBtnClick) {
       doSendLogOrderBtnClick(LOG_STRING_CONF.CANCEL_ITEM);
     }
-  }, [dispatch, doSendLogOrderBtnClick]);
+  }, [dispatch, doSendLogOrderBtnClick, setSelectedCancelItem]);
 
   function showDetailPopup(response) {
     if (response) {