import { View, Text, Image, Dimensions, StyleSheet } from 'react-native';
import React, { useEffect } from 'react';
import IMAGES from '../../../constants/Images';
import AsyncStorage from '@react-native-async-storage/async-storage';
import { useDispatch } from 'react-redux';
import { setUser } from '../../../redux/slices/userSlice';

const SplashScreen = ({ navigation }) => {
    const dispatch = useDispatch();

    useEffect(() => {
        checkLoginStatus();
    }, []);

    const checkLoginStatus = async () => {
        try {
            const isuserlogin = await AsyncStorage.getItem('@Dabur_DNA_User');
            console.log("isuserlogin", isuserlogin)
            const parsedUser = JSON.parse(isuserlogin);
            if (isuserlogin) {
                dispatch(setUser(parsedUser));
                setTimeout(() => {
                    navigation.reset({
                        index: 0,
                        routes: [{ name: 'Welcome' }],
                    });
                }, 1000);
            } else {
                 setTimeout(() => {
                navigation.reset({
                    index: 0,
                    routes: [{ name: 'Login' }],
                });
                }, 1000);
            }
        } catch (error) {
            console.error('Error checking login status:', error);
        }
    };


    return (
        <View style={styles.container}>
            <View style={styles.backgroundContainer}>
                <Image
                    source={IMAGES.splashFullImg}
                    resizeMode="stretch"
                    style={styles.backdrop}
                />
            </View>
            <View style={styles.overlay}>
                <Image style={styles.logo} source={IMAGES.AppLogo} />
            </View>
        </View>
    );
};

export default SplashScreen;

const styles = StyleSheet.create({
    backgroundContainer: {
        position: 'absolute',
        top: 0,
        bottom: 0,
        left: 0,
        right: 0,
    },
    container: {
        flex: 1,
        alignItems: 'center',
        justifyContent: 'center',
    },
    overlay: {
        opacity: 1,
        alignItems: 'center',
        justifyContent: 'center',
    },
    logo: {
        backgroundColor: 'rgba(0,0,0,0)',
        height: 200,
        width: 200,
        overflow: 'hidden',
        resizeMode: 'contain',
        marginTop: 5,
        justifyContent: 'center',
    },
    backdrop: {
        flex: 1,
        width: '100%',
        height: '100%',
    },
    headline: {
        fontSize: 18,
        textAlign: 'center',
        backgroundColor: 'black',
        color: 'white',
        //borderWidth:1
    },
});