Merge pull request #1 from calblueprint/charlottelaw/jdi-10-home-page…

…-navigation

App Routing

App.tsx

@@ -1,22 +1,22 @@
-import { StyleSheet, Text, View } from 'react-native';
-import { StatusBar } from 'expo-status-bar';
-import Logo from '@/components/Logo';
+import * as React from 'react';
+import { NavigationContainer } from '@react-navigation/native';
+import { createNativeStackNavigator } from '@react-navigation/native-stack';
+import HealingResources from '@/HealingResources';
+import Home from '@/Home';
+import LegalRights from '@/LegalRights';
+import SeekHelp from '@/SeekHelp';
+
+const Stack = createNativeStackNavigator();
 
 export default function App() {
   return (
-    <View style={styles.container}>
-      <Logo />
-      <Text>Open up App.tsx to start working on your app!</Text>
-      <StatusBar style="auto" />
-    </View>
+    <NavigationContainer independent={true}>
+      <Stack.Navigator initialRouteName="Home">
+        <Stack.Screen name="Home" component={Home} />
+        <Stack.Screen name="Healing Resources" component={HealingResources} />
+        <Stack.Screen name="Legal Rights" component={LegalRights} />
+        <Stack.Screen name="Seek Help" component={SeekHelp} />
+      </Stack.Navigator>
+    </NavigationContainer>
   );
 }
-
-const styles = StyleSheet.create({
-  container: {
-    flex: 1,
-    backgroundColor: '#fff',
-    alignItems: 'center',
-    justifyContent: 'center',
-  },
-});

package.json

@@ -16,6 +16,7 @@
   },
   "dependencies": {
     "@react-navigation/native": "^6.1.18",
+    "@react-navigation/native-stack": "^6.11.0",
     "@supabase/supabase-js": "^2.45.4",
     "expo": "~51.0.21",
     "expo-status-bar": "~1.12.1",

src/HealingResources/index.tsx

@@ -0,0 +1,5 @@
+import { Text } from 'react-native';
+
+export default function HealingResources() {
+  return <Text>hello</Text>;
+}

src/Home/index.tsx

@@ -0,0 +1,21 @@
+import { Button, Text, View } from 'react-native';
+
+export default function Home({ navigation }) {
+  return (
+    <View>
+      <Text>hello</Text>
+      <Button
+        title="Healing Resources"
+        onPress={() => navigation.navigate('Healing Resources')}
+      />
+      <Button
+        title="Legal Rights"
+        onPress={() => navigation.navigate('Legal Rights')}
+      />
+      <Button
+        title="Seek Help"
+        onPress={() => navigation.navigate('Seek Help')}
+      />
+    </View>
+  );
+}

src/LegalRights/index.tsx

@@ -0,0 +1,5 @@
+import { Text } from 'react-native';
+
+export default function LegalRights() {
+  return <Text>LEGAL RIGHTS!!</Text>;
+}

src/SeekHelp/index.tsx

@@ -0,0 +1,5 @@
+import { Text } from 'react-native';
+
+export default function SeekHelp() {
+  return <Text>SEEK HELP!</Text>;
+}