diff --git a/com.twin.app.shoptime/src/actions/actionTypes.js b/com.twin.app.shoptime/src/actions/actionTypes.js index 2fbec17a..b74e98b4 100644 --- a/com.twin.app.shoptime/src/actions/actionTypes.js +++ b/com.twin.app.shoptime/src/actions/actionTypes.js @@ -60,6 +60,7 @@ export const types = { GET_BRAND_CREATORS_INFO: "GET_BRAND_CREATORS_INFO", GET_BRAND_SHOWROOM: "GET_BRAND_SHOWROOM", SET_BRAND_LIVE_CHANNEL_UPCOMING: "SET_BRAND_LIVE_CHANNEL_UPCOMING", + SET_BRAND_CHAN_INFO: "SET_BRAND_CHAN_INFO", // main actions GET_SUB_CATEGORY: "GET_SUB_CATEGORY", diff --git a/com.twin.app.shoptime/src/actions/brandActions.js b/com.twin.app.shoptime/src/actions/brandActions.js index e4502c4a..8b71cdb3 100644 --- a/com.twin.app.shoptime/src/actions/brandActions.js +++ b/com.twin.app.shoptime/src/actions/brandActions.js @@ -425,3 +425,29 @@ export const setBrandLiveChannelUpcoming = (props) => (dispatch, getState) => { }, }); }; + +export const setBrandChanInfo = (props) => (dispatch, getState) => { + const { showId, strtDt } = props; + + const storedBrandLiveChanInfo = + getState().brand.brandLiveChannelInfoData.data.brandChanInfo; + + const brandChanInfo = storedBrandLiveChanInfo.map((item) => { + if (item.showId === showId && item.strtDt === strtDt) { + item.alamDispFlag = item.alamDispFlag === "Y" ? "N" : "Y"; + } + + return item; + }); + + dispatch({ + type: types.SET_BRAND_CHAN_INFO, + payload: { + ...getState().brand.brandLiveChannelInfoData, + data: { + ...getState().brand.brandLiveChannelInfoData.data, + brandChanInfo, + }, + }, + }); +}; diff --git a/com.twin.app.shoptime/src/reducers/brandReducer.js b/com.twin.app.shoptime/src/reducers/brandReducer.js index f477de97..da0987a5 100644 --- a/com.twin.app.shoptime/src/reducers/brandReducer.js +++ b/com.twin.app.shoptime/src/reducers/brandReducer.js @@ -142,6 +142,12 @@ export const brandReducer = (state = initialState, action) => { brandLiveChannelInfoData: action.payload, }; + case types.SET_BRAND_CHAN_INFO: + return { + ...state, + brandLiveChannelInfoData: action.payload, + }; + default: return state; } diff --git a/com.twin.app.shoptime/src/views/FeaturedBrandsPanel/LiveChannels/NoLiveContents/NoLiveCard/NoLiveCard.jsx b/com.twin.app.shoptime/src/views/FeaturedBrandsPanel/LiveChannels/NoLiveContents/NoLiveCard/NoLiveCard.jsx index 479f0470..00ee6ad2 100644 --- a/com.twin.app.shoptime/src/views/FeaturedBrandsPanel/LiveChannels/NoLiveContents/NoLiveCard/NoLiveCard.jsx +++ b/com.twin.app.shoptime/src/views/FeaturedBrandsPanel/LiveChannels/NoLiveContents/NoLiveCard/NoLiveCard.jsx @@ -1,11 +1,11 @@ -import React, { memo, useCallback } from "react"; +import React, { memo, useCallback, useState } from "react"; import classNames from "classnames"; import { useDispatch, useSelector } from "react-redux"; import IcUpcomingsNormal from "../../../../../../assets/images/badge/ic-upcomings-nor@3x.png"; import IcUpcomingsReserved from "../../../../../../assets/images/badge/ic-upcomings-sel@3x.png"; -import { setBrandLiveChannelUpcoming } from "../../../../../actions/brandActions"; +import { setBrandChanInfo } from "../../../../../actions/brandActions"; import { setShowPopup } from "../../../../../actions/commonActions"; import { setMainLiveUpcomingAlarm } from "../../../../../actions/mainActions"; import TButton from "../../../../../components/TButton/TButton"; @@ -31,6 +31,8 @@ export default memo(function NoLiveCard({ brandChanInfoItem, scrollTopBody }) { (state) => state.myPage.upComingData?.upComingAlertShow?.upcomAlamUseFlag ); + const [, forceUpdate] = useState({}); + const { alamDispFlag, // UpComming 알람 여부 brandProductInfo, // 상품 정보 Array @@ -54,6 +56,8 @@ export default memo(function NoLiveCard({ brandChanInfoItem, scrollTopBody }) { // vtctpYn, // 영상 세로형 여부 } = brandChanInfoItem; + const isReserved = alamDispFlag === "Y"; + const handleReminderButton = useCallback(() => { if (upcomAlamUseFlag === "N") { return dispatch(setShowPopup()); @@ -61,7 +65,7 @@ export default memo(function NoLiveCard({ brandChanInfoItem, scrollTopBody }) { dispatch( setMainLiveUpcomingAlarm({ - alamDispFlag: alamDispFlag === "Y" ? "N" : "Y", + alamDispFlag: isReserved ? "N" : "Y", endDt, patnrId, showId, @@ -69,16 +73,9 @@ export default memo(function NoLiveCard({ brandChanInfoItem, scrollTopBody }) { }) ); - dispatch(setBrandLiveChannelUpcoming({ showId, strtDt })); - }, [ - alamDispFlag, - dispatch, - endDt, - patnrId, - showId, - strtDt, - upcomAlamUseFlag, - ]); + dispatch(setBrandChanInfo({ showId, strtDt })); + forceUpdate({}); + }, [dispatch, endDt, isReserved, patnrId, showId, strtDt, upcomAlamUseFlag]); const handleAiredButton = useCallback(() => { // pyh, PlayerPanel 완료 뒤 action 추가 @@ -112,7 +109,7 @@ export default memo(function NoLiveCard({ brandChanInfoItem, scrollTopBody }) {
@@ -125,7 +122,7 @@ export default memo(function NoLiveCard({ brandChanInfoItem, scrollTopBody }) { onFocus={handleFocus} size={null} > - {alamDispFlag === "Y" + {isReserved ? STRING_CONF.REMOVE_REMINDER : STRING_CONF.SET_REMINDER}