import { View, Text, Pressable, Dimensions } from 'react-native';
import { SafeAreaView } from 'react-native-safe-area-context';
import { router } from 'expo-router';
import { CrossLogoSvg } from '../global/SVG';
import BookingTabViewComponent from '../global/bookingTabViewComponent';
import { useTranslation } from '../../util/hooks/useTranslation';

const ActivityRecordPageComponent = () => {
    const screenHeight = Dimensions.get('window').height;
    const { t } = useTranslation();

    return (
        <SafeAreaView className="flex-1 bg-white" edges={['top']}>
            <View style={{ minHeight: screenHeight, flex: 1 }}>
                <View className="mx-[5%]" style={{ marginTop: 25}}>
                    <Pressable
                        onPress={() => {
                            if (router.canGoBack()) {
                                router.back();
                            } else {
                                router.replace('/accountMainPage');
                            }
                        }}
                    >
                        <CrossLogoSvg />
                    </Pressable>
                    <Text style={{ fontSize: 45, marginTop: 25, marginBottom: 10 }}>{t('chargingHistory.charging_records')}</Text>
                </View>
                <View className="flex-1">
                    <BookingTabViewComponent />
                </View>
                <View style={{ width: "100%",height: 150 }} />
            </View>
        </SafeAreaView>
    );
};

export default ActivityRecordPageComponent;