From dccaa9e2baacc0189ee5f6e1c366ed1e3e5c76dc Mon Sep 17 00:00:00 2001 From: yonghyon Date: Mon, 7 Oct 2024 11:25:09 +0900 Subject: [PATCH] =?UTF-8?q?[SHOPTIME-3399]=20Theme=20Detail=20/=20?= =?UTF-8?q?=EC=82=AC=EB=B0=A9=ED=96=A5=ED=82=A4=EB=A1=9C=20=EC=B2=AB?= =?UTF-8?q?=EB=B2=88=EC=A7=B8=20item=20=ED=81=B4=EB=A6=AD=EC=8B=9C=20Shop?= =?UTF-8?q?=20By=20Mobile=20=EB=B2=84=EC=BB=A8=EC=9C=BC=EB=A1=9C=20?= =?UTF-8?q?=ED=8F=AC=EC=BB=A4=EC=8B=B1,=20=EB=91=90=EB=B2=88=EC=A7=B8=20it?= =?UTF-8?q?em=20=ED=81=B4=EB=A6=AD=EC=8B=9C=20back=20button=EC=9C=BC?= =?UTF-8?q?=EB=A1=9C=20=ED=8F=AC=EC=BB=A4=EC=8B=B1=20=EB=90=A8=20=EC=9B=90?= =?UTF-8?q?=EC=9D=B8=20:=20Detail=20=ED=99=94=EB=A9=B4=EC=97=90=EC=84=9C?= =?UTF-8?q?=20=EC=83=81=ED=92=88=EC=84=A0=ED=83=9D=ED=95=A0=20=EB=95=8C=20?= =?UTF-8?q?=EC=83=81=ED=92=88=EC=A0=95=EB=B3=B4=EA=B0=80=20=EB=B3=80?= =?UTF-8?q?=EA=B2=BD=EB=90=98=EB=A9=B4,=20=EC=B4=88=EA=B8=B0=20=EC=A7=84?= =?UTF-8?q?=EC=9E=85=EC=9C=BC=EB=A1=9C=20=ED=8C=90=EB=8B=A8=ED=95=B4=20?= =?UTF-8?q?=ED=8F=AC=EC=BB=A4=EC=8A=A4=20=EC=B2=98=EB=A6=AC=ED=95=98?= =?UTF-8?q?=EA=B3=A0=20=EC=9E=88=EC=9D=8C=20=EB=8C=80=EC=B1=85=20:=20?= =?UTF-8?q?=EB=8F=99=EC=9D=BC=20=EB=A1=9C=EC=A7=81=EC=97=90=EC=84=9C=20?= =?UTF-8?q?=ED=98=84=EC=9E=AC=20=ED=8F=AC=EC=BB=A4=EC=8A=A4=EA=B0=80=20?= =?UTF-8?q?=EC=A0=81=EC=A0=88=ED=95=9C=20=EC=9C=84=EC=B9=98(=EC=83=81?= =?UTF-8?q?=ED=92=88,=20=EB=AA=A8=EB=B0=94=EC=9D=BC=EB=B2=84=ED=8A=BC)?= =?UTF-8?q?=EC=97=90=20=EC=A1=B4=EC=9E=AC=ED=95=A0=20=EA=B2=BD=EC=9A=B0=20?= =?UTF-8?q?=ED=8F=AC=EC=BB=A4=EC=8A=A4=20=EB=B3=80=EA=B2=BD=EC=9D=84=20?= =?UTF-8?q?=ED=95=98=EC=A7=80=20=EC=95=8A=EB=8F=8C=EA=B3=A0=20=EC=88=98?= =?UTF-8?q?=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../src/views/DetailPanel/DetailPanel.jsx | 1 + .../UnableProduct/UnableOption.jsx | 61 +++++++++++-------- 2 files changed, 36 insertions(+), 26 deletions(-) diff --git a/com.twin.app.shoptime/src/views/DetailPanel/DetailPanel.jsx b/com.twin.app.shoptime/src/views/DetailPanel/DetailPanel.jsx index 1ab0b4c5..e45b97ad 100644 --- a/com.twin.app.shoptime/src/views/DetailPanel/DetailPanel.jsx +++ b/com.twin.app.shoptime/src/views/DetailPanel/DetailPanel.jsx @@ -203,6 +203,7 @@ export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) { const handleSMSonClose = useCallback(() => { dispatch(setHidePopup()); setTimeout(() => { + Spotlight.focus("spotlightId_backBtn"); Spotlight.focus("shopbymobile_Btn"); }, 0); }, [dispatch]); diff --git a/com.twin.app.shoptime/src/views/DetailPanel/UnableProduct/UnableOption.jsx b/com.twin.app.shoptime/src/views/DetailPanel/UnableProduct/UnableOption.jsx index 8831c8b9..bbe38374 100644 --- a/com.twin.app.shoptime/src/views/DetailPanel/UnableProduct/UnableOption.jsx +++ b/com.twin.app.shoptime/src/views/DetailPanel/UnableProduct/UnableOption.jsx @@ -1,7 +1,7 @@ import React, { useCallback, useEffect, useMemo } from "react"; import classNames from "classnames"; -import { useDispatch, useSelector } from "react-redux"; +import { useDispatch } from "react-redux"; import Spotlight from "@enact/spotlight"; @@ -13,6 +13,7 @@ import * as Config from "../../../utils/Config"; import { $L } from "../../../utils/helperMethods"; import FavoriteBtn from "../components/FavoriteBtn"; import css from "./UnableOption.module.less"; +import useWhyDidYouUpdate from "../../../hooks/useWhyDidYouUpdate"; export default function UnableOption({ handleMobileSendPopupOpen, @@ -23,25 +24,21 @@ export default function UnableOption({ soldoutFlag, }) { const dispatch = useDispatch(); - const isLoading = useSelector( - (state) => state.common.appStatus?.showLoadingPanel?.show - ); - const favoriteFlagData = useSelector( - (state) => state.myPage.favoriteFlagData - ); + const { USE_SELECTOR } = useWhyDidYouUpdate("UnableOption", { + handleMobileSendPopupOpen, + patnrName, + productInfo, + selectedPatnrId, + selectedPrdtId, + soldoutFlag, + }); + + const isLoading = USE_SELECTOR("isLoading", (state) => state.common.appStatus?.showLoadingPanel?.show); + const favoriteFlagData = USE_SELECTOR("favoriteFlagData", (state) => state.myPage.favoriteFlagData); const tooltipDes = $L("Scan for more information about the product."); - const { - price2, - price3, - price5, - priceInfo, - rewd, - offerInfo, - patncNm, - installmentMonths, - } = productInfo; + const { price2, price3, price5, priceInfo, rewd, offerInfo, patncNm, installmentMonths } = productInfo; const { discountRate, @@ -52,7 +49,7 @@ export default function UnableOption({ promotionCode, } = usePriceInfo(priceInfo) || {}; - const { popupVisible } = useSelector((state) => state.common.popup); + const popupVisible = USE_SELECTOR("popupVisible", (state) => state.common.popup?.popupVisible); const TYPE_CASE = { // (기획서참고) 상품 상세 가격 노출 유형 case1: price2 && !price3 && !price5, @@ -67,15 +64,27 @@ export default function UnableOption({ }; useEffect(() => { + const current = Spotlight.getCurrent(); + let hasProperSpot = false; + if (current) { + const spotId = current.getAttribute("data-spotlight-id"); + if (spotId) { + if (spotId.indexOf("indicator-image") >= 0 || spotId.indexOf("indicator-shopbymobile_Btn") >= 0) { + hasProperSpot = true; + } + } + } let spotFocus = null; - if (soldoutFlag) { - spotFocus = setTimeout(() => { - Spotlight.focus("spotlightId_backBtn"); - }, 0); - } else if (!popupVisible) { - spotFocus = setTimeout(() => { - Spotlight.focus("shopbymobile_Btn"); - }, 0); + if (!hasProperSpot) { + if (soldoutFlag) { + spotFocus = setTimeout(() => { + Spotlight.focus("spotlightId_backBtn"); + }, 0); + } else if (!popupVisible) { + spotFocus = setTimeout(() => { + Spotlight.focus("shopbymobile_Btn"); + }, 0); + } } return () => { clearTimeout(spotFocus);