import { Stack } from 'expo-router/stack';
import AuthProvider, { useAuth } from '../context/AuthProvider';
import { EXPO_PUBLIC_NODE_ENV } from '@env';
import { GestureHandlerRootView } from 'react-native-gesture-handler';
import { useEffect, useState } from 'react';
import { checkVersion } from '../component/checkVersion';
import { authenticationService } from '../service/authService';
import { usePushNotifications } from './hooks/usePushNotifications';
import Constants from 'expo-constants';
import { Alert } from 'react-native';
export default function RootLayout() {
    const [isLoading, setIsLoading] = useState(true);
    const { user } = useAuth();
    const { expoPushToken, notification } = usePushNotifications();
    const data = JSON.stringify(notification, undefined, 2);

    useEffect(() => {
        const logAppConfig = async () => {
            console.log('=== App Configuration ===');
            console.log('Environment:', EXPO_PUBLIC_NODE_ENV);
            console.log('App Version:', Constants.expoConfig?.version);
            console.log('Runtime Version:', Constants.expoConfig?.runtimeVersion);
            console.log('Update Channel:', Constants.expoConfig?.updates?.channel);
            console.log('Release Channel:', Constants.manifest?.releaseChannel);
            console.log('======================');
        };

        const init = async () => {
            try {
                await logAppConfig();

                console.log('Fetching version info...');
                const response = await authenticationService.getVersion();
                console.log('Version response:', response);

                console.log('Checking version...');
                checkVersion(response);

                console.log('Initialization complete');
            } catch (error) {
                console.error('Initialization error:', error);
                // Log additional context but don't crash
                Alert.alert('Initialization Error', 'Please check your connection and try again.');
            }
        };

        init();
    }, []);

    useEffect(() => {
        const fetchVersion = async () => {
            const response = await authenticationService.getVersion();
            checkVersion(response);
        };
        fetchVersion();
    }, []);

    return (
        <GestureHandlerRootView style={{ flex: 1 }}>
            <AuthProvider>
                <Stack>
                    <Stack.Screen name="(auth)/(tabs)" options={{ headerShown: false }} />
                    <Stack.Screen name="(public)/login" options={{ headerShown: false }} />
                    <Stack.Screen name="(public)/registerChooseVehiclesOne" options={{ headerShown: false }} />
                    <Stack.Screen name="(public)/registerChooseVehiclesTwo" options={{ headerShown: false }} />
                    {/* Testing Purpose */}
                    {EXPO_PUBLIC_NODE_ENV == 'development' ? (
                        <Stack.Screen
                            name="(public)/test"
                            options={{
                                headerShown: false,
                                title: 'Test Component Page'
                            }}
                        />
                    ) : (
                        <></>
                    )}
                </Stack>
            </AuthProvider>
        </GestureHandlerRootView>
    );
}