import React, { Component } from 'react';
import { View, Text, TouchableOpacity } from 'react-native';
import { connect } from 'react-redux';
import { Actions } from 'react-native-router-flux';

import { initLSClase } from '../actions/';
import MyAbout from './MyAbout';
import LSListaClases from './LSListaClases';
import { Card, CardSection } from '../components/common';

class Menu extends Component  {
	componentWillMount(){
		this.props.initLSClase();
	}
	componentWillReceiveProps() {
		this.props.initLSClase();
	}

	render() {
		return (
			<View style={{flex:1}}>
				<TouchableOpacity onPress={() => Actions.ListaCursadas()}>
				<Card>
					<CardSection>
						<Text>Cursadas</Text>
					</CardSection>
				</Card>
				</TouchableOpacity>

				<TouchableOpacity onPress={() => Actions.Live()}>
				<Card>
					<CardSection>
						<Text>Curso en vivo</Text>
					</CardSection>
				</Card>
				</TouchableOpacity>

				<TouchableOpacity onPress={() => Actions.LSClases()}>
				<Card>
					<CardSection>
						<Text>Clases descargadas</Text>
					</CardSection>
				</Card>
				</TouchableOpacity>

				<TouchableOpacity>
				<Card>
					<CardSection>
					<Text>Perfil</Text>
					</CardSection>
				</Card>
				</TouchableOpacity>

				<TouchableOpacity onPress={() => Actions.About()}>
				<Card>
					<CardSection>
					<Text>Como llegar / acerca de / ??</Text>
					</CardSection>
				</Card>
				</TouchableOpacity>

			</View>
		);
	};
}

export default connect(null, { initLSClase })(Menu);