// withHooks

import { LibIcon } from 'esoftplay/cache/lib/icon/import';
import { LibPicture } from 'esoftplay/cache/lib/picture/import';
import { LibStyle } from 'esoftplay/cache/lib/style/import';
import { LibUtils } from 'esoftplay/cache/lib/utils/import';
import esp from 'esoftplay/esp';
import moment from 'esoftplay/moment';
import React from 'react';
import { Text, TouchableOpacity, View } from 'react-native';


export interface EventList_itemArgs {

}
export interface EventList_itemProps {
  address: string,
  end_date: string,
  end_time: string,
  id: string,
  image: string,
  location_id: string,
  location_latlong: string,
  location_name: string,
  title: string,
  price_max: string,
  price_min: string,
  start_date: string,
  start_time: string,
  timezone: string,
  url: string,
  style?: any,
  onPress: () => void
}
export default function m(props: EventList_itemProps): any {
  moment().locale('id')

  function renderPrice(min: string, max: string) {
    let price = ''
    if (min == '0') {
      price = esp.lang("event/list_item", "start_from_free")
    } else if (max == min) {
      price = LibUtils.money(max)
    } else {
      price = esp.lang("event/list_item", "start_from") + LibUtils.money(min)
    }
    return price
  }

  return (
    <TouchableOpacity onPress={props.onPress} >
      <View style={[{ width: 155, borderRadius: 10, backgroundColor: 'white', margin: 2, marginRight: 16 }, LibStyle.elevation(2), props.style]} >
        <View style={styleId_1pJXXC} >
          <LibPicture
            source={{ uri: props.image }}
            style={styleId_ZAHtLt} />
        </View>
        <Text allowFontScaling={false} style={styleId_1Ay8HY} numberOfLines={1} >{props.title}</Text>
        <View style={styleId_ZQJKmz} >
          <LibIcon name="calendar" color={LibStyle.colorGreen} size={10} />
          <Text allowFontScaling={false} style={styleId_3SnnV} >{moment(props.start_date).localeFormat('DD MMMM YYYY')}</Text>
        </View>
        <View style={styleId_2gDcDX} >
          <Text allowFontScaling={false} style={styleId_1RdRsh} >{renderPrice(props?.price_min, props?.price_max)}</Text>
        </View>
      </View>
    </TouchableOpacity>
  )
}
const styleId_1pJXXC: any = { borderTopLeftRadius: 10, borderTopRightRadius: 10, overflow: 'hidden' }
const styleId_ZAHtLt: any = { height: 100, width: '100%', resizeMode: 'cover' }
const styleId_1Ay8HY: any = { paddingHorizontal: 8, fontFamily: "ArialBold", fontSize: 10, color: "#70472b", marginTop: 6 }
const styleId_ZQJKmz: any = { flexDirection: 'row', alignItems: 'center', marginTop: 6, paddingHorizontal: 8 }
const styleId_3SnnV: any = { fontFamily: "Arial", fontSize: 9, color: LibStyle.colorGreen, marginLeft: 5 }
const styleId_2gDcDX: any = { flexDirection: 'row', alignItems: 'center', marginTop: 6, paddingHorizontal: 8, paddingBottom: 10 }
const styleId_1RdRsh: any = { fontFamily: "Arial", fontSize: 9, color: LibStyle.colorBlue }