crazycharge-app/app/(auth)/(tabs)/(home)/notificationPage.tsx

import {
    View,
    Text,
    Pressable,
    Image,
    ScrollView,
    Alert,
    ImageBackground,
    ActivityIndicator,
    Dimensions
} from 'react-native';
import { SafeAreaView } from 'react-native-safe-area-context';
import { router, useLocalSearchParams } from 'expo-router';
import { CrossLogoSvg, PreviousPageBlackSvg } from '../../../../component/global/SVG';
import { useEffect, useState } from 'react';
import { chargeStationService } from '../../../../service/chargeStationService';
import NotificationTabView from '../../../../component/global/notificationTabViewComponent';
import { useTranslation } from '../../../../util/hooks/useTranslation';

const NotificationPageComponent = () => {
    const { t } = useTranslation(); // 使用翻译钩子
    const screenHeight = Dimensions.get('window').height;
    const [reservationAfter2025, setReservationAfter2025] = useState([]);
    const [passingThisPromotionToBell, setPassingThisPromotionToBell] = useState([]);
    
    const fetchData = async () => {
        try {
            const results = await Promise.allSettled([
                chargeStationService.fetchReservationHistories(),
                chargeStationService.getAdvertise()
            ]);
            // Handle reservation data
            if (results[0].status === 'fulfilled') {
                const year2025 = new Date('2025-02-01T00:00:00.000Z');
                const reservationAfter2025 = results[0].value.filter((r: any) => {
                    const date = new Date(r.createdAt);
                    return date > year2025;
                });
                setReservationAfter2025(reservationAfter2025);
            } else if (results[0].status === 'rejected') {
                Alert.alert(t('notifications.error_fetching_reservations_title'), results[0].reason);
            }

            // Handle promotion data
            if (results[1].status === 'fulfilled') {
                const passingThisPromotionToBell = results[1].value.filter((p: any) => p.is_show);
                setPassingThisPromotionToBell(passingThisPromotionToBell);
            } else if (results[1].status === 'rejected') {
                Alert.alert(t('notifications.error_fetching_promotions_title'), results[1].reason);
            }
        } catch (error) {
            console.log(t('notifications.error_fetching_data'));
        } finally {
        }
    };
    
    useEffect(() => {
        fetchData();
    }, []);
    
    return (
        <SafeAreaView className="flex-1 bg-white" edges={['top', 'left', 'right']}>
            <View style={{ minHeight: screenHeight, flex: 1 }}>
                <View className="mx-[5%]" style={{ marginTop: 25 }}>
                    <Pressable
                        onPress={() => {
                            if (router.canGoBack()) {
                                router.back();
                            } else {
                                router.replace('/optionPage');
                            }
                        }}
                        hitSlop={{ top: 20, bottom: 20, left: 20, right: 20 }}
                    >
                        <CrossLogoSvg />
                    </Pressable>
                    <Text style={{ fontSize: 45, marginVertical: 25 }}>{t('notifications.title')}</Text>
                </View>
                <View className="flex-1">
                    <NotificationTabView
                        titles={[t('notifications.charging_info'), t('notifications.promotions')]}
                        reservationAfter2025={reservationAfter2025}
                        passingThisPromotionToBell={passingThisPromotionToBell}
                    />
                </View>
            </View>
        </SafeAreaView>
    );
};

export default NotificationPageComponent;