/**
 * 钱包卡片组件
 * @邠心vbe on 2025/01/17
 */
import React from 'react';
import { StyleSheet } from 'react-native';
import { Text, View } from 'react-native';
import { ElevationObject } from '../../components/Button';
import TextView from '../../components/TextView';
import utils from '../../utils/utils';

const ViewWallet = ({
  wallet
}) => (
  <View style={styles.cardWallet}>
    <View style={ui.flexc}>
      <TextView style={styles.walletName}>{wallet.walletTypeName}</TextView>
    </View>
    <TextView style={styles.walletProvider}>{wallet.walletPrincipalName}</TextView>
    <TextView style={styles.walletLabel}>Current Balance:</TextView>
    <TextView style={styles.walletBalance}>{wallet.currentBalance}</TextView>
    { utils.isNotEmpty(wallet.expiresDate) &&
      <TextView style={styles.walletLabel}>Expires {wallet.expiresDate}</TextView>
    }
  </View>
);

export default ViewWallet;

const styles = StyleSheet.create({
  cardWallet: {
    height: 182,
    margin: 16,
    padding: 16,
    borderRadius: 16,
    ...ElevationObject(2),
    backgroundColor: colorAccent
  },
  walletName: {
    color: textLight,
    fontSize: 24,
    fontWeight: 'bold'
  },
  walletProvider: {
    color: textLight,
    fontSize: 20,
  },
  walletLabel: {
    color: textLight,
    opacity: .9,
    fontSize: 14,
    paddingTop: 16
  },
  walletBalance: {
    color: textLight,
    fontSize: 20,
    paddingTop: 4,
    fontWeight: 'bold'
  }
})