import { View, Text, ScrollView, Pressable, Linking, Alert } from 'react-native';
import React, { useContext } from 'react';
import { SafeAreaView } from 'react-native-safe-area-context';
import { router } from 'expo-router';
import { CrossLogoSvg, RightArrowIconSvg } from '../global/SVG';

const AssistancePageComponent = () => {
    // const handlePress = async () => {
    //     const phoneNumber = 'tel:+85291382129';
    //     try {
    //         const supported = await Linking.canOpenURL(phoneNumber);
    //         if (supported) {
    //             await Linking.openURL(phoneNumber);
    //         } else {
    //             Alert.alert('Error', 'Unable to make a call');
    //         }
    //     } catch (error) {
    //         Alert.alert('Error', 'An unexpected error occurred');
    //     }
    // };
    const handlePress = async () => {
        const phoneNumber = '85291382139'; // Remove the '+' sign
        const whatsappUrl = `whatsapp://send?phone=${phoneNumber}`;
        const webWhatsappUrl = `https://wa.me/${phoneNumber}`;

        try {
            const canOpenWhatsApp = await Linking.canOpenURL(whatsappUrl);
            if (canOpenWhatsApp) {
                await Linking.openURL(whatsappUrl);
            } else {
                // If WhatsApp app URL fails, try the web URL
                await Linking.openURL(webWhatsappUrl);
            }
        } catch (error) {
            console.error('Error opening WhatsApp:', error);
            // Fallback to showing the number if both methods fail
            Alert.alert('聯絡我們', `請通過WhatsApp聯繫我們：${phoneNumber}`, [
                { text: '複製號碼', onPress: () => Clipboard.setString(phoneNumber) },
                { text: '取消', style: 'cancel' }
            ]);
        }
    };

    return (
        <SafeAreaView className="flex-1 bg-white" edges={['top', 'right', 'left']}>
            <ScrollView className="flex-1 mx-[5%]" showsVerticalScrollIndicator={false}>
                <View style={{ marginTop: 25 }}>
                    <Pressable
                        onPress={() => {
                            router.replace('/accountMainPage');
                        }}
                    >
                        <CrossLogoSvg />
                    </Pressable>
                    <Text style={{ fontSize: 45, marginVertical: 25 }}>排除解難</Text>
                </View>
                <View>
                    <Text className="text-lg">
                        如果您在使用該應用程式時遇到任何問題，請透過WhatsApp聯絡我們的客戶服務人員：
                    </Text>
                    <Pressable onPress={handlePress}>
                        <Text className="text-3xl font-semibold underline text-[#02677D] pt-2">+852 9138 2139</Text>
                    </Pressable>
                </View>
            </ScrollView>
        </SafeAreaView>
    );
};

export default AssistancePageComponent;