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

[HomePanel] SHOPTIME-2640 : Home / BEST SELLER / 데이터가 없으면 Section 이 숨겨져야 함

Browse Source
This commit is contained in:
jiwon93.son
2024-06-25 10:44:49 +09:00
parent dcef1edc4c
commit 76d5398a96
1 changed files with 100 additions and 59 deletions
Download Patch File Download Diff File Expand all files Collapse all files

159
com.twin.app.shoptime/src/views/HomePanel/HomePanel.jsx
View File

@@ -4,48 +4,59 @@ 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 {
changeAppStatus,
setExitApp,
setHidePopup,
setShowPopup,
} from "../../actions/commonActions";
import { getWelcomeEventInfo } from "../../actions/eventActions";
} from '../../actions/commonActions';
import { getWelcomeEventInfo } from '../../actions/eventActions';
import {
checkEnterThroughGNB,
getHomeLayout,
getHomeMainContents,
updateSpotlightId,
} from "../../actions/homeActions";
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 useLogService from "../../hooks/useLogService";
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 {
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 useLogService from '../../hooks/useLogService';
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';
const TEMPLATE_CODE_CONF = {
TOP: "DSP00101",
@@ -78,6 +89,10 @@ export default function HomePanel({ isOnTop }) {
(state) => state.onSale.homeOnSaleData?.data?.categoryInfos
);
const categoryItemInfos = useSelector(
(state) => state.main.subCategoryData?.categoryItemInfos
);
const { popupVisible, activePopup } = useSelector(
(state) => state.common.popup
);
@@ -89,6 +104,14 @@ export default function HomePanel({ isOnTop }) {
const eventClickSuccess = useSelector(
(state) => state.event.eventClickSuccess
);
const homeOnSaleInfos = useSelector(
(state) => state.onSale.homeOnSaleData?.data.homeOnSaleInfos
);
const bestSellerDatas = useSelector(
(state) => state.product.bestSellerData?.bestSeller
);
const topInfos = useSelector((state) => state.main.top20ShowData.topInfos);
const [btnDisabled, setBtnDisabled] = useState(true);
const [arrowBottom, setArrowBottom] = useState(true);
const [firstSpot, setFirstSpot] = useState(false);
@@ -221,42 +244,55 @@ export default function HomePanel({ isOnTop }) {
);
}
case TEMPLATE_CODE_CONF.CATEGORY_ITEM: {
return (
<SubCategory
key={el.shptmApphmDspyOptCd}
spotlightId={el.shptmApphmDspyOptCd}
catCd={cateCd}
cateNm={cateNm}
handleItemFocus={handleItemFocus(el.shptmApphmDspyOptCd)}
/>
);
if (
categoryInfos &&
categoryInfos.length > 0 &&
categoryItemInfos?.subCatItemList &&
categoryItemInfos.subCatItemList.length > 0
) {
return (
<SubCategory
key={el.shptmApphmDspyOptCd}
spotlightId={el.shptmApphmDspyOptCd}
catCd={cateCd}
cateNm={cateNm}
handleItemFocus={handleItemFocus(el.shptmApphmDspyOptCd)}
/>
);
} else break;
}
case TEMPLATE_CODE_CONF.ON_SALE: {
return (
<HomeOnSale
key={el.shptmApphmDspyOptCd}
spotlightId={el.shptmApphmDspyOptCd}
handleItemFocus={handleItemFocus(el.shptmApphmDspyOptCd)}
/>
);
if (homeOnSaleInfos && homeOnSaleInfos.length > 0) {
return (
<HomeOnSale
key={el.shptmApphmDspyOptCd}
spotlightId={el.shptmApphmDspyOptCd}
handleItemFocus={handleItemFocus(el.shptmApphmDspyOptCd)}
/>
);
} else break;
}
case TEMPLATE_CODE_CONF.POPULAR_SHOW: {
return (
<PopularShow
key={el.shptmApphmDspyOptCd}
spotlightId={el.shptmApphmDspyOptCd}
handleItemFocus={handleItemFocus(el.shptmApphmDspyOptCd)}
/>
);
if (topInfos && topInfos.length > 0) {
return (
<PopularShow
key={el.shptmApphmDspyOptCd}
spotlightId={el.shptmApphmDspyOptCd}
handleItemFocus={handleItemFocus(el.shptmApphmDspyOptCd)}
/>
);
} else break;
}
case TEMPLATE_CODE_CONF.BEST_SELLER: {
return (
<BestSeller
key={el.shptmApphmDspyOptCd}
spotlightId={el.shptmApphmDspyOptCd}
handleItemFocus={handleItemFocus(el.shptmApphmDspyOptCd)}
/>
);
if (bestSellerDatas && bestSellerDatas.length > 0) {
return (
<BestSeller
key={el.shptmApphmDspyOptCd}
spotlightId={el.shptmApphmDspyOptCd}
handleItemFocus={handleItemFocus(el.shptmApphmDspyOptCd)}
/>
);
} else break;
}
}
})}
@@ -282,6 +318,11 @@ export default function HomePanel({ isOnTop }) {
handleTopButtonClick,
btnDisabled,
panelInfo.focusedContainerId,
categoryItemInfos,
categoryInfos,
homeOnSaleInfos,
bestSellerDatas,
topInfos,
]);
const _onScrollStatusChanged = useCallback((status) => {