rough.txt

//from profile.js

<Tab tabStyle={{ width: 100 }} heading={<TabHeading style={styles.tabDashboard}>
                        <Text style={styles.tabText}>
                            <Icon name='user-o' style={{ color: '#fff' }} type='FontAwesome' />
                        </Text></TabHeading>}>
                        <Profile navigation = {props.navigation} />
</Tab>


import React from 'react';
import { StyleSheet, Text, View, Image, Alert } from "react-native";
import { Item, Input } from 'native-base';
import { TouchableOpacity } from 'react-native-gesture-handler';

import auth from '@react-native-firebase/auth';

class Profile extends React.Component {

    signOutFunc = () => {
        auth()
            .signOut()
            .then(() => {
                Alert.alert('User signed out!');
            });
        this.props.navigation.navigate('Home');
    }

    render() {
        return (
            <View style={{ width: '100%', alignItems: 'center' }}>
                <Text style={styles.profileH}>Profile</Text>
                <View style={styles.container}>
                    <Image
                        style={styles.tinyLogo}
                        source={require('../assets/demo-user.png')}
                    />
                </View>
                <View >
                    <View style={styles.profileBody}>
                        <Item rounded style={{ marginTop: 20, borderRadius: 10, borderRadius: 15, borderColor: '#DE1F26', borderWidth: 5 }}>
                            <Input style={{ color: 'red', backgroundColor: 'white', fontWeight: 'bold', fontSize: 20 }} />
                        </Item>
                        <Item rounded style={{ marginTop: 20, borderRadius: 10, borderRadius: 15, borderColor: '#DE1F26', borderWidth: 5 }}>
                            <Input style={{ color: 'red', backgroundColor: 'white', fontWeight: 'bold', fontSize: 20 }} />
                        </Item>
                        <Item rounded style={{ marginTop: 20, borderRadius: 10, borderRadius: 15, borderColor: '#DE1F26', borderWidth: 5 }}>
                            <Input style={{ color: 'red', backgroundColor: 'white', fontWeight: 'bold', fontSize: 20 }} />
                        </Item>
                        <TouchableOpacity style={styles.btnView} onPress={() => this.signOutFunc()}>
                            <Text style={{ color: '#fff', fontWeight: 'bold', fontSize: 20 }}>
                                SIGN OUT
                            </Text>
                        </TouchableOpacity>
                    </View>
                </View>
            </View>
        );
    }
};

const styles = StyleSheet.create({
    profileH: {
        fontSize: 35,
        color: '#FB6527',
        padding: 7,
        margin: 7,
        textAlign: 'center',
        textTransform: 'uppercase',
        marginTop: 20,
        fontWeight: 'bold',
    },
    profileBody: {
        width: '80%',
        alignItems: 'center',
    },
    container: {
        justifyContent: 'center',
        alignItems: 'center',
        marginBottom: 20,
    },
    tinyLogo: {
        width: 100,
        height: 100,
        borderRadius: 100,
        marginTop: 10,
        marginBottom: 10,
        borderColor: '#FB6527',
        borderWidth: 5,
    },
    profileD: {
        color: '#FB6527',
        padding: 10,
        margin: 10,
        fontSize: 20,
        borderColor: '#FB6527',
        borderBottomWidth: 1,
    },
    btnView: {
        width: '100%',
        borderRadius: 10,
        padding: 10,
        marginTop: 20,
        backgroundColor: '#FB6527',
        alignItems: 'center',
    },
});

export default Profile;