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

type Props = {
   category: 'purple' | 'orange'
   title: string
   user: string
   jamAwal: string
   jamAkhir: string
   onPress?: () => void
}

export default function EventItem({ category, title, user, jamAwal, jamAkhir, onPress }: Props) {
   const { theme } = useTheme();

   const getBackgroundColor = (cat: 'purple' | 'orange') => {
      if (theme === 'dark') {
         return cat === 'orange' ? '#5A2D0C' : '#1F2255';
      }
      return cat === 'orange' ? '#FED6C5' : '#D8D8F1';
   };

   return (
      <Pressable style={[Styles.itemEvent, { backgroundColor: getBackgroundColor(category) }]} onPress={onPress}>
         <View style={[Styles.dividerEvent, { backgroundColor: category == 'orange' ? '#FB804C' : '#535FCA' }]} />
         <View style={[Styles.w90]}>
            <Text>{jamAwal} - {jamAkhir}</Text>
            <Text numberOfLines={1} ellipsizeMode="tail" style={[Styles.textDefaultSemiBold, Styles.mv05]}>{title}</Text>
            <Text numberOfLines={1} ellipsizeMode="tail">Dibuat oleh : {user}</Text>
         </View>
      </Pressable>
   )
}