[nav] Add temporary navigation between pages

.eslintrc.js

@@ -1,4 +1,7 @@
 module.exports = {
-    extends: ['@calblueprint/eslint-config-react'],
-  };
-
+  extends: ['@calblueprint/eslint-config-react'],
+  rules: {
+    'react/react-in-jsx-scope': 'off',
+    'react/jsx-uses-react': 'off',
+  },
+};

.github/workflows/lint.yml

@@ -53,4 +53,4 @@ jobs:
       # Check for TypeScript errors #
       ################################
       - name: Run TypeScript compiler (tsc)
-        run: npx tsc --noEmit
+        run: npx tsc --noEmit

.husky/pre-commit

@@ -2,3 +2,4 @@
 . "$(dirname -- "$0")/_/husky.sh"
 
 npm run prepare
+npm run prettier

.vscode/extensions.json

@@ -1,8 +1,8 @@
 {
-    "recommendations": [
-      "dbaeumer.vscode-eslint",
-      "esbenp.prettier-vscode",
-      "eamodio.gitlens"
-    ],
-    "unwantedRecommendations": []
-}
+  "recommendations": [
+    "dbaeumer.vscode-eslint",
+    "esbenp.prettier-vscode",
+    "eamodio.gitlens"
+  ],
+  "unwantedRecommendations": []
+}

.vscode/settings.json

@@ -1,8 +1,8 @@
 {
-    "editor.defaultFormatter": "esbenp.prettier-vscode", 
-    "editor.codeActionsOnSave": {
-      "source.formatDocument": true,
-      "source.fixAll.eslint": true, 
-      "source.organizeImports": true
-    }
-}
+  "editor.defaultFormatter": "esbenp.prettier-vscode",
+  "editor.codeActionsOnSave": {
+    "source.formatDocument": true,
+    "source.fixAll.eslint": true,
+    "source.organizeImports": true
+  }
+}

App.tsx

@@ -1,26 +1,22 @@
-import { StatusBar } from 'expo-status-bar';
-import { StyleSheet, Text, View } from 'react-native';
+import { NavigationContainer } from '@react-navigation/native';
+import { createNativeStackNavigator } from '@react-navigation/native-stack';
+import HomeScreen from './src/screens/HomeScreen';
+import LoginScreen from './src/screens/LoginScreen';
+import StoryScreen from './src/screens/StoryScreen';
+import ToastScreen from './src/screens/ToastScreen';
+import { RootStackParamsList } from './src/types/types';
+
+const Stack = createNativeStackNavigator<RootStackParamsList>();
 
 export default function App() {
   return (
-    <View style={styles.container}>
-      <Text>The Girls Write Now Team!</Text>
-      <Text>Akshay</Text>
-      <Text>Brenda</Text>
-      <Text>...</Text>
-      <Text>...</Text>
-      <Text>...</Text>
-      <Text>...</Text>
-      <StatusBar style="auto" />
-    </View>
+    <NavigationContainer>
+      <Stack.Navigator>
+        <Stack.Screen name="Home" component={HomeScreen} />
+        <Stack.Screen name="Story" component={StoryScreen} />
+        <Stack.Screen name="Login" component={LoginScreen} />
+        <Stack.Screen name="Toast" component={ToastScreen} />
+      </Stack.Navigator>
+    </NavigationContainer>
   );
 }
-
-const styles = StyleSheet.create({
-  container: {
-    flex: 1,
-    backgroundColor: '#fff',
-    alignItems: 'center',
-    justifyContent: 'center',
-  },
-});

babel.config.js

@@ -1,4 +1,4 @@
-module.exports = function (api) {
+module.exports = api => {
   api.cache(true);
   return {
     presets: ['babel-preset-expo'],