import React from 'react';
import { View, Text, StyleSheet, Button, Alert } from 'react-native';
import * as MailComposer from 'expo-mail-composer';

const SendEmail = () => {
    const [message, setMessage] = React.useState('Levi McLean\n123 Main St\nLondon, ON\n(555) 555-5555\naidanmclean111@gmail.com');

    const sendMessageWithEmail = async () => {
        try {
            const isAvailable = await MailComposer.isAvailableAsync();
            if (!isAvailable) {
                Alert.alert('Email is not available on this device');
                return;
            }

            const result = await MailComposer.composeAsync({
                recipients: ['aidanmclean111@gmail.com'],
                subject: 'Lab 4 - Customized Email',
                body: message,
            });

            if (result.status === 'sent') {
                Alert.alert('Email sent successfully');
            } else {
                Alert.alert('Failed to send email');
            }
        } catch (error) {
            Alert.alert('Error sending email', error.message);
        }
    };

    return (
        <View style={styles.form}>
            <Text style={styles.label}>You are going to send the following info:</Text>
            <Text style={styles.messageInfo}>{message}</Text>

            <Button title="Send via Email" onPress={sendMessageWithEmail} />
        </View>
    );
};

const styles = StyleSheet.create({
    form: {
        padding: 30,
        marginTop: 60,
    },
    label: {
        fontSize: 18,
        marginBottom: 30,
        textAlign: 'center',
    },
    messageInfo: {
        fontSize: 16,
        marginBottom: 15,
        textAlign: 'center',
        fontWeight: 'bold',
    },
});

export default SendEmail;