import React from 'react';
import { TouchableOpacity, View, Image, Text } from 'react-native';
import { Ionicons } from '@expo/vector-icons';
import { styles } from './styles';
import { useNavigation } from '@react-navigation/core';
import url from '../../services/url';

interface DadosProps {
    title: string;
    foto: string;
}

export const Header = ({ title, foto }: DadosProps) => {
    const navigation: any = useNavigation();

    return (
        <View style={styles.header}>
            <View style={styles.containerHeader}>
                <TouchableOpacity
                    style={styles.menu}
                    onPress={() => navigation.push("HomeIgreja")}
                >
                    <Ionicons name="md-arrow-back-circle-outline" size={35} color="#000" />
                </TouchableOpacity>
                <Image style={styles.logo} source={{ uri: (url + 'sistema/img/igrejas/' + foto) }} />
                <Text style={styles.tituloHeader}>{title}</Text>
            </View>
        </View>

    );
}

export default Header;