[SHOPTIME-3369] Featured Brands / Live channels 특정채널 배너 적용

1. asset/img-brands-juvelirochka@3x.png, img-brands-shop-lc@3x.png 추가
2. LiveChannelsVerticalContents.jsx
3. LiveChannelsVerticalContents.module.less
- 원인: 없음
- 대책: 러시아 환경, Juvelirochaka 브랜드에 한하여 특정 배너 반영
This commit is contained in:
younghoon100.park
2024-10-23 16:01:53 +09:00
parent bd1167a947
commit a81cf3c0e1
4 changed files with 50 additions and 13 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 178 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 24 KiB

View File

@@ -1,4 +1,11 @@
import React, { memo, useCallback, useEffect, useRef, useState } from "react"; import React, {
memo,
useCallback,
useEffect,
useMemo,
useRef,
useState,
} from "react";
import { useDispatch, useSelector } from "react-redux"; import { useDispatch, useSelector } from "react-redux";
@@ -10,13 +17,14 @@ import {
setContainerLastFocusedElement, setContainerLastFocusedElement,
} from "@enact/spotlight/src/container"; } from "@enact/spotlight/src/container";
import ImgNoData from "../../../../../assets/images/img-no-data@3x.png"; import ImgNoProductDefault from "../../../../../assets/images/img-no-data@3x.png";
import ImgNoProductJuvelirochka from "../../../../../assets/images/img-brands-juvelirochka@3x.png";
import ImgNoProductShopLC from "../../../../../assets/images/img-brands-shop-lc@3x.png";
import { updatePanel } from "../../../../actions/panelActions"; import { updatePanel } from "../../../../actions/panelActions";
import { import {
finishVideoPreview, finishVideoPreview,
startVideoPlayer, startVideoPlayer,
} from "../../../../actions/playActions"; } from "../../../../actions/playActions";
import { removeDotAndColon } from "../../../../components/TItemCard/TItemCard";
import { panel_names } from "../../../../utils/Config"; import { panel_names } from "../../../../utils/Config";
import { $L } from "../../../../utils/helperMethods"; import { $L } from "../../../../utils/helperMethods";
import css from "./LiveChannelsVerticalContents.module.less"; import css from "./LiveChannelsVerticalContents.module.less";
@@ -41,21 +49,24 @@ export default memo(function LiveChannelsVerticalContents({
}) { }) {
const dispatch = useDispatch(); const dispatch = useDispatch();
const cntry_cd = useSelector((state) => state.common.httpHeader?.cntry_cd);
const cursorVisible = useSelector( const cursorVisible = useSelector(
(state) => state.common.appStatus.cursorVisible (state) => state.common.appStatus.cursorVisible
); );
const [isFocused, setIsFocused] = useState(false); const [isFocused, setIsFocused] = useState(false);
const isFullScreenModeActivedRef = useRef(false); const isFullScreenModeActivedRef = useRef(false);
const videoFocusTimeoutJob = useRef(new Job((func) => func(), 1000)); const videoFocusTimeoutJob = useRef(new Job((func) => func(), 1000));
const { const { brandProductInfo, chanId, patnrId, showId, showUrl } =
brandProductInfo, // brandChanInfoItem;
chanId,
patnrId, const isJuvelirochka = useMemo(
showId, () => cntry_cd === "RU" && patnrId === "12",
showUrl,
} = brandChanInfoItem; [cntry_cd, patnrId]
);
useEffect(() => { useEffect(() => {
if (brandProductInfo && brandProductInfo.length > 0) { if (brandProductInfo && brandProductInfo.length > 0) {
@@ -162,6 +173,16 @@ export default memo(function LiveChannelsVerticalContents({
} }
}, [handleItemFocus]); }, [handleItemFocus]);
const getNoProductImg = useCallback((countryCode, partnerId) => {
let img = ImgNoProductDefault;
if (countryCode === "RU" && partnerId === "12") {
img = ImgNoProductJuvelirochka;
}
return img;
}, []);
return ( return (
<Container <Container
className={css.container} className={css.container}
@@ -189,8 +210,18 @@ export default memo(function LiveChannelsVerticalContents({
) : ( ) : (
<figure> <figure>
<div> <div>
<img src={ImgNoData} alt="" /> <img
<figcaption>{$L(STRING_CONF.NO_PRODUCT_MESSAGE)}</figcaption> className={
!isJuvelirochka
? css.noProductDefault
: css.noProductJuvelirochka
}
src={getNoProductImg(cntry_cd, patnrId)}
alt=""
/>
{!isJuvelirochka && (
<figcaption>{$L(STRING_CONF.NO_PRODUCT_MESSAGE)}</figcaption>
)}
</div> </div>
</figure> </figure>
)} )}

View File

@@ -20,7 +20,13 @@
background-color: @COLOR_WHITE; background-color: @COLOR_WHITE;
> img { > img {
.size(@w: 360px, @h: 180px); &.noProductDefault {
.size(@w: 360px, @h: 180px);
}
&.noProductJuvelirochka {
.size(@w: inherit, @h: inherit);
}
} }
> figcaption { > figcaption {