import React, { Component } from 'react';
import { NavigationContainer } from '@react-navigation/native';
import { createNativeStackNavigator } from '@react-navigation/native-stack';
import { NavTabScreen } from './src/router';
import Twitter from '@/pages/screens/twitter';
import Redpack from '@/pages/screens/redpack';
import Login from '@/pages/screens/login';
import WebView from '@/pages/screens/webview';
import Comment from '@/pages/screens/twitterComment';
import NftGroupDetail from '@/components/nftGroupDetail';
import { SafeAreaProvider } from 'react-native-safe-area-context';
import { ModalPortal } from 'react-native-modals';

class App extends Component {
	render() {
		const stackNavigator = createNativeStackNavigator();

		return (
			<SafeAreaProvider>
				<NavigationContainer>
					<stackNavigator.Navigator>
						<stackNavigator.Screen
							name="HomeTab"
							component={NavTabScreen}
							options={{
								headerShown: false,
							}}
						/>
						<stackNavigator.Screen
							name="Twitter"
							component={Twitter}
						/>
						<stackNavigator.Screen
							name="Redpack"
							component={Redpack}
						/>
						<stackNavigator.Screen
							name="WebView"
							component={WebView}
						/>
						<stackNavigator.Screen
							name="Comment"
							component={Comment}
							options={{
								title: 'Tag 3 friends to complete the task',
							}}
						/>
						<stackNavigator.Screen name="NftGroupDetail" component={NftGroupDetail} />
						<stackNavigator.Screen name="Login" component={Login} />
					</stackNavigator.Navigator>
				</NavigationContainer>
				<ModalPortal />
			</SafeAreaProvider>
		);
	}
}
export default App;