diff --git a/components/ItemContent.tsx b/components/ItemContent.tsx index b3cda7bb..627c3a92 100644 --- a/components/ItemContent.tsx +++ b/components/ItemContent.tsx @@ -232,10 +232,10 @@ export const ItemContent: React.FC<{ item: BaseItemDto }> = React.memo( {item.People && item.People.length > 0 && ( - {item.People.slice(0, 3).map((person) => ( + {item.People.slice(0, 3).map((person, idx) => ( diff --git a/components/common/HorrizontalScroll.tsx b/components/common/HorrizontalScroll.tsx index 6679453f..2dce75d4 100644 --- a/components/common/HorrizontalScroll.tsx +++ b/components/common/HorrizontalScroll.tsx @@ -16,6 +16,7 @@ interface HorizontalScrollProps > { data?: T[] | null; renderItem: (item: T, index: number) => React.ReactNode; + keyExtractor?: (item: T, index: number) => string; containerStyle?: ViewStyle; contentContainerStyle?: ViewStyle; loadingContainerStyle?: ViewStyle; @@ -32,6 +33,7 @@ export const HorizontalScroll = forwardRef< ( { data = [], + keyExtractor, renderItem, containerStyle, contentContainerStyle, @@ -91,6 +93,7 @@ export const HorizontalScroll = forwardRef< paddingHorizontal: 16, ...contentContainerStyle, }} + keyExtractor={keyExtractor} ListEmptyComponent={() => ( @@ -98,6 +101,7 @@ export const HorizontalScroll = forwardRef< )} + {...props} /> ); } diff --git a/components/series/CastAndCrew.tsx b/components/series/CastAndCrew.tsx index a19cfc30..41dfdbb1 100644 --- a/components/series/CastAndCrew.tsx +++ b/components/series/CastAndCrew.tsx @@ -38,19 +38,19 @@ export const CastAndCrew: React.FC = ({ item, loading, ...props }) => { Cast & Crew i.Id.toString()} height={247} data={destinctPeople} - renderItem={(item, index) => ( + renderItem={(i) => ( { - router.push(`/actors/${item.Id}`); + router.push(`/actors/${i.Id}`); }} - key={index} className="flex flex-col w-28" > - - {item.Name} - {item.Role} + + {i.Name} + {i.Role} )} />