import React from 'react';
import { View, Text, ImageBackground, Image, TouchableOpacity } from 'react-native';
import IMAGES from '../../../constants/Images';
import { SafeAreaView } from 'react-native-safe-area-context';
import { styles } from './style';

const Welcome = ({ navigation }) => {

  const goToDashboard=()=>{
    navigation.reset({ index: 0, routes: [{ name: 'Dashboard' }] })
  }

  return (
      <View style={styles.container}>
        <ImageBackground source={IMAGES.WelcomeBackground} style={styles.background} resizeMode='contain'>
          <View style={styles.content}>
            <Image source={IMAGES.Welcomelogo} style={styles.illustration} />
            <Text style={styles.title}>Welcome to {"\n"} Performics Store DNA</Text>
            <Text style={styles.subtitle}>Get quick access to store feedback and performance reports.</Text>
            <TouchableOpacity style={styles.button} onPress={() => goToDashboard()} >
              <Text style={styles.buttonText}>Continue</Text>
            </TouchableOpacity>
          </View>
        </ImageBackground>
      </View>
  );
};
export default Welcome;
