// component/accountPages/assistancePageComponent.tsx
import { View, Text, ScrollView, Pressable, Linking, Alert } from 'react-native';
import React from 'react';
import { SafeAreaView } from 'react-native-safe-area-context';
import { router } from 'expo-router';
import { CrossLogoSvg } from '../global/SVG';
import { handleGoWhatsApp } from '../../util/index';
import { useTranslation } from '../../util/hooks/useTranslation';

const AssistancePageComponent = () => {
    const { t } = useTranslation();

    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 }}>{t('assistance.troubleshooting')}</Text>
                </View>
                <View>
                    <Text className="text-lg">
                        {t('assistance.description')}
                    </Text>
                    <Pressable onPress={handleGoWhatsApp}>
                        <Text className="text-3xl font-semibold underline text-[#02677D] pt-2">+852 9138 2139</Text>
                    </Pressable>
                </View>
            </ScrollView>
        </SafeAreaView>
    );
};

export default AssistancePageComponent;