diff options
Diffstat (limited to 'src/App.tsx')
-rw-r--r-- | src/App.tsx | 112 |
1 files changed, 0 insertions, 112 deletions
diff --git a/src/App.tsx b/src/App.tsx deleted file mode 100644 index e0a0241bb..000000000 --- a/src/App.tsx +++ /dev/null @@ -1,112 +0,0 @@ -/** - * Sample React Native App - * https://github.com/facebook/react-native - * - * Generated with the TypeScript template - * https://github.com/react-native-community/react-native-template-typescript - * - * @format - */ - -import React from 'react'; -import { - SafeAreaView, - ScrollView, - StatusBar, - StyleSheet, - Text, - Button, - useColorScheme, - View, -} from 'react-native'; -import {NavigationContainer} from '@react-navigation/native'; -import { - createNativeStackNavigator, - NativeStackScreenProps, -} from '@react-navigation/native-stack'; - -type RootStackParamList = { - Home: undefined; - Profile: {name: string}; -}; -const Stack = createNativeStackNavigator(); - -const Section: React.FC<{ - title: string; -}> = ({children, title}) => { - return ( - <View style={styles.sectionContainer}> - <Text style={styles.sectionTitle}>{title}</Text> - <Text style={styles.sectionDescription}>{children}</Text> - </View> - ); -}; - -const HomeScreen = ({ - navigation, -}: NativeStackScreenProps<RootStackParamList, 'Home'>) => { - const isDarkMode = useColorScheme() === 'dark'; - - return ( - <SafeAreaView> - <StatusBar barStyle={isDarkMode ? 'light-content' : 'dark-content'} /> - <ScrollView contentInsetAdjustmentBehavior="automatic"> - <View> - <Section title="Step One"> - Edit <Text style={styles.highlight}>App.tsx</Text> to change this - screen and then come back to see your edits. - <Button - title="Go to Jane's profile" - onPress={() => navigation.navigate('Profile', {name: 'Jane'})} - /> - </Section> - <Section title="Learn More"> - Read the docs to discover what to do next: - </Section> - </View> - </ScrollView> - </SafeAreaView> - ); -}; - -const ProfileScreen = ({ - route, -}: NativeStackScreenProps<RootStackParamList, 'Profile'>) => { - return <Text>This is {route.params.name}'s profile</Text>; -}; - -const App = () => { - return ( - <NavigationContainer> - <Stack.Navigator> - <Stack.Screen - name="Home" - component={HomeScreen} - options={{title: 'Welcome'}} - /> - <Stack.Screen name="Profile" component={ProfileScreen} /> - </Stack.Navigator> - </NavigationContainer> - ); -}; - -const styles = StyleSheet.create({ - sectionContainer: { - marginTop: 32, - paddingHorizontal: 24, - }, - sectionTitle: { - fontSize: 24, - fontWeight: '600', - }, - sectionDescription: { - marginTop: 8, - fontSize: 18, - fontWeight: '400', - }, - highlight: { - fontWeight: '700', - }, -}); - -export default App; |