import Styles from "@/constants/Styles";
import { Ionicons, MaterialCommunityIcons } from "@expo/vector-icons";
import { Pressable, View } from "react-native";
import Text from "../Text";


type Props = {
   title: string
   category: 'folder' | 'folder-shared' | 'file' | 'file-shared'
   dateTime: string
   checked?: boolean
   onChecked?: () => void
   onPress?: () => void
   canChecked?: boolean
}

export default function ItemFile({ category, checked, dateTime, title, onChecked, onPress, canChecked }: Props) {
   return (
      <View style={[Styles.wrapItemBorderBottom]}>
         <View style={[Styles.rowItemsCenter]}>
            <Pressable onPress={onPress}>
               {
                  category == 'folder-shared'
                     ?
                     <>
                        <Ionicons name="folder-open-sharp" color={'#f9cc40'} size={40} />
                        <MaterialCommunityIcons name="share" color={'gray'} size={25} style={[Styles.absoluteIcon]} />
                     </>
                     : category == 'file-shared'
                        ?
                        <>
                           <Ionicons name="document-text-sharp" color={'#9fcff8'} size={40} />
                           <MaterialCommunityIcons name="share" color={'gray'} size={25} style={[Styles.absoluteIcon]} />
                        </>
                        :
                        category == 'folder'
                           ?
                           <Ionicons name="folder-open-sharp" color={'#f9cc40'} size={40} />
                           :
                           <Ionicons name="document-text-sharp" color={'#9fcff8'} size={40} />

               }


            </Pressable>
            <View style={[Styles.rowSpaceBetween, { flex: 1, alignItems: 'center' }]}>
               <Pressable style={[Styles.ml10, { flex: 1 },]} onPress={onPress}>
                  <Text style={[Styles.textDefault]} numberOfLines={1} ellipsizeMode="tail">{title}</Text>
                  <Text style={[Styles.textInformation]}>{dateTime}</Text>
               </Pressable>
               {
                  !canChecked ? <></>
                     :
                     <Pressable onPress={onChecked}>
                        {
                           checked
                              ? <MaterialCommunityIcons name="checkbox-marked-circle" size={25} color={'black'} />
                              : <MaterialCommunityIcons name="checkbox-blank-circle-outline" size={25} color={'#ced4da'} />
                        }

                     </Pressable>
               }
            </View>
         </View>
      </View>
   )
}