import React, { useState, } from 'react'
import { View, Text, StyleSheet, } from 'react-native'
import c from '../../../color/colors'
import t from '../../../translator/translator'

import TabHeaderView from './TabHeaderView'
import TabBody_1_View from './tab_1/TabBody_1_View'
import TabBody_2_View from './tab_2/TabBody_2_View'


type Props = {
    onPressStartTheFun: () => void,
}

const tabs = [
    { name: 'Create notification' },
    { name: 'Choose template' },
]


export default TabView = (props: Props) =>
{
    const [selectedTebIndex, setSelectedTebIndex]: [Number] = useState(0)

    function getTabBodyView(tabIndex: Number)
    {
        switch(tabIndex)
        {
            case 0:
                return <TabBody_1_View onPressStartTheFun={ props.onPressStartTheFun }/>

            case 1:
                return <TabBody_2_View/>
        
            default:
                return <TabBody_1_View onPressStartTheFun={ props.onPressStartTheFun }/>
        }
    }

    return (
        <View style={ styles.container }>

            {/* <TabHeaderView
                tabs = { tabs }
                selectedIndex = { selectedTebIndex }
                onPress = { index => (index != selectedTebIndex) && setSelectedTebIndex(index)}
            /> */}

            <View style={ styles.tabBodyView }>

                {
                    getTabBodyView(selectedTebIndex)
                }

            </View>

        </View>
    )
}
TabView.defaultProps = {

}



const styles = StyleSheet.create({
    container: {

    },
    tabBodyView: {

    },
})
