[SHOPTIME-3155] My Page / Recentrly Viewed / VOD 클릭 후 이전 키 입력 시 포커스 오류
Changed files: 1. RecentlyViewed.jsx Detail note: - 원인: DetailPanel에서 돌아올 때와 다르게 PlayerPanel에서 돌아올 경우, component가 unmounted되지 않기 때문에 focus 로직 동작 시 가장 가까운 node를 찾아 focus 함 - 대책: PlayerPanel에서 돌아올 경우, scroll을 top으로 설정하고, 그 이후 아이템에 포커스가 가도록 로직 변경
This commit is contained in:
@@ -61,17 +61,24 @@ export default function RecentlyViewed({ title, panelInfo, isOnTop }) {
|
||||
useEffect(() => {
|
||||
if (recentlyDatas) {
|
||||
setTimeout(() => {
|
||||
const node = document.querySelector(`[id="${SpotlightIds.TBODY}"]`);
|
||||
if (activeDelete) {
|
||||
Spotlight.focus("recentlyviewed_header");
|
||||
} else if (recentlyDatas.length === 0) {
|
||||
Spotlight.focus("mypage-recentlyViewed-nodata");
|
||||
} else if (node) {
|
||||
Spotlight.focus(node);
|
||||
const tHeader = document.querySelector(
|
||||
`[data-spotlight-id="recentlyviewed_header"]`
|
||||
);
|
||||
const tBody = document.querySelector(`[id="${SpotlightIds.TBODY}"]`);
|
||||
|
||||
if (isOnTop) {
|
||||
if (cbChangePageRef.current) {
|
||||
cbChangePageRef.current(0, false);
|
||||
|
||||
if (tHeader && tBody) {
|
||||
const focusTarget = activeDelete ? tHeader : tBody;
|
||||
Spotlight.focus(focusTarget);
|
||||
}
|
||||
}
|
||||
}
|
||||
}, 0);
|
||||
});
|
||||
}
|
||||
}, [recentlyDatas]);
|
||||
}, [isOnTop, recentlyDatas]);
|
||||
|
||||
useEffect(() => {
|
||||
if (panelInfo) {
|
||||
|
||||
Reference in New Issue
Block a user