From ed1e69dea7cfbdbfeee6449060b4ef53e319dee1 Mon Sep 17 00:00:00 2001 From: kiremitrov123 Date: Tue, 28 Mar 2023 14:14:21 +0200 Subject: [PATCH] feat(project): jwp tvod implementation --- src/hooks/useOffers.ts | 14 ++++++-------- src/services/api.service.ts | 7 ++++--- src/services/inplayer.checkout.service.ts | 3 ++- 3 files changed, 12 insertions(+), 12 deletions(-) diff --git a/src/hooks/useOffers.ts b/src/hooks/useOffers.ts index 9d86c1455..0289084c5 100644 --- a/src/hooks/useOffers.ts +++ b/src/hooks/useOffers.ts @@ -1,5 +1,5 @@ import { useQuery } from 'react-query'; -import { useEffect, useMemo, useState } from 'react'; +import { useMemo, useState } from 'react'; import shallow from 'zustand/shallow'; import useClientIntegration from './useClientIntegration'; @@ -19,8 +19,10 @@ const useOffers = () => { if (!checkoutService) throw new Error('checkout service is not available'); const { requestedMediaOffers } = useCheckoutStore(({ requestedMediaOffers }) => ({ requestedMediaOffers }), shallow); + const hasTvodOffer = (requestedMediaOffers || []).some((offer) => offer.offerId); const hasPremierOffer = (requestedMediaOffers || []).some((offer) => offer.premier); - const [offerType, setOfferType] = useState(accessModel === 'SVOD' ? 'svod' : 'tvod'); + const isPPV = hasTvodOffer || hasPremierOffer; + const [offerType, setOfferType] = useState(accessModel === 'SVOD' && !isPPV ? 'svod' : 'tvod'); const offerIds: string[] = useMemo(() => { return [...(requestedMediaOffers || []).map(({ offerId }) => offerId), ...clientOffers].filter(Boolean); @@ -28,14 +30,10 @@ const useOffers = () => { const { data: allOffers = [], isLoading } = useQuery(['offers', offerIds.join('-')], () => checkoutService.getOffers({ offerIds }, sandbox)); - useEffect(() => { - if (isLoading) return; - if (hasPremierOffer) setOfferType('tvod'); - }, [isLoading, hasPremierOffer, setOfferType]); - // The `offerQueries` variable mutates on each render which prevents the useMemo to work properly. return useMemo(() => { const offers = allOffers.filter((offer: Offer) => (offerType === 'tvod' ? !isSVODOffer(offer) : isSVODOffer(offer))); + const offersDict = (!isLoading && Object.fromEntries(offers.map((offer: Offer) => [offer.offerId, offer]))) || {}; // we need to get the offerIds from the offer responses since it contains different offerIds based on the customers // location. E.g. if an offer is configured as `S12345678` it becomes `S12345678_US` in the US. @@ -51,7 +49,7 @@ const useOffers = () => { offers, offersDict, }; - }, [requestedMediaOffers, allOffers]); + }, [requestedMediaOffers, allOffers, offerType]); }; export default useOffers; diff --git a/src/services/api.service.ts b/src/services/api.service.ts index d46823e08..8767b9cd4 100644 --- a/src/services/api.service.ts +++ b/src/services/api.service.ts @@ -16,17 +16,19 @@ enum ImageProperty { /** * Transform incoming media items - * - Parses productId into MediaOffer[] for all cleeng offers + * - Parses productId into MediaOffer[] for all cleexng offers */ export const transformMediaItem = (item: PlaylistItem, playlist?: Playlist) => { const config = ConfigStore.getState().config; + const offerKeys = Object.keys(config?.integrations)[0]; + return { ...item, shelfImage: generateImageData(config, ImageProperty.SHELF, item, playlist), backgroundImage: generateImageData(config, ImageProperty.BACKGROUND, item), channelLogoImage: generateImageData(config, ImageProperty.CHANNEL_LOGO, item), - mediaOffers: item.productIds ? filterMediaOffers('cleeng', item.productIds) : undefined, + mediaOffers: item.productIds ? filterMediaOffers(offerKeys, item.productIds) : undefined, }; }; @@ -98,7 +100,6 @@ export const getMediaById = async (id: string, token?: string, drmPolicyId?: str const mediaItem = data.playlist[0]; if (!mediaItem) throw new Error('MediaItem not found'); - return transformMediaItem(mediaItem); }; diff --git a/src/services/inplayer.checkout.service.ts b/src/services/inplayer.checkout.service.ts index b7eab4d96..7773b6a64 100644 --- a/src/services/inplayer.checkout.service.ts +++ b/src/services/inplayer.checkout.service.ts @@ -198,9 +198,10 @@ const formatEntitlements = (expiresAt: number = 0, accessGranted: boolean = fals }; const formatOffer = (offer: GetAccessFee): Offer => { + const offerId = offer.access_type.name === 'ppv' ? `C${offer.id}` : `S${offer.id}`; return { id: offer.id, - offerId: `S${offer.id}`, + offerId, offerCurrency: offer.currency, customerPriceInclTax: offer.amount, customerCurrency: offer.currency,