// withHooks
// noPage

import { LibNavigation } from 'esoftplay/cache/lib/navigation/import';
import { LibPicture } from 'esoftplay/cache/lib/picture/import';
import { LibStyle } from 'esoftplay/cache/lib/style/import';
import { MarketCategory_hit } from 'esoftplay/cache/market/category_hit/import';
import { UserClass } from 'esoftplay/cache/user/class/import';

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


export interface MarketProduct_category_itemArgs {

}
export interface MarketProduct_category_itemProps {
  id: string,
  par_id: string,
  image: string,
  charge: string,
  publish: string,
  title: string,
  description: string,
  lang_id: string,
  url: string,
  module: any,
}
export default function m(props: MarketProduct_category_itemProps): any {
  const user = UserClass.state().get()
  const itemWidth = (LibStyle.width - 45) / 5

  return (
    <TouchableOpacity style={{ width: itemWidth, paddingTop: 10, marginRight: 5, marginBottom: 5 }}
      onPress={() => {
        if (user?.id) {
          MarketCategory_hit.categoryHit(props.id)
        }
        LibNavigation.navigate(props.module, { title: props?.title, url: props?.url })
      }} >
      <View style={{ alignItems: 'center', justifyContent: 'center', marginHorizontal: 3, paddingBottom: 10 }}>
        <View style={{ borderWidth: 1, borderRadius: 15, borderColor: '#f5f5f5', padding: 10 }} >
          <LibPicture source={{ uri: props?.image }} style={{ width: 25, height: 25 }} resizeMode={'contain'} />
        </View>
        <Text allowFontScaling={false} numberOfLines={2} ellipsizeMode="tail" style={{ fontSize: 11, paddingTop: 5, textAlign: 'center', textAlignVertical: 'center' }} >{props?.title}</Text>
      </View>
    </TouchableOpacity>
  )
}