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

import { LibNavigation } from 'esoftplay/cache/lib/navigation/import';
import { LibPicture } from 'esoftplay/cache/lib/picture/import';
import { LibScroll } from 'esoftplay/cache/lib/scroll/import';
import { LibTextstyle } from 'esoftplay/cache/lib/textstyle/import';
import { LibUtils } from 'esoftplay/cache/lib/utils/import';
import { MarketHeader } from 'esoftplay/cache/market/header/import';
import { MarketUser_profileProperty } from 'esoftplay/cache/market/user_profile/import';
import { UserClass } from 'esoftplay/cache/user/class/import';


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


export interface MarketMerchant_saldoProps {

}
export default function m(props: MarketMerchant_saldoProps): any {
  const merchantSaldo = UserClass.state().useSelector?.(state => state?.saldo_merchant)

  if (!merchantSaldo) return null

  return (
    <View style={{ flex: 1, backgroundColor: "white" }}>
      <MarketHeader
        onlyBack
        title={esp.lang("market/merchant_saldo", "header_title")} />
      <LibScroll onRefresh={() => MarketUser_profileProperty.update()} >
        <View style={{ alignItems: 'center', justifyContent: "center", minHeight: 200 }} >
          <LibTextstyle style={{ fontWeight: "bold" }} textStyle="largeTitle" text={LibUtils.money(merchantSaldo)} />
        </View>
        <View style={{ flexDirection: "row", justifyContent: "space-around" }} >
          <TouchableOpacity onPress={() => {
            MarketUser_profileProperty.isLogin(() => {
              LibNavigation.navigate('market/withdraw', { from: 'merchant' })
            })

          }} style={{ alignItems: "center" }} >
            <LibPicture style={{ height: 40, width: 40, marginBottom: 10 }} source={esp.assets("market/002-atm-machine.png")} />
            <LibTextstyle text={esp.lang("market/merchant_saldo", "withdraw")} textStyle={"footnote"} />
          </TouchableOpacity>
          <TouchableOpacity
            onPress={() => MarketUser_profileProperty.isLogin(() => { LibNavigation.navigate('market/merchant_saldo_history') })}
            style={{ alignItems: "center" }} >
            <LibPicture style={{ height: 40, width: 40, marginBottom: 10 }} source={esp.assets("market/003-bills.png")} />
            <LibTextstyle text={esp.lang("market/merchant_saldo", "history")} textStyle={"footnote"} />
          </TouchableOpacity>
        </View>
      </LibScroll>
    </View>
  )
}