// withHooks
// noPage

import { LibIcon } from 'esoftplay/cache/lib/icon/import';
import { LibPicture } from 'esoftplay/cache/lib/picture/import';
import { LibTextstyle } from 'esoftplay/cache/lib/textstyle/import';
import { LibUtils } from 'esoftplay/cache/lib/utils/import';
import { MarketRating } from 'esoftplay/cache/market/rating/import';
import { MarketStyle } from 'esoftplay/cache/market/style/import';

import React from 'react';
import { Text, TouchableOpacity, View } from 'react-native';


export interface MarketAds_product_itemArgs {

}
export interface MarketAds_product_itemProps {
  selected: boolean,
  image?: string,
  id: string,
  cat_id: string,
  title: string,
  sale: string,
  sale_max: string,
  stocks: string,
  sold: string,
  rating: string,
  rating_value: string,
  rating_count: string,
  publish: string,
  active: string,
  alert: string,

  onPress: () => any,
}
export default function m(props: MarketAds_product_itemProps): any {
  return (
    <View pointerEvents={props.alert != '' ? 'none' : 'auto'}>
      <TouchableOpacity onPress={() => { props.onPress() }} style={styleId_Z1zJeEx}>
        {
          props.alert != '' ?
            <LibIcon name="checkbox-blank" color={'#e6e6e6'} />
            :
            <TouchableOpacity onPress={() => { props.onPress() }}>
              <LibIcon name={props?.selected ? "checkbox-marked-outline" : "checkbox-blank-outline"} color={MarketStyle.colorPrimaryMarket} />
            </TouchableOpacity>
        }
        <LibPicture source={{ uri: props?.image }} style={styleId_ZmusG5} resizeMode="cover" />
        <View style={{ flex: 1 }}>
          <Text allowFontScaling={false} style={styleId_cP8sW} >{props?.title}</Text>
          <Text allowFontScaling={false} style={styleId_1UsGmI} >{LibUtils.money(props?.sale)}</Text>
          <MarketRating rating={props?.rating} />
          <View style={styleId_Zrz44M}>
            <Text allowFontScaling={false} style={styleId_iHTIz} >Stok : {LibUtils.number(props?.stocks)} </Text>
            <Text allowFontScaling={false} style={styleId_Z9rEGG} >Terjual : {LibUtils.number(props?.sold)} </Text>
          </View>
          {
            props.alert != '' &&
            <View style={styleId_17srzJ} >
              <View style={styleId_1LIVWf} >
                <LibTextstyle
                  textStyle="footnote"
                  text={props?.alert}
                  style={styleId_Z2mCSd6} />
              </View>
            </View>
          }
        </View>
      </TouchableOpacity>
    </View>
  )
}
const styleId_Z1zJeEx: any = { flexDirection: 'row', padding: 10, paddingHorizontal: 15, alignContent: 'center', alignItems: 'center' }
const styleId_ZmusG5: any = { marginHorizontal: 10, borderRadius: 5, height: 80, width: 80 }
const styleId_cP8sW: any = { fontSize: 12, fontWeight: "normal", fontStyle: "normal", letterSpacing: 0 }
const styleId_1UsGmI: any = { marginTop: 5, fontSize: 16, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, color: '#000' }
const styleId_Zrz44M: any = { flexDirection: 'row', alignItems: 'center', marginTop: 5 }
const styleId_iHTIz: any = { fontSize: 12, fontWeight: "normal", fontStyle: "normal", letterSpacing: 0, color: '#000' }
const styleId_Z9rEGG: any = { marginHorizontal: 10, fontSize: 12, fontWeight: "normal", fontStyle: "normal", letterSpacing: 0, color: '#000' }
const styleId_17srzJ: any = { flexDirection: 'row', flexWrap: 'wrap' }
const styleId_1LIVWf: any = { paddingVertical: 3, paddingHorizontal: 10, marginTop: 5, borderRadius: 5, backgroundColor: LibUtils.hexToRgba(MarketStyle.colorPrimaryMarket, 0.2) }
const styleId_Z2mCSd6: any = { fontSize: 10 }