(PC-33299) fix(thematicSearch): limit usage of transformOfferHits

src/features/gtlPlaylist/hooks/useGTLPlaylists.ts

@@ -6,6 +6,7 @@ import { GtlPlaylistData } from 'features/gtlPlaylist/types'
 import { useIsUserUnderage } from 'features/profile/helpers/useIsUserUnderage'
 import { useAdaptOffersPlaylistParameters } from 'libs/algolia/fetchAlgolia/fetchMultipleOffers/helpers/useAdaptOffersPlaylistParameters'
 import { fetchOffersByGTL } from 'libs/algolia/fetchAlgolia/fetchOffersByGTL'
+import { useTransformOfferHits } from 'libs/algolia/fetchAlgolia/transformOfferHit'
 import { useLocation } from 'libs/location'
 import { useNetInfoContext } from 'libs/network/NetInfoWrapper'
 import { QueryKeys } from 'libs/queryKeys'
@@ -25,6 +26,7 @@ export function useGTLPlaylists({
   const { userLocation, selectedLocationMode } = useLocation()
   const isUserUnderage = useIsUserUnderage()
   const adaptPlaylistParameters = useAdaptOffersPlaylistParameters()
+  const transformOfferHit = useTransformOfferHits()
 
   const { data: gtlPlaylists, isLoading } = useQuery({
     queryKey: [gtlPlaylistsQueryKey, venue?.id, userLocation, selectedLocationMode],
@@ -60,7 +62,7 @@ export function useGTLPlaylists({
 
       return gtlPlaylistsConfig.map((item, index) => ({
         title: item.displayParameters.title,
-        offers: offers[index] ?? { hits: [] },
+        offers: { hits: offers[index]?.hits.map(transformOfferHit) ?? [] },
         layout: item.displayParameters.layout,
         minNumberOfOffers: item.displayParameters.minOffers,
         entryId: item.id,

src/features/gtlPlaylist/types.ts

@@ -1,6 +1,6 @@
 import { OffersModuleParameters } from 'features/home/types'
+import { AlgoliaHit } from 'libs/algolia/types'
 import { Layout, DisplayParametersFields } from 'libs/contentful/types'
-import { Offer } from 'shared/offer/types'
 
 export type GtlPlaylistRequest = {
   id: string
@@ -10,7 +10,7 @@ export type GtlPlaylistRequest = {
 
 export type GtlPlaylistData = {
   title: string
-  offers: { hits: Offer[] }
+  offers: { hits: AlgoliaHit[] }
   layout: Layout
   minNumberOfOffers: number
   entryId: string

src/features/search/pages/ThematicSearch/ThematicSearchPlaylist.tsx

@@ -3,7 +3,6 @@ import React from 'react'
 
 import { Referrals, ScreenNames } from 'features/navigation/RootNavigator/types'
 import { ThematicSearchPlaylistData } from 'features/search/pages/ThematicSearch/types'
-import { useTransformOfferHits } from 'libs/algolia/fetchAlgolia/transformOfferHit'
 import { Offer } from 'shared/offer/types'
 import { useRenderPassPlaylist } from 'shared/renderPassPlaylist'
 import { PassPlaylist } from 'ui/components/PassPlaylist'
@@ -23,14 +22,13 @@ export function ThematicSearchPlaylist({
   route,
 }: Readonly<ThematicSearchPlaylist>) {
   const renderPassPlaylist = useRenderPassPlaylist({ analyticsFrom, route, playlist })
-  const transformOfferHits = useTransformOfferHits()
   return (
     <PassPlaylist
       data={playlist.offers.hits}
       itemWidth={PLAYLIST_ITEM_WIDTH}
       itemHeight={PLAYLIST_ITEM_HEIGHT}
       renderItem={renderPassPlaylist}
-      keyExtractor={(item: Hit<Offer>) => transformOfferHits(item).objectID}
+      keyExtractor={(item: Hit<Offer>) => item.objectID}
       title={playlist.title}
     />
   )

src/shared/renderPassPlaylist.tsx

@@ -6,7 +6,6 @@ import { GtlPlaylistProps } from 'features/gtlPlaylist/components/GtlPlaylist'
 import { UseRouteType } from 'features/navigation/RootNavigator/types'
 import { OfferTile } from 'features/offer/components/OfferTile/OfferTile'
 import { ThematicSearchPlaylist } from 'features/search/pages/ThematicSearch/ThematicSearchPlaylist'
-import { useTransformOfferHits } from 'libs/algolia/fetchAlgolia/transformOfferHit'
 import { useFeatureFlag } from 'libs/firebase/firestore/featureFlags/useFeatureFlag'
 import { RemoteStoreFeatureFlags } from 'libs/firebase/firestore/types'
 import { formatDates } from 'libs/parsers/formatDates'
@@ -27,7 +26,6 @@ export const useRenderPassPlaylist = ({
 }: Readonly<
   CinemaPlaylistPropsContainingVenue | GtlPlaylistProps
 >): CustomListRenderItem<Offer> => {
-  const transformOfferHits = useTransformOfferHits()
   const mapping = useCategoryIdMapping()
   const labelMapping = useCategoryHomeLabelMapping()
   const currentRoute = useRoute<UseRouteType<typeof route>>()
@@ -37,7 +35,6 @@ export const useRenderPassPlaylist = ({
 
   return useCallback(
     ({ item, width, height, index }) => {
-      const hit = transformOfferHits(item)
       const timestampsInMillis = item.offer.dates?.map((timestampInSec) => timestampInSec * 1000)
 
       return (
@@ -47,12 +44,12 @@ export const useRenderPassPlaylist = ({
           categoryLabel={labelMapping[item.offer.subcategoryId]}
           categoryId={mapping[item.offer.subcategoryId]}
           subcategoryId={item.offer.subcategoryId}
-          offerId={+hit.objectID}
-          name={hit.offer.name}
+          offerId={+item.objectID}
+          name={item.offer.name}
           date={formatDates(timestampsInMillis)}
-          isDuo={hit.offer.isDuo}
-          thumbUrl={hit.offer.thumbUrl}
-          price={getDisplayPrice(hit.offer.prices)}
+          isDuo={item.offer.isDuo}
+          thumbUrl={item.offer.thumbUrl}
+          price={getDisplayPrice(item.offer.prices)}
           width={width}
           height={height}
           searchId={currentRoute.params?.searchId}
@@ -64,7 +61,6 @@ export const useRenderPassPlaylist = ({
       )
     },
     [
-      transformOfferHits,
       analyticsFrom,
       labelMapping,
       mapping,