import React from 'react';
import { View, Text, TextInput, TouchableOpacity, ScrollView } from 'react-native';
import {Card, Button, Avatar, Grid, Row, Col, ButtonGroup} from 'react-native-elements'
// import { connect } from 'react-redux';
// import { Actions } from 'react-native-router-flux';

import styles from '../styles'


// mapStateToProps = (state) => ({ barcodes: state.barcodeReducer.barcodes });

// mapDispatchToProps = (dispatch) => ({
//     // addGroceryItem: (groceryItem) => {
//     //     dispatch(addToGroceryList(groceryItem));
//     // },
//     // addTodoItem: (todoItem) => {
//     //     dispatch(addToTodoList(todoItem));
//     // },
// });

export default class ResultsContent extends React.Component {
    // constructor(props) {
    //     super(props);
    // }

    renderResultsContent() {
        return(
            <ScrollView>
                <Card title='Pikachu (me)'>
                    <Text>No alerts!</Text>
                </Card>
                    <Card title='Eevee'>
                    <Text>3 potential ingredient alerts:</Text>
                    <Text>
                        - Crushed almond (Tree Nut), Butter (Dairy), Soymilk (Soy)</Text>

                </Card>
                <Card title='Charmander'>
                    <Text>No alerts!</Text>
                </Card>
                <Card title='Squirtle'>
                    <Text>No alerts!</Text>
                </Card>
            </ScrollView>
        )
    }

    renderNutritionContent() {
        return(
            <ScrollView>
                <Text>Test Nutrition</Text>
            </ScrollView>
        )
    }

    renderContent() {
        const {selectedTab} = this.props;

        if (selectedTab == 0) {
            return this.renderResultsContent();
        } else if (selectedTab == 1) {
            return this.renderNutritionContent();
        }
    }

    render() {
        return(
            <View>
                {this.renderContent()}
            </View>
        )
    }
}