[TrendingNow] Home > BestSeller / PopularShow 더보기 버튼으로 진입시 포커스 이슈 처리
This commit is contained in:
@@ -63,6 +63,7 @@ const BestSeller = ({ order, scrollTopBody, spotlightId, handleItemFocus }) => {
|
||||
name: panel_names.TRENDING_NOW_PANEL,
|
||||
panelInfo: {
|
||||
pageName: "BS",
|
||||
focusedContainerId: "trandingnow_bestseller",
|
||||
},
|
||||
})
|
||||
);
|
||||
@@ -89,12 +90,7 @@ const BestSeller = ({ order, scrollTopBody, spotlightId, handleItemFocus }) => {
|
||||
return;
|
||||
}
|
||||
},
|
||||
[
|
||||
cursorVisible,
|
||||
_handleItemFocus,
|
||||
handleScrollReset,
|
||||
scrollTopBody
|
||||
]
|
||||
[cursorVisible, _handleItemFocus, handleScrollReset, scrollTopBody]
|
||||
);
|
||||
|
||||
const handleScrollRight = (e) => {
|
||||
@@ -113,7 +109,12 @@ const BestSeller = ({ order, scrollTopBody, spotlightId, handleItemFocus }) => {
|
||||
}, [handleItemFocus]);
|
||||
|
||||
return (
|
||||
<Container className={css.bestSellerWrap} style={orderStyle} spotlightId={spotlightId} data-wheel-point={true}>
|
||||
<Container
|
||||
className={css.bestSellerWrap}
|
||||
style={orderStyle}
|
||||
spotlightId={spotlightId}
|
||||
data-wheel-point={true}
|
||||
>
|
||||
<SectionTitle
|
||||
title={$L("BEST SELLER")}
|
||||
data-title-index="homeBestSellerTitle"
|
||||
|
||||
@@ -74,6 +74,10 @@ const PopularShow = ({
|
||||
pushPanel(
|
||||
{
|
||||
name: panel_names.TRENDING_NOW_PANEL,
|
||||
panelInfo: {
|
||||
pageName: "PS",
|
||||
focusedContainerId: "trandingnow_popularcontainer",
|
||||
},
|
||||
},
|
||||
[dispatch]
|
||||
)
|
||||
@@ -101,12 +105,7 @@ const PopularShow = ({
|
||||
return;
|
||||
}
|
||||
},
|
||||
[
|
||||
cursorVisible,
|
||||
_handleItemFocus,
|
||||
handleScrollReset,
|
||||
scrollTopBody
|
||||
]
|
||||
[cursorVisible, _handleItemFocus, handleScrollReset, scrollTopBody]
|
||||
);
|
||||
|
||||
const handleScrollRight = (e) => {
|
||||
@@ -125,7 +124,12 @@ const PopularShow = ({
|
||||
}, [handleItemFocus]);
|
||||
|
||||
return (
|
||||
<Container className={css.popularShow} style={orderStyle} spotlightId={spotlightId} data-wheel-point={true}>
|
||||
<Container
|
||||
className={css.popularShow}
|
||||
style={orderStyle}
|
||||
spotlightId={spotlightId}
|
||||
data-wheel-point={true}
|
||||
>
|
||||
<SectionTitle
|
||||
className={css.subTitle}
|
||||
title={$L("POPULAR SHOW")}
|
||||
|
||||
@@ -186,9 +186,11 @@ export default function TrendingNowPanel({ panelInfo, spotlightId }) {
|
||||
useEffect(() => {
|
||||
if (topInfos && bestSellerDatas) {
|
||||
if (panelInfo?.pageName === "BS") {
|
||||
Spotlight.focus(
|
||||
"bs-spotlightId-" + removeDotAndColon(bestSellerDatas[0]?.prdtId)
|
||||
);
|
||||
if (panelInfo?.linkTpCd) {
|
||||
Spotlight.focus("trandingnow_bestseller");
|
||||
} else {
|
||||
Spotlight.focus(panelInfo?.focusedContainerId);
|
||||
}
|
||||
} else {
|
||||
if (!firstChk && !panelInfo.currentSpot) {
|
||||
Spotlight.focus("popular_video");
|
||||
@@ -196,7 +198,15 @@ export default function TrendingNowPanel({ panelInfo, spotlightId }) {
|
||||
}
|
||||
}
|
||||
}
|
||||
}, [firstChk, panelInfo, topInfos, bestSellerDatas]);
|
||||
}, [
|
||||
firstChk,
|
||||
topInfos,
|
||||
bestSellerDatas,
|
||||
panelInfo?.focusedContainerId,
|
||||
panelInfo.currentSpot,
|
||||
panelInfo?.pageName,
|
||||
panelInfo?.linkTpCd,
|
||||
]);
|
||||
|
||||
const onItemSpotlightDown = useCallback((e) => {
|
||||
e.stopPropagation();
|
||||
|
||||
Reference in New Issue
Block a user