optrader/shoptime
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[Log] modify menu for DetailPanel

Browse Source
This commit is contained in:
younghoon100.park
2024-07-30 14:39:52 +09:00
parent 149dce5d9e
commit 8c434ccce1
9 changed files with 192 additions and 149 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
com.twin.app.shoptime/src/utils/Config.js
View File

@@ -282,8 +282,8 @@ export const LOG_MENU = {
SEARCH_RESULT: "Search/Search Result",
SEARCH_BEST_SELLER: "Search/Best Sellers",
CATEGORY_SHOWS: "Category_show",
CATEGORY_ITEM: "Category_item",
CATEGORY_SHOWS: "Category/Category_show",
CATEGORY_ITEM: "CategoryCategory_item",
CATEGORY_POPULAR_SHOWS: "Category/Popular Shows",
CATEGORY_BEST_SELLER: "Category/Best Sellers",
@@ -322,15 +322,16 @@ export const LOG_MENU = {
THEME_PAGE: "Theme Page",
DETAIL_PAGE_BILLING_PRODUCT_DETAIL: "Detail Page/Billing Product Detail",
DETAIL_PAGE_PRODUCT_DETAIL: "Detail Page/Product Detail",
DETAIL_PAGE_GROUP_DETAIL: "Detail Page/Group Detail",
DETAIL_PAGE_THEME_DETAIL: "Detail Page/Theme Detail",
DETAIL_PAGE_TRAVEL_THEME_DETAIL: "Detail Page/Travel Theme Detail",
DETAIL_PAGE_BILLING_PRODUCT_DETAIL: "Billing Product Detail",
DETAIL_PAGE_PRODUCT_DETAIL: "Product Detail",
DETAIL_PAGE_GROUP_DETAIL: "Group Detail",
DETAIL_PAGE_THEME_DETAIL: "Theme Detail",
DETAIL_PAGE_TRAVEL_THEME_DETAIL: "Travel Theme Detail",
DETAIL_PAGE_YOU_MAY_LIKE: "You May Also Like",
FULL: "Full Player/Full Player",
FULL_SHOP_NOW: "Full Player/Shop Now",
FULL_YOU_MAY_LIKE: "Full Player/You May Like",
FULL_YOU_MAY_LIKE: "Full Player/You May Also Like",
FULL_LIVE_CHANNELS: "Full Player/Live Channels",
FULL_FEATURED_SHOWS: "Full Player/Featured Shows",

121
com.twin.app.shoptime/src/views/DetailPanel/DetailPanel.jsx
View File

@@ -45,8 +45,8 @@ import UnableProduct from "./UnableProduct/UnableProduct";
import YouMayLike from "./YouMayLike/YouMayLike";
export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) {
const [lgCatCd, setLgCatCd] = useState("");
const [selectedIndex, setSelectedIndex] = useState(0);
const dispatch = useDispatch();
const productData = useSelector((state) => state.main.productData);
const themeData = useSelector((state) => state.home.productData);
const hotelData = useSelector((state) => state.home.hotelData);
@@ -71,7 +71,9 @@ export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) {
(state) => state.common.appStatus.webOSVersion
);
const dispatch = useDispatch();
const [lgCatCd, setLgCatCd] = useState("");
const [isYouMayLikeOpened, setIsYouMayLikeOpened] = useState(false);
const [selectedIndex, setSelectedIndex] = useState(0);
const shopByMobileLogRef = useRef(null);
@@ -276,7 +278,8 @@ export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) {
return (
productData?.pmtSuptYn === "Y" &&
productData?.grPrdtProcYn === "Y" &&
groupInfos
groupInfos &&
groupInfos.length > 0
);
}, [productData, groupInfos]);
@@ -362,57 +365,64 @@ export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) {
spotlightDisabled={isLoading}
isDefaultContainer
>
{/* 결제가능상품 영역 */}
{isBillingProductVisible && (
<SingleProduct
isOnTop={isOnTop}
panelInfo={panelInfo}
selectedPatnrId={patnrId}
selectedPrdtId={prdtId}
selectedIndex={selectedIndex}
setSelectedIndex={setSelectedIndex}
shopByMobileLogRef={shopByMobileLogRef}
/>
)}
{/* 구매불가상품 영역 */}
{isUnavailableProductVisible && (
<UnableProduct
isOnTop={isOnTop}
panelInfo={panelInfo}
selectedPatnrId={patnrId}
selectedPrdtId={prdtId}
selectedIndex={selectedIndex}
setSelectedIndex={setSelectedIndex}
shopByMobileLogRef={shopByMobileLogRef}
/>
)}
{/* 그룹상품 영역 */}
{isGroupProductVisible && (
<GroupProduct
isOnTop={isOnTop}
panelInfo={panelInfo}
selectedPatnrId={patnrId}
selectedPrdtId={prdtId}
selectedIndex={selectedIndex}
setSelectedIndex={setSelectedIndex}
shopByMobileLogRef={shopByMobileLogRef}
/>
)}
{/* 테마그룹상품 영역*/}
{isTravelProductVisible && (
<ThemeProduct
isOnTop={isOnTop}
panelInfo={panelInfo}
selectedCurationId={curationId}
selectedCurationNm={curationNm}
selectedIndex={selectedIndex}
selectedPatnrId={patnrId}
setSelectedIndex={setSelectedIndex}
shopByMobileLogRef={shopByMobileLogRef}
themeType={type}
isLoading={isLoading}
/>
{!isLoading && (
<>
{/* 결제가능상품 영역 */}
{isBillingProductVisible && (
<SingleProduct
isOnTop={isOnTop}
panelInfo={panelInfo}
selectedPatnrId={patnrId}
selectedPrdtId={prdtId}
selectedIndex={selectedIndex}
setSelectedIndex={setSelectedIndex}
shopByMobileLogRef={shopByMobileLogRef}
isYouMayLikeOpened={isYouMayLikeOpened}
/>
)}
{/* 구매불가상품 영역 */}
{isUnavailableProductVisible && (
<UnableProduct
isOnTop={isOnTop}
panelInfo={panelInfo}
selectedPatnrId={patnrId}
selectedPrdtId={prdtId}
selectedIndex={selectedIndex}
setSelectedIndex={setSelectedIndex}
shopByMobileLogRef={shopByMobileLogRef}
isYouMayLikeOpened={isYouMayLikeOpened}
/>
)}
{/* 그룹상품 영역 */}
{isGroupProductVisible && (
<GroupProduct
isOnTop={isOnTop}
panelInfo={panelInfo}
selectedPatnrId={patnrId}
selectedPrdtId={prdtId}
selectedIndex={selectedIndex}
setSelectedIndex={setSelectedIndex}
shopByMobileLogRef={shopByMobileLogRef}
isYouMayLikeOpened={isYouMayLikeOpened}
/>
)}
{/* 테마그룹상품 영역*/}
{isTravelProductVisible && (
<ThemeProduct
isOnTop={isOnTop}
panelInfo={panelInfo}
selectedCurationId={curationId}
selectedCurationNm={curationNm}
selectedIndex={selectedIndex}
selectedPatnrId={patnrId}
setSelectedIndex={setSelectedIndex}
themeType={type}
isLoading={isLoading}
shopByMobileLogRef={shopByMobileLogRef}
isYouMayLikeOpened={isYouMayLikeOpened}
/>
)}
</>
)}
</TBody>
</TPanel>
@@ -430,6 +440,7 @@ export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) {
selectedPrdtId={prdtId}
setSelectedIndex={setSelectedIndex}
productInfo={productData || themeData}
setIsYouMayLikeOpened={setIsYouMayLikeOpened}
/>
)}
{activePopup === Config.ACTIVE_POPUP.smsPopup && (

48
com.twin.app.shoptime/src/views/DetailPanel/GroupProduct/GroupProduct.jsx
View File

@@ -10,7 +10,6 @@ import {
sendLogProductDetail,
sendLogShopByMobile,
} from "../../../actions/logActions";
import usePrevious from "../../../hooks/usePrevious";
import { LOG_MENU, LOG_TP_NO } from "../../../utils/Config";
import { formatGMTString } from "../../../utils/helperMethods";
import Indicator from "../components/indicator/Indicator";
@@ -31,11 +30,11 @@ export default function GroupProduct({
selectedIndex,
setSelectedIndex,
shopByMobileLogRef,
isYouMayLikeOpened,
}) {
const dispatch = useDispatch();
const productData = useSelector((state) => state.main.productData);
const productDataRef = usePrevious(productData);
const isProductSoldOut = useMemo(() => {
if (productData && productData.soldoutFlag === "Y") {
@@ -46,38 +45,41 @@ export default function GroupProduct({
}, [productData]);
useEffect(() => {
dispatch(sendLogGNB(LOG_MENU.DETAIL_PAGE_GROUP_DETAIL));
}, []);
const menu = isYouMayLikeOpened
? `${LOG_MENU.DETAIL_PAGE_GROUP_DETAIL}/${LOG_MENU.DETAIL_PAGE_YOU_MAY_LIKE}`
: LOG_MENU.DETAIL_PAGE_GROUP_DETAIL;
dispatch(sendLogGNB(menu));
}, [isYouMayLikeOpened]);
useEffect(() => {
if (productDataRef.current) {
const data = productDataRef.current;
if (productData && Object.keys(productData).length > 0) {
const params = {
befPrice: data?.priceInfo?.split("|")[0],
curationId: data?.curationId ?? "",
curationNm: data?.curationNm ?? "",
expsOrd: data?.expsPrdtNo ?? "",
befPrice: productData?.priceInfo?.split("|")[0],
curationId: productData?.curationId ?? "",
curationNm: productData?.curationNm ?? "",
expsOrd: productData?.expsPrdtNo ?? "",
inDt: formatGMTString(new Date()),
lastPrice: data.priceInfo?.split("|")[1],
lgCatCd: data?.catCd ?? "",
lgCatNm: data?.catNm ?? "",
lastPrice: productData.priceInfo?.split("|")[1],
lgCatCd: productData?.catCd ?? "",
lgCatNm: productData?.catNm ?? "",
linkTpCd: panelInfo?.linkTpCd ?? "",
logTpNo: LOG_TP_NO.PRODUCT.GROUP_DETAIL,
patncNm: data?.patncNm ?? "",
patnrId: data?.patnrId ?? "",
prdtId: data?.prdtId ?? "",
prdtNm: data?.prdtNm ?? "",
revwGrd: data?.revwGrd ?? "",
rewdAplyFlag: data.priceInfo?.split("|")[2],
tsvFlag: data?.todaySpclFlag ?? "",
patncNm: productData?.patncNm ?? "",
patnrId: productData?.patnrId ?? "",
prdtId: productData?.prdtId ?? "",
prdtNm: productData?.prdtNm ?? "",
revwGrd: productData?.revwGrd ?? "",
rewdAplyFlag: productData.priceInfo?.split("|")[2],
tsvFlag: productData?.todaySpclFlag ?? "",
};
return () => dispatch(sendLogProductDetail(params));
}
}, []);
}, [productData]);
const handleIndicatorOptions = useCallback(() => {
if (productData) {
if (productData && Object.keys(productData).length > 0) {
const params = {
curationId: productData?.curationId ?? "",
curationNm: productData?.curationNm ?? "",
@@ -93,7 +95,7 @@ export default function GroupProduct({
}, [productData]);
const handleMobileSendPopupOpen = useCallback(() => {
if (productData) {
if (productData && Object.keys(productData).length > 0) {
const params = {
befPrice: productData?.priceInfo?.split("|")[0],
curationId: productData?.curationId ?? "",

48
com.twin.app.shoptime/src/views/DetailPanel/SingleProduct/SingleProduct.jsx
View File

@@ -10,7 +10,6 @@ import {
sendLogProductDetail,
sendLogShopByMobile,
} from "../../../actions/logActions";
import usePrevious from "../../../hooks/usePrevious";
import { LOG_MENU, LOG_TP_NO } from "../../../utils/Config";
import { formatGMTString } from "../../../utils/helperMethods";
import Indicator from "../components/indicator/Indicator";
@@ -31,11 +30,11 @@ export default function SingleProduct({
selectedIndex,
setSelectedIndex,
shopByMobileLogRef,
isYouMayLikeOpened,
}) {
const dispatch = useDispatch();
const productData = useSelector((state) => state.main.productData);
const productDataRef = usePrevious(productData);
const isProductSoldOut = useMemo(() => {
if (productData && productData.soldoutFlag === "Y") {
@@ -46,38 +45,41 @@ export default function SingleProduct({
}, [productData]);
useEffect(() => {
dispatch(sendLogGNB(LOG_MENU.DETAIL_PAGE_BILLING_PRODUCT_DETAIL));
}, []);
const menu = isYouMayLikeOpened
? `${LOG_MENU.DETAIL_PAGE_BILLING_PRODUCT_DETAIL}/${LOG_MENU.DETAIL_PAGE_YOU_MAY_LIKE}`
: LOG_MENU.DETAIL_PAGE_BILLING_PRODUCT_DETAIL;
dispatch(sendLogGNB(menu));
}, [isYouMayLikeOpened]);
useEffect(() => {
if (productDataRef.current) {
const data = productDataRef.current;
if (productData && Object.keys(productData).length > 0) {
const params = {
befPrice: data?.priceInfo?.split("|")[0],
curationId: data?.curationId ?? "",
curationNm: data?.curationNm ?? "",
expsOrd: data?.expsPrdtNo ?? "",
befPrice: productData?.priceInfo?.split("|")[0],
curationId: productData?.curationId ?? "",
curationNm: productData?.curationNm ?? "",
expsOrd: productData?.expsPrdtNo ?? "",
inDt: formatGMTString(new Date()),
lastPrice: data.priceInfo?.split("|")[1],
lgCatCd: data?.catCd ?? "",
lgCatNm: data?.catNm ?? "",
lastPrice: productData.priceInfo?.split("|")[1],
lgCatCd: productData?.catCd ?? "",
lgCatNm: productData?.catNm ?? "",
linkTpCd: panelInfo?.linkTpCd ?? "",
logTpNo: LOG_TP_NO.PRODUCT.BILLING_PRODUCT_DETAIL,
patncNm: data?.patncNm ?? "",
patnrId: data?.patnrId ?? "",
prdtId: data?.prdtId ?? "",
prdtNm: data?.prdtNm ?? "",
revwGrd: data?.revwGrd ?? "",
rewdAplyFlag: data.priceInfo?.split("|")[2],
tsvFlag: data?.todaySpclFlag ?? "",
patncNm: productData?.patncNm ?? "",
patnrId: productData?.patnrId ?? "",
prdtId: productData?.prdtId ?? "",
prdtNm: productData?.prdtNm ?? "",
revwGrd: productData?.revwGrd ?? "",
rewdAplyFlag: productData.priceInfo?.split("|")[2],
tsvFlag: productData?.todaySpclFlag ?? "",
};
return () => dispatch(sendLogProductDetail(params));
}
}, []);
}, [productData]);
const handleIndicatorOptions = useCallback(() => {
if (productData) {
if (productData && Object.keys(productData).length > 0) {
const params = {
curationId: productData?.curationId ?? "",
curationNm: productData?.curationNm ?? "",
@@ -93,7 +95,7 @@ export default function SingleProduct({
}, [productData]);
const handleMobileSendPopupOpen = useCallback(() => {
if (productData) {
if (productData && Object.keys(productData).length > 0) {
const params = {
befPrice: productData?.priceInfo?.split("|")[0],
curationId: productData?.curationId ?? "",

15
com.twin.app.shoptime/src/views/DetailPanel/ThemeProduct/HotelProduct.jsx
View File

@@ -36,8 +36,9 @@ export default function HotelOption({
launchedFromPlayer,
selectedIndex,
setSelectedIndex,
shopByMobileLogRef,
isLoading,
shopByMobileLogRef,
isYouMayLikeOpened,
}) {
const dispatch = useDispatch();
@@ -65,14 +66,20 @@ export default function HotelOption({
patnrId,
};
}
return {};
}, [hotelData, hotelInfos, selectedIndex]);
useEffect(() => {
dispatch(sendLogGNB(Config.LOG_MENU.DETAIL_PAGE_TRAVEL_THEME_DETAIL));
}, []);
const menu = isYouMayLikeOpened
? `${Config.LOG_MENU.DETAIL_PAGE_TRAVEL_THEME_DETAIL}/${Config.LOG_MENU.DETAIL_PAGE_YOU_MAY_LIKE}`
: Config.LOG_MENU.DETAIL_PAGE_TRAVEL_THEME_DETAIL;
dispatch(sendLogGNB(menu));
}, [isYouMayLikeOpened]);
useEffect(() => {
if (selectedHotelInfo) {
if (selectedHotelInfo && Object.keys(selectedHotelInfo).length > 0) {
const params = {
befPrice: selectedHotelInfo?.hotelInfo?.hotelDetailInfo?.price ?? "",
curationId: selectedHotelInfo?.curationId ?? "",

25
com.twin.app.shoptime/src/views/DetailPanel/ThemeProduct/ShowProduct.jsx
View File

@@ -10,7 +10,6 @@ import {
sendLogProductDetail,
sendLogShopByMobile,
} from "../../../actions/logActions";
import usePrevious from "../../../hooks/usePrevious";
import { LOG_MENU, LOG_TP_NO } from "../../../utils/Config";
import { formatGMTString } from "../../../utils/helperMethods";
import IndicatorOptions from "../components/indicator/IndicatorOptions";
@@ -33,6 +32,7 @@ export default function ShowOption({
// selectedPatnrId,
setSelectedIndex,
shopByMobileLogRef,
isYouMayLikeOpened,
isLoading,
}) {
const dispatch = useDispatch();
@@ -43,7 +43,6 @@ export default function ShowOption({
const webOSVersion = useSelector(
(state) => state.common.appStatus.webOSVersion
);
const productDataRef = usePrevious(productData);
const detailLogParamsRef = useRef(null);
const timerRef = useRef(null);
@@ -64,15 +63,21 @@ export default function ShowOption({
};
}
}
return {};
}, [productData, productInfo, selectedIndex]);
useEffect(() => {
dispatch(sendLogGNB(LOG_MENU.DETAIL_PAGE_THEME_DETAIL));
}, []);
const menu = isYouMayLikeOpened
? `${LOG_MENU.DETAIL_PAGE_THEME_DETAIL}/${LOG_MENU.DETAIL_PAGE_YOU_MAY_LIKE}`
: LOG_MENU.DETAIL_PAGE_THEME_DETAIL;
dispatch(sendLogGNB(menu));
}, [isYouMayLikeOpened]);
useEffect(() => {
if (productDataRef.current) {
const themeInfo = productDataRef.current?.themeInfo[0];
if (productData && Object.keys(productData).length > 0) {
const themeInfo = productData?.themeInfo[0];
const params = {
curationId: themeInfo?.curationId ?? "",
@@ -88,10 +93,10 @@ export default function ShowOption({
return () => dispatch(sendLogDetail(params));
}
}, [productDataRef]);
}, [productData]);
useEffect(() => {
if (showProductInfo) {
if (showProductInfo && Object.keys(showProductInfo).length > 0) {
const params = {
befPrice: showProductInfo?.priceInfo?.split("|")[0],
curationId: showProductInfo?.curationId ?? "",
@@ -136,7 +141,7 @@ export default function ShowOption({
const isSoldout = isProductSoldOut();
const handleIndicatorOptions = useCallback(() => {
if (productData) {
if (productData && Object.keys(productData).length > 0) {
const params = {
...detailLogParamsRef.current,
inDt: "",
@@ -148,7 +153,7 @@ export default function ShowOption({
}, [productData]);
const handleMobileSendPopupOpen = useCallback(() => {
if (productData) {
if (productData && Object.keys(productData).length > 0) {
const params = {
befPrice: productData?.priceInfo?.split("|")[0],
curationId: productData?.curationId ?? "",

5
com.twin.app.shoptime/src/views/DetailPanel/ThemeProduct/ThemeProduct.jsx
View File

@@ -14,9 +14,10 @@ export default function ThemeProduct({
selectedIndex,
selectedPatnrId,
setSelectedIndex,
shopByMobileLogRef,
themeType,
isLoading,
shopByMobileLogRef,
isYouMayLikeOpened,
}) {
return (
<div className={css.container}>
@@ -31,6 +32,7 @@ export default function ThemeProduct({
selectedPatnrId={selectedPatnrId}
setSelectedIndex={setSelectedIndex}
shopByMobileLogRef={shopByMobileLogRef}
isYouMayLikeOpened={isYouMayLikeOpened}
isLoading={isLoading}
/>
)}
@@ -42,6 +44,7 @@ export default function ThemeProduct({
selectedIndex={selectedIndex}
setSelectedIndex={setSelectedIndex}
shopByMobileLogRef={shopByMobileLogRef}
isYouMayLikeOpened={isYouMayLikeOpened}
isLoading={isLoading}
/>
)}

48
com.twin.app.shoptime/src/views/DetailPanel/UnableProduct/UnableProduct.jsx
View File

@@ -10,7 +10,6 @@ import {
sendLogProductDetail,
sendLogShopByMobile,
} from "../../../actions/logActions";
import usePrevious from "../../../hooks/usePrevious";
import { LOG_MENU, LOG_TP_NO } from "../../../utils/Config";
import { formatGMTString } from "../../../utils/helperMethods";
import Indicator from "../components/indicator/Indicator";
@@ -31,11 +30,11 @@ export default function UnableProduct({
selectedIndex,
setSelectedIndex,
shopByMobileLogRef,
isYouMayLikeOpened,
}) {
const dispatch = useDispatch();
const productData = useSelector((state) => state.main.productData);
const productDataRef = usePrevious(productData);
const isProductSoldOut = useMemo(() => {
if (productData && productData.soldoutFlag === "Y") {
@@ -46,38 +45,41 @@ export default function UnableProduct({
}, [productData]);
useEffect(() => {
dispatch(sendLogGNB(LOG_MENU.DETAIL_PAGE_PRODUCT_DETAIL));
}, []);
const menu = isYouMayLikeOpened
? `${LOG_MENU.DETAIL_PAGE_PRODUCT_DETAIL}/${LOG_MENU.DETAIL_PAGE_YOU_MAY_LIKE}`
: LOG_MENU.DETAIL_PAGE_PRODUCT_DETAIL;
dispatch(sendLogGNB(menu));
}, [isYouMayLikeOpened]);
useEffect(() => {
if (productDataRef.current) {
const data = productDataRef.current;
if (productData && Object.keys(productData).length > 0) {
const params = {
befPrice: data?.priceInfo?.split("|")[0],
curationId: data?.curationId ?? "",
curationNm: data?.curationNm ?? "",
expsOrd: data?.expsPrdtNo ?? "",
befPrice: productData?.priceInfo?.split("|")[0],
curationId: productData?.curationId ?? "",
curationNm: productData?.curationNm ?? "",
expsOrd: productData?.expsPrdtNo ?? "",
inDt: formatGMTString(new Date()),
lastPrice: data.priceInfo?.split("|")[1],
lgCatCd: data?.catCd ?? "",
lgCatNm: data?.catNm ?? "",
lastPrice: productData.priceInfo?.split("|")[1],
lgCatCd: productData?.catCd ?? "",
lgCatNm: productData?.catNm ?? "",
linkTpCd: panelInfo?.linkTpCd ?? "",
logTpNo: LOG_TP_NO.PRODUCT.PRODUCT_DETAIL,
patncNm: data?.patncNm ?? "",
patnrId: data?.patnrId ?? "",
prdtId: data?.prdtId ?? "",
prdtNm: data?.prdtNm ?? "",
revwGrd: data?.revwGrd ?? "",
rewdAplyFlag: data.priceInfo?.split("|")[2],
tsvFlag: data?.todaySpclFlag ?? "",
patncNm: productData?.patncNm ?? "",
patnrId: productData?.patnrId ?? "",
prdtId: productData?.prdtId ?? "",
prdtNm: productData?.prdtNm ?? "",
revwGrd: productData?.revwGrd ?? "",
rewdAplyFlag: productData.priceInfo?.split("|")[2],
tsvFlag: productData?.todaySpclFlag ?? "",
};
return () => dispatch(sendLogProductDetail(params));
}
}, []);
}, [productData]);
const handleIndicatorOptions = useCallback(() => {
if (productData) {
if (productData && Object.keys(productData).length > 0) {
const params = {
curationId: productData?.curationId ?? "",
curationNm: productData?.curationNm ?? "",
@@ -93,7 +95,7 @@ export default function UnableProduct({
}, [productData]);
const handleMobileSendPopupOpen = useCallback(() => {
if (productData) {
if (productData && Object.keys(productData).length > 0) {
const params = {
befPrice: productData?.priceInfo?.split("|")[0],
curationId: productData?.curationId ?? "",

14
com.twin.app.shoptime/src/views/DetailPanel/YouMayLike/YouMayLike.jsx
View File

@@ -1,4 +1,5 @@
import React, {
memo,
useCallback,
useEffect,
useMemo,
@@ -32,7 +33,7 @@ const Container = SpotlightContainerDecorator(
);
const SpottableComponent = Spottable("div");
export default function YouMayLike({
export default memo(function YouMayLike({
isUnable,
lgCatCd,
panelInfo,
@@ -41,6 +42,7 @@ export default function YouMayLike({
selectedPrdtId,
selectedCurationId,
setSelectedIndex,
setIsYouMayLikeOpened,
}) {
const [focused, setFocused] = useState(false);
const [expanded, setExpanded] = useState(false);
@@ -64,6 +66,14 @@ export default function YouMayLike({
return detailPanelIndex - 1 === playerPanelIndex;
}, [panels]);
useEffect(() => {
if (expanded) {
setIsYouMayLikeOpened(true);
return () => setIsYouMayLikeOpened(false);
}
}, [expanded, setIsYouMayLikeOpened]);
useEffect(() => {
dispatch(
getMainYouMayLike({
@@ -209,4 +219,4 @@ export default function YouMayLike({
</Container>
</>
);
}
});