diff --git a/com.twin.app.shoptime/src/views/DetailPanel/SingleProduct/SingleOption.jsx b/com.twin.app.shoptime/src/views/DetailPanel/SingleProduct/SingleOption.jsx index 9446cdad..52f3d4bd 100644 --- a/com.twin.app.shoptime/src/views/DetailPanel/SingleProduct/SingleOption.jsx +++ b/com.twin.app.shoptime/src/views/DetailPanel/SingleProduct/SingleOption.jsx @@ -77,10 +77,6 @@ export default function SingleOption({ (state) => state.common.appStatus.loginUserData ); - const favoriteFlagData = useSelector( - (state) => state.myPage.favoriteFlagData - ); - const [hasProductOptionArray, setHasProductOptionArray] = useState(true); const [promotions, setPromotions] = useState([]); const [selectedBtnOptIdx, setSelectedBtnOptIdx] = useState(0); @@ -96,6 +92,7 @@ export default function SingleOption({ const [selectedOptionInfo, setSelectedOptionInfo] = useState(); const [downloadCouponArr, setDownloadCouponArr] = useState([]); const [focused, setFocused] = useState(false); + const [favoriteFlag, setFavoriteFlag] = useState(productInfo?.favorYn); const webOSVersion = useSelector( (state) => state.common.appStatus.webOSVersion @@ -524,12 +521,13 @@ export default function SingleOption({ Spotlight.focus("spotlight-IndicatorContainer"); }; - const favoriteFlag = useMemo(() => { - if (favoriteFlagData && Object.keys(favoriteFlagData).length > 0) { - return favoriteFlagData?.favorFlag; - } - return productInfo?.favorYn; - }, [favoriteFlagData, productInfo]); + useEffect(() => { + setFavoriteFlag(productInfo?.favorYn ? productInfo?.favorYn : "N"); + }, [productInfo]); + + const onFavoriteFlagChanged = useCallback((ev) => { + setFavoriteFlag(ev); + }, []); const renderItem = useCallback( ({ index, ...rest }) => { @@ -777,6 +775,7 @@ export default function SingleOption({ selectedPatnrId={selectedPatnrId} selectedPrdtId={selectedPrdtId} favoriteFlag={favoriteFlag} + onFavoriteFlagChanged={onFavoriteFlagChanged} />
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 b2450b5a..ba9d3be4 100644 --- a/com.twin.app.shoptime/src/views/DetailPanel/UnableProduct/UnableOption.jsx +++ b/com.twin.app.shoptime/src/views/DetailPanel/UnableProduct/UnableOption.jsx @@ -24,7 +24,7 @@ export default function UnableOption({ soldoutFlag, }) { const dispatch = useDispatch(); - const { USE_SELECTOR } = useWhyDidYouUpdate("UnableOption", { + const { USE_STATE, USE_SELECTOR } = useWhyDidYouUpdate("UnableOption", { handleMobileSendPopupOpen, patnrName, productInfo, @@ -37,11 +37,7 @@ export default function UnableOption({ "isLoading", (state) => state.common.appStatus?.showLoadingPanel?.show ); - const favoriteFlagData = USE_SELECTOR( - "favoriteFlagData", - (state) => state.myPage.favoriteFlagData - ); - + const [favoriteFlag, setFavoriteFlag] = USE_STATE("favoriteFlag", productInfo?.favorYn); const tooltipDes = $L("Scan for more information about the product."); const { @@ -130,12 +126,13 @@ export default function UnableOption({ } }, [dispatch, handleMobileSendPopupOpen]); - const favoriteFlag = useMemo(() => { - if (favoriteFlagData && Object.keys(favoriteFlagData).length > 0) { - return favoriteFlagData?.favorFlag; - } - return productInfo?.favorYn; - }, [favoriteFlagData, productInfo]); + useEffect(() => { + setFavoriteFlag(productInfo?.favorYn ? productInfo?.favorYn : "N"); + }, [productInfo]); + + const onFavoriteFlagChanged = useCallback((ev) => { + setFavoriteFlag(ev); + }, []); const renderPriceItem = useCallback(() => { if (productInfo && !promotionCode) { @@ -333,6 +330,7 @@ export default function UnableOption({ selectedPatnrId={selectedPatnrId} selectedPrdtId={selectedPrdtId} favoriteFlag={favoriteFlag} + onFavoriteFlagChanged={onFavoriteFlagChanged} />
{productInfo?.disclaimer}
diff --git a/com.twin.app.shoptime/src/views/DetailPanel/components/FavoriteBtn.jsx b/com.twin.app.shoptime/src/views/DetailPanel/components/FavoriteBtn.jsx index 10c7039d..5d85e613 100644 --- a/com.twin.app.shoptime/src/views/DetailPanel/components/FavoriteBtn.jsx +++ b/com.twin.app.shoptime/src/views/DetailPanel/components/FavoriteBtn.jsx @@ -52,15 +52,10 @@ export default function FavoriteBtn({ }, [dispatch, favoriteFlag, selectedPatnrId, selectedPrdtId]); const PopUpOnClick = useCallback(() => { - dispatch( - getMyFavoriteFlag({ - patnrId: selectedPatnrId, - prdtId: selectedPrdtId, - }) - ); setTimeout(() => Spotlight.focus("favoriteBtn")); dispatch(setHidePopup()); - }, [dispatch, favoriteFlag]); + onFavoriteFlagChanged(favoriteFlag === "Y" ? "N" : "Y"); + }, [dispatch, favoriteFlag, onFavoriteFlagChanged]); return (