I've just start learning react native and I tried to make a navigation with react-navigation. The problem is I am getting this error and I don't know what to do. I have checked other answers which did not work for me.

My code: App.js

import React from 'react';
import { Button, SectionList, StyleSheet, View, Text, TextInput } from 'react-native';
import Constants from 'expo-constants';
import { createSwitchNavigator, createAppContainer } from 'react-navigation';
import { createStackNavigator } from 'react-navigation-stack';

import Login from "./Login"
import AppNavigator from './Navigation';

export default class App extends React.Component {
  state = {

  }

  render() {
    return (
      <AppNavigator />
    );
  }
}

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

Navigation.js

import React from 'react';
import { Button, SectionList, StyleSheet, View, Text, TextInput } from 'react-native';
import Constants from 'expo-constants';
import { createSwitchNavigator, createAppContainer } from 'react-navigation';
import { createStackNavigator } from 'react-navigation-stack';
import Login from "./Login"

const AuthNavigator = createSwitchNavigator({
    Login: Login
  })
  
const AppNavigatorStack = createSwitchNavigator({
    Auth: AuthNavigator
})
  
const AppNavigator = createAppContainer(AppNavigatorStack)

export default AppNavigator;

Login.js

import React from 'react';
import { Button, SectionList, StyleSheet, View, Text, TextInput } from 'react-native';
import Constants from 'expo-constants';

export default class Login extends React.Component {

render() {
    return (
        <View>
            <Text>
                test
            </Text>
        </View>
    )
}