|
|
|
|
@@ -4,16 +4,19 @@ import React, {
|
|
|
|
|
useMemo,
|
|
|
|
|
useRef,
|
|
|
|
|
useState,
|
|
|
|
|
} from "react";
|
|
|
|
|
} from 'react';
|
|
|
|
|
|
|
|
|
|
import classNames from "classnames";
|
|
|
|
|
import { useDispatch, useSelector } from "react-redux";
|
|
|
|
|
import classNames from 'classnames';
|
|
|
|
|
import {
|
|
|
|
|
useDispatch,
|
|
|
|
|
useSelector,
|
|
|
|
|
} from 'react-redux';
|
|
|
|
|
|
|
|
|
|
import Spotlight from "@enact/spotlight";
|
|
|
|
|
import Spotlight from '@enact/spotlight';
|
|
|
|
|
import {
|
|
|
|
|
getContainerNavigableElements,
|
|
|
|
|
setContainerLastFocusedElement,
|
|
|
|
|
} from "@enact/spotlight/src/container";
|
|
|
|
|
} from '@enact/spotlight/src/container';
|
|
|
|
|
|
|
|
|
|
import {
|
|
|
|
|
changeAppStatus,
|
|
|
|
|
@@ -21,36 +24,47 @@ import {
|
|
|
|
|
setExitApp,
|
|
|
|
|
setHidePopup,
|
|
|
|
|
setShowPopup,
|
|
|
|
|
} from "../../actions/commonActions";
|
|
|
|
|
import { getWelcomeEventInfo } from "../../actions/eventActions";
|
|
|
|
|
} from '../../actions/commonActions';
|
|
|
|
|
import { getWelcomeEventInfo } from '../../actions/eventActions';
|
|
|
|
|
import {
|
|
|
|
|
checkEnterThroughGNB,
|
|
|
|
|
getHomeLayout,
|
|
|
|
|
getHomeMainContents,
|
|
|
|
|
updateHomeInfo,
|
|
|
|
|
} from "../../actions/homeActions";
|
|
|
|
|
import { sendLogGNB } from "../../actions/logActions";
|
|
|
|
|
import { getSubCategory, getTop20Show } from "../../actions/mainActions";
|
|
|
|
|
import { getHomeOnSaleInfo } from "../../actions/onSaleActions";
|
|
|
|
|
import { finishVideoPreview } from "../../actions/playActions";
|
|
|
|
|
import { getBestSeller } from "../../actions/productActions";
|
|
|
|
|
import TBody from "../../components/TBody/TBody";
|
|
|
|
|
import TButton, { TYPES } from "../../components/TButton/TButton";
|
|
|
|
|
import TPanel from "../../components/TPanel/TPanel";
|
|
|
|
|
import TPopUp from "../../components/TPopUp/TPopUp";
|
|
|
|
|
import TVerticalPagenator from "../../components/TVerticalPagenator/TVerticalPagenator";
|
|
|
|
|
import useDebugKey from "../../hooks/useDebugKey";
|
|
|
|
|
import usePrevious from "../../hooks/usePrevious";
|
|
|
|
|
import { ACTIVE_POPUP, LOG_MENU, panel_names } from "../../utils/Config";
|
|
|
|
|
import { $L } from "../../utils/helperMethods";
|
|
|
|
|
import { SpotlightIds } from "../../utils/SpotlightIds";
|
|
|
|
|
import BestSeller from "../HomePanel/BestSeller/BestSeller";
|
|
|
|
|
import HomeBanner from "../HomePanel/HomeBanner/HomeBanner";
|
|
|
|
|
import HomeOnSale from "../HomePanel/HomeOnSale/HomeOnSale";
|
|
|
|
|
import css from "../HomePanel/HomePanel.module.less";
|
|
|
|
|
import PopularShow from "../HomePanel/PopularShow/PopularShow";
|
|
|
|
|
import SubCategory from "../HomePanel/SubCategory/SubCategory";
|
|
|
|
|
import EventPopUpBanner from "./EventPopUpBanner/EventPopUpBanner";
|
|
|
|
|
} from '../../actions/homeActions';
|
|
|
|
|
import {
|
|
|
|
|
sendLogGNB,
|
|
|
|
|
sendLogTotalRecommend,
|
|
|
|
|
} from '../../actions/logActions';
|
|
|
|
|
import {
|
|
|
|
|
getSubCategory,
|
|
|
|
|
getTop20Show,
|
|
|
|
|
} from '../../actions/mainActions';
|
|
|
|
|
import { getHomeOnSaleInfo } from '../../actions/onSaleActions';
|
|
|
|
|
import { finishVideoPreview } from '../../actions/playActions';
|
|
|
|
|
import { getBestSeller } from '../../actions/productActions';
|
|
|
|
|
import TBody from '../../components/TBody/TBody';
|
|
|
|
|
import TButton, { TYPES } from '../../components/TButton/TButton';
|
|
|
|
|
import TPanel from '../../components/TPanel/TPanel';
|
|
|
|
|
import TPopUp from '../../components/TPopUp/TPopUp';
|
|
|
|
|
import TVerticalPagenator
|
|
|
|
|
from '../../components/TVerticalPagenator/TVerticalPagenator';
|
|
|
|
|
import useDebugKey from '../../hooks/useDebugKey';
|
|
|
|
|
import usePrevious from '../../hooks/usePrevious';
|
|
|
|
|
import {
|
|
|
|
|
ACTIVE_POPUP,
|
|
|
|
|
LOG_MENU,
|
|
|
|
|
panel_names,
|
|
|
|
|
} from '../../utils/Config';
|
|
|
|
|
import { $L } from '../../utils/helperMethods';
|
|
|
|
|
import { SpotlightIds } from '../../utils/SpotlightIds';
|
|
|
|
|
import BestSeller from '../HomePanel/BestSeller/BestSeller';
|
|
|
|
|
import HomeBanner from '../HomePanel/HomeBanner/HomeBanner';
|
|
|
|
|
import HomeOnSale from '../HomePanel/HomeOnSale/HomeOnSale';
|
|
|
|
|
import css from '../HomePanel/HomePanel.module.less';
|
|
|
|
|
import PopularShow from '../HomePanel/PopularShow/PopularShow';
|
|
|
|
|
import SubCategory from '../HomePanel/SubCategory/SubCategory';
|
|
|
|
|
import EventPopUpBanner from './EventPopUpBanner/EventPopUpBanner';
|
|
|
|
|
|
|
|
|
|
export const TEMPLATE_CODE_CONF = {
|
|
|
|
|
TOP: "DSP00101",
|
|
|
|
|
@@ -117,7 +131,7 @@ const HomePanel = ({ isOnTop }) => {
|
|
|
|
|
);
|
|
|
|
|
const [cateCd, setCateCd] = useState(panelInfo.currentCatCd ?? null);
|
|
|
|
|
const [cateNm, setCateNm] = useState(panelInfo.currentCateName ?? null);
|
|
|
|
|
|
|
|
|
|
const { entryMenu, nowMenu } = useSelector((state) => state.common.menu);
|
|
|
|
|
const [focusedContainerId, setFocusedContainerId] = useState(
|
|
|
|
|
panelInfo.focusedContainerId
|
|
|
|
|
);
|
|
|
|
|
@@ -126,6 +140,17 @@ const HomePanel = ({ isOnTop }) => {
|
|
|
|
|
const verticalPagenatorRef = useRef(null);
|
|
|
|
|
const currentSentMenuRef = useRef(null);
|
|
|
|
|
|
|
|
|
|
useEffect(() => {
|
|
|
|
|
if (nowMenu === "Home/Top") {
|
|
|
|
|
dispatch(
|
|
|
|
|
sendLogTotalRecommend({
|
|
|
|
|
messageId: "AL_HOME_SHOWN",
|
|
|
|
|
contextName: "shoptime.home",
|
|
|
|
|
})
|
|
|
|
|
);
|
|
|
|
|
}
|
|
|
|
|
}, [entryMenu, nowMenu]);
|
|
|
|
|
|
|
|
|
|
const sortedHomeLayoutInfo = useMemo(() => {
|
|
|
|
|
if (homeLayoutInfo && homeLayoutInfo.homeLayoutInfo) {
|
|
|
|
|
const sorted = [...homeLayoutInfo.homeLayoutInfo].sort(
|
|
|
|
|
|