// withHooks
// noPage
import esp from 'esoftplay/esp';

import { LibPicture } from 'esoftplay/cache/lib/picture/import';

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

export interface MarketSectionProps {
  text: string,
  textColor: string,
  caption?: string,
  icon?: string,
  moreAction?: () => void
}
export default function m(props: MarketSectionProps): any {
  return (
    <View style={{ flexDirection: 'row', marginTop: 10, marginHorizontal: 16, alignItems: 'center' }} >
      <View style={{ width: 8, height: 28, borderRadius: 10, backgroundColor: "#ededed" }} />
      <View style={{ marginLeft: 12, flex: 1 }} >
        <Text allowFontScaling={false} style={{ fontFamily: "ArialBold", fontSize: 15, lineHeight: 22, color: props.textColor }} >{props.text}</Text>
        {props.caption && <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 10, color: "#b8b8b8" }} >{props.caption}</Text>}
      </View>
      {
        props.icon &&
        <Pressable hitSlop={{ top: 7, left: 7, right: 7, bottom: 7 }} onPress={() => props.moreAction ? props.moreAction() : {}} >
          <LibPicture style={{ height: 25, width: 25, resizeMode: 'contain' }} source={esp.assets(props.icon)} />
        </Pressable>
      }
    </View>
  )
}