import * as React from 'react';
import { useState, useEffect } from 'react';
import { SafeAreaView, Button, View, Text, Image, ImageBackground, Platform } from 'react-native';
import CustomHeader from '../../components/header.js';
import Assets from '../../components/assets.manager.js';
import Theme from '../../components/theme.style.js';

export default function SplashScreen(navigation) {

  const [logo, setlogo] = useState(Assets.logo.iconWhite);
  const [size, setsize] = useState(Theme.screen.h / 2);

  useEffect(() => {
    setTimeout(function(){
      setsize(90)
      setlogo(Assets.logo.reverse);
    }, Platform.OS == 'ios' ? 1400 : 700)
  }, [])

  return (
    <SafeAreaView style={{flex: 1, justifyContent: 'center', alignItems: 'center', backgroundColor: Theme.colors.primary}}>
      <Image source={logo} style={{height: size, width: '100%', resizeMode: 'contain'}} />
      {/* <Image source={Assets.logo.reverse} style={{height: 120, resizeMode: 'contain'}} /> */}
    </SafeAreaView>
  );
}