diff --git a/components/SimilarItems.tsx b/components/SimilarItems.tsx index 6777a8d9..46815b6d 100644 --- a/components/SimilarItems.tsx +++ b/components/SimilarItems.tsx @@ -10,6 +10,8 @@ import { ScrollView, TouchableOpacity, View, ViewProps } from "react-native"; import { Text } from "./common/Text"; import { ItemCardText } from "./ItemCardText"; import { Loader } from "./Loader"; +import { HorizontalScroll } from "./common/HorrizontalScroll"; +import { TouchableItemRouter } from "./common/TouchableItemRouter"; interface SimilarItemsProps extends ViewProps { itemId?: string | null; @@ -46,29 +48,24 @@ export const SimilarItems: React.FC = ({ return ( Similar items - {isLoading ? ( - - - - ) : ( - - - {movies.map((item) => ( - router.push(`/items/page?id=${item.Id}`)} - className="flex flex-col w-32" - > - - - - ))} - - - )} - {movies.length === 0 && ( - No similar items - )} + ( + + + + + + + )} + /> ); }; diff --git a/components/common/HorrizontalScroll.tsx b/components/common/HorrizontalScroll.tsx index a1015b37..bd885fec 100644 --- a/components/common/HorrizontalScroll.tsx +++ b/components/common/HorrizontalScroll.tsx @@ -22,6 +22,7 @@ interface HorizontalScrollProps height?: number; loading?: boolean; extraData?: any; + noItemsText?: string; } export const HorizontalScroll = forwardRef< @@ -38,6 +39,7 @@ export const HorizontalScroll = forwardRef< loading = false, height = 164, extraData, + noItemsText, ...props }: HorizontalScrollProps, ref: React.ForwardedRef @@ -91,7 +93,9 @@ export const HorizontalScroll = forwardRef< }} ListEmptyComponent={() => ( - No data available + + {noItemsText || "No data available"} + )} {...props} diff --git a/components/series/CastAndCrew.tsx b/components/series/CastAndCrew.tsx index 16f5e0d7..5e4ec379 100644 --- a/components/series/CastAndCrew.tsx +++ b/components/series/CastAndCrew.tsx @@ -25,6 +25,7 @@ export const CastAndCrew: React.FC = ({ item, loading, ...props }) => { Cast & Crew ( = ({ item, loading, ...props }) => { router.push(`/actors/${item.Id}`); }} key={item.Id} - className="flex flex-col w-32" + className="flex flex-col w-28" > {item.Name}