import { Link, Stack } from 'expo-router';
import { StyleSheet } from 'react-native';
import { ThemedText, ThemedTextButton, ThemedView } from '@/components/theme';

const NotFoundScreen = () => {
  return (
    <>
      <Stack.Screen options={{ title: 'Page not found' }} />
      <ThemedView style={styles.container}>
        <ThemedText type='title'>This screen doesn't exist.</ThemedText>
        <Link href='/'>
          <ThemedTextButton width={200} height={45} text='Go to home screen' fontSize={24} />
        </Link>
      </ThemedView>
    </>
  );
};
export default NotFoundScreen;

const styles = StyleSheet.create({
  container: {
    flex: 1,
    alignItems: 'center',
    justifyContent: 'center',
    padding: 20,
  },
});