import Styles from "@/constants/Styles";
import { Feather } from "@expo/vector-icons";
import React from "react";
import { Dimensions, Text, View } from "react-native";
import Carousel, { ICarouselInstance } from "react-native-reanimated-carousel";


export default function FileDivisionDetail() {
   const data = [...new Array(6).keys()];
   const ref = React.useRef<ICarouselInstance>(null);
   const width = Dimensions.get("window").width;

   return (
      <View style={[Styles.mb15]}>
         <Text style={[Styles.textDefaultSemiBold, Styles.mv10]}>Dokumen Terkini</Text>
         <Carousel
            ref={ref}
            width={width}
            height={115}
            data={data}
            loop={true}
            autoPlay={false}
            autoPlayReverse={false}
            pagingEnabled={true}
            snapEnabled={true}
            vertical={false}
            style={{
               width: width,
            }}
            mode="parallax"
            modeConfig={{
               parallaxScrollingScale: 1,
               parallaxScrollingOffset: 280,
            }}
            renderItem={({ index }) => (
               <View style={{ margin: 'auto', width:'28%' }}>
                  <View style={{alignItems:'center'}}>
                     <View style={[Styles.wrapPaper, { alignItems: 'center' }]}>
                        <Feather name="file-text" size={50} color="black" style={Styles.mr05} />
                     </View>
                  </View>
                  <Text style={[Styles.textMediumNormal, { textAlign: 'center' }]} numberOfLines={1}>File_Pertama.png Amalia Dwi</Text>
               </View>

            )}
         />
      </View>
   )
}