diff --git a/components/owner/carousel.tsx b/components/owner/carousel.tsx index 9d2e76d..0b6ff1e 100644 --- a/components/owner/carousel.tsx +++ b/components/owner/carousel.tsx @@ -1,6 +1,6 @@ import { Counter, UserCountData } from "@/types/user"; import * as React from "react"; -import { Dimensions, StyleSheet, View } from "react-native"; +import { Dimensions, StyleSheet, View, ViewStyle } from "react-native"; import { useSharedValue } from "react-native-reanimated"; import Carousel, { ICarouselInstance @@ -72,21 +72,31 @@ function CarouselComponent(props: Props) { mode="parallax" onProgressChange={progress} defaultIndex={carouselDataValue?.findIndex((item) => item?.key === 'total_count') - 1 || 0} - renderItem={({ item }) => { - if (item?.key === 'total_count') { - return totleItem(item.value) - } - return CategoryComponent( - { - title: item?.key, - data: - [ - { title: 'Video', number: item?.value?.video_count }, - { title: 'Photo', number: item?.value?.photo_count }, - { title: 'Length', number: formatDuration(item?.value?.video_length || 0) } - ], - bgSvg: item?.value?.cover_url, - }) + renderItem={({ item, index }) => { + const style: ViewStyle = { + marginHorizontal: 10, + width: '92%', + height: '92%', + }; + return ( + + {item?.key === 'total_count' ? ( + totleItem(item.value) + ) : ( + + {CategoryComponent({ + title: item?.key, + data: [ + { title: 'Video', number: item?.value?.video_count }, + { title: 'Photo', number: item?.value?.photo_count }, + { title: 'Length', number: formatDuration(item?.value?.video_length || 0) } + ], + bgSvg: item?.value?.cover_url, + })} + + )} + + ) }} /> @@ -97,7 +107,7 @@ const styles = StyleSheet.create({ container: { backgroundColor: "#FFB645", padding: 16, - borderRadius: 20, + borderRadius: 16, display: "flex", flexDirection: "column", justifyContent: "space-between",