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 (