[homepanel]
- 선택약관 동의, 비동의시 팝업 닫힌 뒤 포커스 이동 처리. - settimeout100으로 home_tbody로 포커스 줌.
This commit is contained in:
@@ -1,8 +1,16 @@
|
|||||||
import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
|
import React, {
|
||||||
|
useCallback,
|
||||||
|
useEffect,
|
||||||
|
useMemo,
|
||||||
|
useRef,
|
||||||
|
useState,
|
||||||
|
} from 'react';
|
||||||
|
|
||||||
import classNames from 'classnames';
|
import classNames from 'classnames';
|
||||||
import { useDispatch, useSelector } from 'react-redux';
|
import {
|
||||||
import { types } from '../../actions/actionTypes';
|
useDispatch,
|
||||||
|
useSelector,
|
||||||
|
} from 'react-redux';
|
||||||
import { applyMiddleware } from 'redux';
|
import { applyMiddleware } from 'redux';
|
||||||
|
|
||||||
import Spotlight from '@enact/spotlight';
|
import Spotlight from '@enact/spotlight';
|
||||||
@@ -11,53 +19,6 @@ import {
|
|||||||
setContainerLastFocusedElement,
|
setContainerLastFocusedElement,
|
||||||
} from '@enact/spotlight/src/container';
|
} from '@enact/spotlight/src/container';
|
||||||
|
|
||||||
import {
|
|
||||||
changeAppStatus,
|
|
||||||
setDeepLink,
|
|
||||||
setExitApp,
|
|
||||||
setHidePopup,
|
|
||||||
setShowPopup,
|
|
||||||
setOptionalTermsPopupShown,
|
|
||||||
updateOptionalTermsAgreement,
|
|
||||||
} from '../../actions/commonActions';
|
|
||||||
import { getWelcomeEventInfo } from '../../actions/eventActions';
|
|
||||||
import {
|
|
||||||
checkEnterThroughGNB,
|
|
||||||
getHomeLayout,
|
|
||||||
getHomeMainContents,
|
|
||||||
updateHomeInfo,
|
|
||||||
// <<<<<<< HEAD
|
|
||||||
} from '../../actions/homeActions';
|
|
||||||
import { setMyPageTermsAgree } from '../../actions/myPageActions';
|
|
||||||
import { sendLogGNB, sendLogTotalRecommend } from '../../actions/logActions';
|
|
||||||
import { getSubCategory, getTop20Show } from '../../actions/mainActions';
|
|
||||||
import { getHomeOnSaleInfo } from '../../actions/onSaleActions';
|
|
||||||
import { updatePanel } from '../../actions/panelActions';
|
|
||||||
import {
|
|
||||||
showModalVideo,
|
|
||||||
finishVideoPreview,
|
|
||||||
hideModalVideo,
|
|
||||||
startVideoPlayerNew,
|
|
||||||
} from '../../actions/playActions';
|
|
||||||
import { getBestSeller } from '../../actions/productActions';
|
|
||||||
import TBody from '../../components/TBody/TBody';
|
|
||||||
import TButton, { TYPES } from '../../components/TButton/TButton';
|
|
||||||
import OptionalConfirm from '../../components/Optional/OptionalConfirm';
|
|
||||||
import TNewPopUp from '../../components/TPopUp/TNewPopUp';
|
|
||||||
import TPanel from '../../components/TPanel/TPanel';
|
|
||||||
import TPopUp from '../../components/TPopUp/TPopUp';
|
|
||||||
import TVerticalPagenator from '../../components/TVerticalPagenator/TVerticalPagenator';
|
|
||||||
import useDebugKey from '../../hooks/useDebugKey';
|
|
||||||
import { useFocusHistory } from '../../hooks/useFocusHistory/useFocusHistory';
|
|
||||||
import usePrevious from '../../hooks/usePrevious';
|
|
||||||
import { useVideoPlay } from '../../hooks/useVideoPlay/useVideoPlay';
|
|
||||||
import ImagePreloader from '../../utils/ImagePreloader';
|
|
||||||
import { createDebugHelpers } from '../../utils/debug';
|
|
||||||
|
|
||||||
// 디버그 헬퍼 설정
|
|
||||||
const DEBUG_MODE = false;
|
|
||||||
const { dlog, dwarn, derror } = createDebugHelpers(DEBUG_MODE);
|
|
||||||
|
|
||||||
// DetailPanelBackground 이미지 imports for preloading
|
// DetailPanelBackground 이미지 imports for preloading
|
||||||
import hsn from '../../../assets/images/bg/hsn_new.png';
|
import hsn from '../../../assets/images/bg/hsn_new.png';
|
||||||
import koreaKiosk from '../../../assets/images/bg/koreaKiosk_new.png';
|
import koreaKiosk from '../../../assets/images/bg/koreaKiosk_new.png';
|
||||||
@@ -66,17 +27,53 @@ import ontv4u from '../../../assets/images/bg/ontv4u_new.png';
|
|||||||
import Pinkfong from '../../../assets/images/bg/Pinkfong_new.png';
|
import Pinkfong from '../../../assets/images/bg/Pinkfong_new.png';
|
||||||
import qvc from '../../../assets/images/bg/qvc_new.png';
|
import qvc from '../../../assets/images/bg/qvc_new.png';
|
||||||
import shoplc from '../../../assets/images/bg/shoplc_new.png';
|
import shoplc from '../../../assets/images/bg/shoplc_new.png';
|
||||||
|
import { types } from '../../actions/actionTypes';
|
||||||
// 파트너사별 배경 이미지 맵
|
import {
|
||||||
const BACKGROUND_IMAGES = {
|
changeAppStatus,
|
||||||
1: qvc, // QVC
|
setDeepLink,
|
||||||
2: hsn, // HSN
|
setExitApp,
|
||||||
4: ontv4u, // ONTV
|
setHidePopup,
|
||||||
9: lgelectronics, // LG ELECTRONICS
|
setOptionalTermsPopupShown,
|
||||||
11: shoplc, // SHOPLC
|
setShowPopup,
|
||||||
16: koreaKiosk, // KOREA KIOSK
|
updateOptionalTermsAgreement,
|
||||||
19: Pinkfong, // PINKFONG
|
} from '../../actions/commonActions';
|
||||||
};
|
import { getWelcomeEventInfo } from '../../actions/eventActions';
|
||||||
|
import {
|
||||||
|
checkEnterThroughGNB,
|
||||||
|
getHomeLayout,
|
||||||
|
getHomeMainContents,
|
||||||
|
updateHomeInfo,
|
||||||
|
} from '../../actions/homeActions';
|
||||||
|
import {
|
||||||
|
sendLogGNB,
|
||||||
|
sendLogTotalRecommend,
|
||||||
|
} from '../../actions/logActions';
|
||||||
|
import {
|
||||||
|
getSubCategory,
|
||||||
|
getTop20Show,
|
||||||
|
} from '../../actions/mainActions';
|
||||||
|
import { setMyPageTermsAgree } from '../../actions/myPageActions';
|
||||||
|
import { getHomeOnSaleInfo } from '../../actions/onSaleActions';
|
||||||
|
import { updatePanel } from '../../actions/panelActions';
|
||||||
|
import {
|
||||||
|
finishVideoPreview,
|
||||||
|
hideModalVideo,
|
||||||
|
showModalVideo,
|
||||||
|
startVideoPlayerNew,
|
||||||
|
} from '../../actions/playActions';
|
||||||
|
import { getBestSeller } from '../../actions/productActions';
|
||||||
|
import OptionalConfirm from '../../components/Optional/OptionalConfirm';
|
||||||
|
import TBody from '../../components/TBody/TBody';
|
||||||
|
import TButton, { TYPES } from '../../components/TButton/TButton';
|
||||||
|
import TPanel from '../../components/TPanel/TPanel';
|
||||||
|
import TNewPopUp from '../../components/TPopUp/TNewPopUp';
|
||||||
|
import TPopUp from '../../components/TPopUp/TPopUp';
|
||||||
|
import TVerticalPagenator
|
||||||
|
from '../../components/TVerticalPagenator/TVerticalPagenator';
|
||||||
|
import useDebugKey from '../../hooks/useDebugKey';
|
||||||
|
import { useFocusHistory } from '../../hooks/useFocusHistory/useFocusHistory';
|
||||||
|
import usePrevious from '../../hooks/usePrevious';
|
||||||
|
import { useVideoPlay } from '../../hooks/useVideoPlay/useVideoPlay';
|
||||||
// [COMMENTED OUT] useVideoMove 관련 코드 주석 처리 - 향후 사용 검토 필요
|
// [COMMENTED OUT] useVideoMove 관련 코드 주석 처리 - 향후 사용 검토 필요
|
||||||
// import { useVideoMove } from '../../hooks/useVideoTransition/useVideoMove';
|
// import { useVideoMove } from '../../hooks/useVideoTransition/useVideoMove';
|
||||||
// =======
|
// =======
|
||||||
@@ -100,7 +97,9 @@ import {
|
|||||||
LOG_MESSAGE_ID,
|
LOG_MESSAGE_ID,
|
||||||
panel_names,
|
panel_names,
|
||||||
} from '../../utils/Config';
|
} from '../../utils/Config';
|
||||||
|
import { createDebugHelpers } from '../../utils/debug';
|
||||||
import { $L } from '../../utils/helperMethods';
|
import { $L } from '../../utils/helperMethods';
|
||||||
|
import ImagePreloader from '../../utils/ImagePreloader';
|
||||||
import { SpotlightIds } from '../../utils/SpotlightIds';
|
import { SpotlightIds } from '../../utils/SpotlightIds';
|
||||||
import BestSeller from '../HomePanel/BestSeller/BestSeller';
|
import BestSeller from '../HomePanel/BestSeller/BestSeller';
|
||||||
import HomeBanner from '../HomePanel/HomeBanner/HomeBanner';
|
import HomeBanner from '../HomePanel/HomeBanner/HomeBanner';
|
||||||
@@ -111,6 +110,21 @@ import SubCategory from '../HomePanel/SubCategory/SubCategory';
|
|||||||
import EventPopUpBanner from './EventPopUpBanner/EventPopUpBanner';
|
import EventPopUpBanner from './EventPopUpBanner/EventPopUpBanner';
|
||||||
import PickedForYou from './PickedForYou/PickedForYou';
|
import PickedForYou from './PickedForYou/PickedForYou';
|
||||||
|
|
||||||
|
// 디버그 헬퍼 설정
|
||||||
|
const DEBUG_MODE = false;
|
||||||
|
const { dlog, dwarn, derror } = createDebugHelpers(DEBUG_MODE);
|
||||||
|
|
||||||
|
// 파트너사별 배경 이미지 맵
|
||||||
|
const BACKGROUND_IMAGES = {
|
||||||
|
1: qvc, // QVC
|
||||||
|
2: hsn, // HSN
|
||||||
|
4: ontv4u, // ONTV
|
||||||
|
9: lgelectronics, // LG ELECTRONICS
|
||||||
|
11: shoplc, // SHOPLC
|
||||||
|
16: koreaKiosk, // KOREA KIOSK
|
||||||
|
19: Pinkfong, // PINKFONG
|
||||||
|
};
|
||||||
|
|
||||||
export const TEMPLATE_CODE_CONF = {
|
export const TEMPLATE_CODE_CONF = {
|
||||||
TOP: 'DSP00101',
|
TOP: 'DSP00101',
|
||||||
CATEGORY_ITEM: 'DSP00102',
|
CATEGORY_ITEM: 'DSP00102',
|
||||||
@@ -399,6 +413,9 @@ const HomePanel = ({ isOnTop, showGradientBackground = false }) => {
|
|||||||
optionalTerms: 'Y',
|
optionalTerms: 'Y',
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
setTimeout(()=>{
|
||||||
|
Spotlight.focus('home_tbody');
|
||||||
|
},100)
|
||||||
}, [handleOptionalAgree, dispatch, currentTermsFlag]);
|
}, [handleOptionalAgree, dispatch, currentTermsFlag]);
|
||||||
|
|
||||||
const handleOptionalDeclineClick = useCallback(() => {
|
const handleOptionalDeclineClick = useCallback(() => {
|
||||||
@@ -407,6 +424,9 @@ const HomePanel = ({ isOnTop, showGradientBackground = false }) => {
|
|||||||
}
|
}
|
||||||
dispatch(updateOptionalTermsAgreement(false));
|
dispatch(updateOptionalTermsAgreement(false));
|
||||||
setIsOptionalConfirmVisible(false);
|
setIsOptionalConfirmVisible(false);
|
||||||
|
setTimeout(()=>{
|
||||||
|
Spotlight.focus('home_tbody');
|
||||||
|
},100)
|
||||||
}, [dispatch]);
|
}, [dispatch]);
|
||||||
|
|
||||||
const handleTermsPopupClosed = useCallback(() => {
|
const handleTermsPopupClosed = useCallback(() => {
|
||||||
|
|||||||
Reference in New Issue
Block a user