import { View, Text, ScrollView, Pressable, Alert } from 'react-native';
import React, { useContext, useEffect, useState } from 'react';
import { SafeAreaView } from 'react-native-safe-area-context';
import { router } from 'expo-router';
import { CrossLogoSvg } from '../../../../component/global/SVG';
import { AuthContext } from '../../../../context/AuthProvider';
import NormalInput from '../../../../component/global/normal_input';
import NormalButton from '../../../../component/global/normal_button';
import { authenticationService } from '../../../../service/authService';
import * as SecureStore from 'expo-secure-store';
import { useLocalSearchParams } from 'expo-router';
const CouponDetailPage = () => {
    const { user, setUser } = useContext(AuthContext);
    const [token, setToken] = useState<string | null>(null);
    const [name, setName] = useState<string | null>(null);
    const [isLoading, setIsLoading] = useState(false);
    const [error, setError] = useState<string | null>(null);

    const handleChangeName = async () => {
        if (!name) {
            setError('請輸入新的暱稱');
            return;
        }
        if (!token) {
            setError('未找到有效的登錄令牌，請重新登錄');
            return;
        }
        setError(null);
        setIsLoading(true);
        try {
            const success = await authenticationService.changeName(name, token);
            if (success) {
                if (user) {
                    setUser({
                        ...user,
                        nickname: name
                    });
                }
                router.replace('accountMainPage');
            } else {
                setError('更新暱稱失敗，請稍後再試');
            }
        } catch (error) {
            console.error('Error changing name:', error);
            setError('發生錯誤，請稍後再試');
        } finally {
            setIsLoading(false);
        }
    };
    const { couponName, couponDescription } = useLocalSearchParams();
    return (
        <SafeAreaView className="flex-1 bg-white" edges={['top', 'right', 'left']}>
            <ScrollView className="flex-1 mx-[5%]">
                <View style={{ marginTop: 25 }}>
                    <Pressable
                        onPress={() => {
                            if (router.canGoBack()) {
                                router.back();
                            } else {
                                router.replace('/accountMainPage');
                            }
                        }}
                    >
                        <CrossLogoSvg />
                    </Pressable>
                    <Text style={{ fontSize: 45, marginVertical: 25 }}>優惠券詳情</Text>
                    <Text className="text-2xl pb-4">{couponName}</Text>
                    <Text className="text-lg pb-8">{couponDescription}</Text>
                </View>
                <NormalButton
                    title={
                        <Text
                            style={{
                                color: 'white',
                                fontSize: 16,
                                fontWeight: '800'
                            }}
                        >
                            立即使用優惠券
                        </Text>
                    }
                    onPress={() => {
                        Alert.alert(
                            '立即使用優惠券', // Title
                            '按確認打開相機，掃描充電站上的二維碼以使用優惠券', // Message
                            [
                                {
                                    text: '取消',
                                    style: 'cancel'
                                },
                                {
                                    text: '確認',
                                    onPress: () => router.push('scanQrPage')
                                }
                            ]
                        );
                    }}
                    extendedStyle={{ padding: 24 }}
                />
            </ScrollView>
        </SafeAreaView>
    );
};

export default CouponDetailPage;