import Styles from "@/constants/Styles";
import { Pressable, Text, View } from "react-native";

type Props = {
   title: string
   subtitle?: string
   icon: React.ReactNode
   desc?: string
   rightTopInfo?: string
   onPress?: () => void
}

export default function BorderBottomItem({ title, subtitle, icon, desc, onPress, rightTopInfo }: Props) {
   return (
      <Pressable style={[Styles.wrapItemBorderBottom]} onPress={onPress}>
         <View style={[Styles.rowItemsCenter]}>
            {icon}
            <View style={[Styles.rowSpaceBetween, { width: '85%' }]}>
               <View style={[Styles.ml10]}>
                  <Text style={[Styles.textDefaultSemiBold]}>{title}</Text>
                  {subtitle && <Text style={[Styles.textMediumNormal]}>{subtitle}</Text>}
               </View>
               {
                  rightTopInfo && <Text style={[Styles.textInformation]}>{rightTopInfo}</Text>
               }
            </View>

         </View>
         {desc && <Text style={[Styles.textDefault, Styles.mt05, { textAlign: 'justify' }]}>{desc}</Text>}
      </Pressable>
   )
}