From bde1fb4eef5a1aba9fee317d253018e552e21376 Mon Sep 17 00:00:00 2001 From: "junghoon86.park" Date: Mon, 10 Nov 2025 19:31:07 +0900 Subject: [PATCH] =?UTF-8?q?[=ED=8F=AC=EC=9C=A0=20=EC=9E=91=EC=97=85]#3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - foryouaction,reducer 받는부분 변경 및 추가 . - 베스트셀러,픽포유,파퓰러쇼,저스트포유패널 노출 변경 및 수정 작업 - 홈배너 데이터 불러오는부분 수정 및 변경. --- .../src/actions/actionTypes.js | 1 + .../src/actions/forYouActions.js | 31 +++++++++ com.twin.app.shoptime/src/api/apiConfig.js | 2 + .../src/reducers/forYouReducer.js | 6 ++ .../views/HomePanel/BestSeller/BestSeller.jsx | 33 +++++++-- .../views/HomePanel/HomeBanner/HomeBanner.jsx | 8 +-- .../HomePanel/PickedForYou/PickedForYou.jsx | 9 +-- .../HomePanel/PopularShow/PopularShow.jsx | 67 ++++++++++++------- .../JustForYouTestPanel.jsx | 42 +++++------- 9 files changed, 132 insertions(+), 67 deletions(-) diff --git a/com.twin.app.shoptime/src/actions/actionTypes.js b/com.twin.app.shoptime/src/actions/actionTypes.js index ba5f877d..fe993c2b 100644 --- a/com.twin.app.shoptime/src/actions/actionTypes.js +++ b/com.twin.app.shoptime/src/actions/actionTypes.js @@ -313,6 +313,7 @@ export const types = { GET_LIKE_BRAND_PRODUCT: 'GET_LIKE_BRAND_PRODUCT', GET_MORE_TO_CONCIDER_AT_THIS_PRICE: 'GET_MORE_TO_CONCIDER_AT_THIS_PRICE', GET_JUSTFORYOU_INFO: 'GET_JUSTFORYOU_INFO', + JUSTFORYOU: 'JUSTFORYOU', // 🔽 Voice Conductor 관련 액션 타입 VOICE_REGISTER_SUCCESS: 'VOICE_REGISTER_SUCCESS', diff --git a/com.twin.app.shoptime/src/actions/forYouActions.js b/com.twin.app.shoptime/src/actions/forYouActions.js index 5844d7df..2caa8c99 100644 --- a/com.twin.app.shoptime/src/actions/forYouActions.js +++ b/com.twin.app.shoptime/src/actions/forYouActions.js @@ -54,3 +54,34 @@ export const getJustForYouInfo = (callback) => (dispatch, getState) => { onFail ); }; + +export const justForYou = (callback) => (dispatch, getState) => { + const macAddress = getState().common.macAddress; + const macAddr = macAddress?.wired || macAddress?.wifi || "00:1A:2B:3C:4D:5E"; + const onSuccess = (response) => { + console.log("JustForYou onSuccess", response.data); + dispatch({ + type: types.JUSTFORYOU, + payload: get("data.data", response), + }); + dispatch(changeAppStatus({ showLoadingPanel: { show: false } })); + callback && callback(); + }; + + const onFail = (error) => { + console.error("JustForYou onFail", error); + dispatch(changeAppStatus({ showLoadingPanel: { show: false } })); + callback && callback(); + }; + + TAxios( + dispatch, + getState, + "post", + URLS.JUSTFORYOU, + {}, + {macAddr}, + onSuccess, + onFail + ); +}; diff --git a/com.twin.app.shoptime/src/api/apiConfig.js b/com.twin.app.shoptime/src/api/apiConfig.js index b8e8d15f..270e3f98 100644 --- a/com.twin.app.shoptime/src/api/apiConfig.js +++ b/com.twin.app.shoptime/src/api/apiConfig.js @@ -143,6 +143,8 @@ export const URLS = { // foryou controller GET_JUSTFORYOU_INFO: "/lgsp/v1/justforyou/list.lge", + JUSTFORYOU: "/lgsp/v1/recommend/justforyou.lge", + // emp controller GET_SHOPTIME_TERMS: "/lgsp/v1/emp/shoptime/terms.lge", diff --git a/com.twin.app.shoptime/src/reducers/forYouReducer.js b/com.twin.app.shoptime/src/reducers/forYouReducer.js index c899f5d4..ffa540a3 100644 --- a/com.twin.app.shoptime/src/reducers/forYouReducer.js +++ b/com.twin.app.shoptime/src/reducers/forYouReducer.js @@ -13,6 +13,7 @@ import { // }; const initialState = { justForYouInfo: {}, + recommendInfo: {}, }; // const foryouReducer = (state = initialState, action) => { @@ -47,8 +48,13 @@ const justForYouInfo = curry((state, action) => set("justForYouInfo", get("payload", action), state) ); +const recommendInfo = curry((state, action) => + set("recommendInfo", get("payload", action), state) +); + const handlers = { [types.GET_JUSTFORYOU_INFO]: justForYouInfo, + [types.JUSTFORYOU]: recommendInfo, }; export const foryouReducer = (state = initialState, action = {}) => { diff --git a/com.twin.app.shoptime/src/views/HomePanel/BestSeller/BestSeller.jsx b/com.twin.app.shoptime/src/views/HomePanel/BestSeller/BestSeller.jsx index 6640e283..ad163fd4 100644 --- a/com.twin.app.shoptime/src/views/HomePanel/BestSeller/BestSeller.jsx +++ b/com.twin.app.shoptime/src/views/HomePanel/BestSeller/BestSeller.jsx @@ -67,11 +67,13 @@ const BestSeller = ({ const { cursorVisible } = useSelector((state) => state.common.appStatus); - + const bestSellerDatas = useSelector( + (state) => state.product.bestSellerData?.bestSeller + ); const bestSellerNewDatas = useSelector( (state) => - state.foryou?.justForYouInfo?.shelfInfos + state.foryou?.recommendInfo?.recommendProduct ); @@ -80,6 +82,7 @@ const BestSeller = ({ const [firstChk, setFirstChk] = useState(0); const [bestInfos, setBestInfos] = useState(null); + const [bestItemNewData, setBestItemNewData] = useState([]); useEffect(()=>{ setBestInfos( @@ -89,6 +92,24 @@ const BestSeller = ({ ) },[bestSellerNewDatas]) + useEffect(() => { + const recommendedData = bestInfos?.[0].productInfos?.slice(0, 2).map((item) => ({ + ...item, + foryou: true, + })) || []; + + const recommendedPrdtIds = new Set(recommendedData.map(item => item.prdtId)); + + const baseData = bestSellerDatas?.filter( + (item) => !recommendedPrdtIds.has(item.prdtId) + ).map((item) => ({ + ...item, + foryou: false, + })) || []; + + setBestItemNewData([...recommendedData, ...baseData]); + }, [bestSellerDatas, bestInfos?.[0].productInfos]); + const orderStyle = useMemo(() => ({ order: order }), [order]); useEffect(() => { @@ -213,8 +234,8 @@ const BestSeller = ({ cbScrollTo={getScrollTo} noScrollByWheel > - {bestInfos && - bestInfos?.[0].productInfos.map( + {bestItemNewData && + bestItemNewData.map( ( { prdtId, @@ -227,7 +248,7 @@ const BestSeller = ({ brndNm, patncNm, //catNm, 없음 - //foryou, + foryou, euEnrgLblInfos, }, itemIndex @@ -269,7 +290,7 @@ const BestSeller = ({ lastLabel=" go to detail, button" euEnrgLblInfos={euEnrgLblInfos} > - {/* {foryou === true && } */} + {foryou === true && } ); } diff --git a/com.twin.app.shoptime/src/views/HomePanel/HomeBanner/HomeBanner.jsx b/com.twin.app.shoptime/src/views/HomePanel/HomeBanner/HomeBanner.jsx index 182bf392..b57ed8e3 100644 --- a/com.twin.app.shoptime/src/views/HomePanel/HomeBanner/HomeBanner.jsx +++ b/com.twin.app.shoptime/src/views/HomePanel/HomeBanner/HomeBanner.jsx @@ -28,7 +28,7 @@ import { setOptionalTermsUserDecision, updateOptionalTermsAgreement, } from '../../../actions/commonActions'; -import { getJustForYouInfo } from '../../../actions/forYouActions'; +import { justForYou } from '../../../actions/forYouActions'; import { fetchCurrentUserHomeTerms, setDefaultFocus, @@ -39,11 +39,11 @@ import { pushPanel, } from '../../../actions/panelActions'; import { + clearAllVideoTimers, releasePlayControl, requestPlayControl, startVideoPlayer, startVideoPlayerNew, - clearAllVideoTimers, } from '../../../actions/playActions'; import CustomImage from '../../../components/CustomImage/CustomImage'; // import TButtonScroller from "../../../components/TButtonScroller/TButtonScroller"; @@ -82,8 +82,8 @@ export default function HomeBanner({ handleShelfFocus, }) { const dispatch = useDispatch(); - useEffect(() => { - dispatch(getJustForYouInfo()); + useEffect(() => { + dispatch(justForYou()); }, [dispatch]); const homeTopDisplayInfo = useSelector( (state) => state.home.homeTopDisplayInfo diff --git a/com.twin.app.shoptime/src/views/HomePanel/PickedForYou/PickedForYou.jsx b/com.twin.app.shoptime/src/views/HomePanel/PickedForYou/PickedForYou.jsx index f53a0f0a..540935d3 100644 --- a/com.twin.app.shoptime/src/views/HomePanel/PickedForYou/PickedForYou.jsx +++ b/com.twin.app.shoptime/src/views/HomePanel/PickedForYou/PickedForYou.jsx @@ -63,14 +63,9 @@ const PickedForYou = ({ const { cursorVisible } = useSelector((state) => state.common.appStatus); - const justForYouDatas = useSelector( - (state) => state.product.bestSellerData?.bestSeller - ); - const justForYouDatasNew = useSelector( - (state) => state.foryou?.justForYouInfo?.shelfInfos + (state) => state.foryou?.recommendInfo?.recommendProduct ) - const [drawChk, setDrawChk] = useState(false); const [firstChk, setFirstChk] = useState(0); @@ -89,7 +84,7 @@ const PickedForYou = ({ useEffect(() => { setDrawChk(true); - }, [justForYouDatas]); + }, [justForYouDatasNew]); const handleCardClick = useCallback( (patnrId, prdtId) => () => { diff --git a/com.twin.app.shoptime/src/views/HomePanel/PopularShow/PopularShow.jsx b/com.twin.app.shoptime/src/views/HomePanel/PopularShow/PopularShow.jsx index 7e5e80f7..a677a14e 100644 --- a/com.twin.app.shoptime/src/views/HomePanel/PopularShow/PopularShow.jsx +++ b/com.twin.app.shoptime/src/views/HomePanel/PopularShow/PopularShow.jsx @@ -71,17 +71,48 @@ const PopularShow = ({ const { cursorVisible } = useSelector((state) => state.common.appStatus); const topInfos = useSelector((state) => state.main.top20ShowData.topInfos); + const recommendInfo = useSelector((state) => state.foryou?.recommendInfo?.recommendShow); + - const [drawChk, setDrawChk] = useState(false); const orderStyle = useMemo(() => ({ order: order }), [order]); - + const [drawChk, setDrawChk] = useState(false); const [firstChk, setFirstChk] = useState(0); + const [showInfos, setShowInfos] = useState(null); + const [showNewInfos, setShowNewInfos] = useState([]); + useEffect(() => { - setDrawChk(true); + setDrawChk(true); }, [topInfos]); + useEffect(()=>{ + setShowInfos( + recommendInfo?.filter( + (item) => item.recommendTpCd === "POPULARSHOW" + ) + ) + },[recommendInfo]) + + useEffect(() => { + const recommendedData = showInfos?.[0].showInfos?.slice(0, 2).map((item) => ({ + ...item, + foryou: true, + })) || []; + + const recommendedPrdtIds = new Set(recommendedData?.map(item => item.showId)); + + const baseData = topInfos?.filter( + (item) => !recommendedPrdtIds.has(item.showId) + ).map((item) => ({ + ...item, + foryou: false, + })) || []; + setShowNewInfos([...recommendedData, ...baseData]); + }, [topInfos, showInfos?.[0].showInfos]); + + + const handleCardClick = useCallback( (patnrId, showId, catCd, showUrl) => () => { dispatch( @@ -187,23 +218,7 @@ const PopularShow = ({ if (handleShelfFocus) { handleShelfFocus(); } - }, [handleShelfFocus]); - - const [topInfosNewData, setTopInfosNewData] = useState([]); - - const _randomProduct = useCallback(() => { - const randomChk = Math.round(Math.random()) === 0 ? false : true; - return randomChk; - }, []); - - useEffect(() => { - setTopInfosNewData( - topInfos?.map((item) => ({ - ...item, - // foryou: _randomProduct(), - })) - ); - }, [topInfos]); + }, [handleShelfFocus]); return ( - {topInfosNewData && - topInfosNewData.map( + {showNewInfos && + showNewInfos.map( ( { showId, @@ -240,7 +255,7 @@ const PopularShow = ({ patncNm, catCd, showUrl, - //foryou, + foryou, }, itemIndex ) => { @@ -258,9 +273,11 @@ const PopularShow = ({ contentId={showId} contentTitle={showNm} imageSource={ + (thumbnailUrl && thumbnailUrl960) ? thumbnailUrl !== thumbnailUrl960 ? thumbnailUrl960 : thumbnailUrl + : thumbnailUrl } imageAlt={showNm} productName={showNm} @@ -277,10 +294,10 @@ const PopularShow = ({ onBlur={handleBlur(itemIndex)} onClick={handleCardClick(patnrId, showId, catCd, showUrl)} firstLabel={patncNm + " "} - label={itemIndex * 1 + 1 + " of " + topInfos.length} + label={itemIndex * 1 + 1 + " of " + showNewInfos.length} lastLabel=" go to detail, button" > - {/* {foryou === true && } */} + {foryou === true && } ); } diff --git a/com.twin.app.shoptime/src/views/JustForYouTestPanel/JustForYouTestPanel.jsx b/com.twin.app.shoptime/src/views/JustForYouTestPanel/JustForYouTestPanel.jsx index 3ebef3e9..b9d5e928 100644 --- a/com.twin.app.shoptime/src/views/JustForYouTestPanel/JustForYouTestPanel.jsx +++ b/com.twin.app.shoptime/src/views/JustForYouTestPanel/JustForYouTestPanel.jsx @@ -47,11 +47,11 @@ const JustForYouTestPanel = ({ panelInfo, ...rest }) => { const cbChangePageRef = useRef(null); const shelfInfos = useSelector( - (state) => state.foryou?.justForYouInfo?.shelfInfos + (state) => state.foryou?.recommendInfo?.recommendProduct ); const justForYouInfo = useSelector( - (state) => state.foryou?.justForYouInfo?.justForYouInfo + (state) => state.foryou?.recommendInfo?.justForYouInfo ); const onClick = useCallback(() => { @@ -80,25 +80,19 @@ const JustForYouTestPanel = ({ panelInfo, ...rest }) => { } const product = productInfos[index]; - const { - contentId, - title, - thumbnail, - price, - dcPrice, - partnerName, - partnerLogo, + const { + prdtNm, + imgUrl, + priceInfo, + patncNm, + patnrId, + prdtId, } = product; const handleItemClick = () => { - // Extract product ID from contentId if needed - const tokens = contentId.split("_"); - const patnrId = tokens?.[4] || ""; - const prdtId = tokens?.[5] || ""; dispatch( pushPanel({ - name: panel_names.DETAIL_PANEL, - // panelInfo: { prdtId: contentId }, + name: panel_names.DETAIL_PANEL, panelInfo: { patnrId: patnrId, prdtId: prdtId, @@ -109,16 +103,14 @@ const JustForYouTestPanel = ({ panelInfo, ...rest }) => { return ( { key={shelf.shelfId} className={classNames( css.itemsContainer, - shelfIndex === 0 && css.itemsContinerFirst + shelfIndex === 1 && css.itemsContinerFirst )} spotlightId={`justForYouList_${shelf.shelfExpsOrd}`} data-wheel-point