{"size": 1190, "ext": "js", "max_stars_repo_path": "src/components/BalanceComponent.js", "max_stars_repo_name": "Gastapp/gastapp_front", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "src/components/BalanceComponent.js", "max_issues_repo_name": "Gastapp/gastapp_front", "max_issues_repo_issues_event_min_datetime": "2022-02-19T00:26:38.000Z", "max_issues_repo_issues_event_max_datetime": "2022-02-27T02:43:54.000Z", "max_forks_repo_path": "src/components/BalanceComponent.js", "max_forks_repo_name": "TTIP-UNQ-Team6/gastapp_front", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": null, "max_issues_count": 2, "max_forks_count": null, "avg_line_length": 34.0, "max_line_length": 129, "alphanum_fraction": 0.6151260504}
import React from 'react';
import { StyleSheet, Text, View } from 'react-native';
import AmountBalanceComponent from './AmountBalanceComponent'

const BalanceComponent = (props) => {
    const balance = props.incomeAmount - props.expenseAmount;
    const color = balance >= 0 ? '#008000' : '#DC0000'
    return (
        <View style={styles.view}>
                <AmountBalanceComponent icon='balance' iconColor={color} iconSize={45} title='Balance' subtitle={`$${balance}`}/>
            <View style={styles.horizontalView}>
                <AmountBalanceComponent icon='up-arrow' iconSize={45} title='Ingresos' subtitle={`$${props.incomeAmount}`}/>
                <AmountBalanceComponent icon='down-arrow' iconSize={45} title='Gastos' subtitle={`$${props.expenseAmount}`}/>
            </View>
        </View>
    );
}

const styles = StyleSheet.create({
    view: {
        backgroundColor: 'white',
        height: 180,
        flexDirection: 'column',
        alignItems: 'center',
        marginHorizontal: 10,
        marginTop: 10,
        borderRadius: 10,
        elevation: 2
    },
    horizontalView: {
        flexDirection: 'row'
    }
});

export default BalanceComponent;