summaryrefslogtreecommitdiff
path: root/app/navigators/main-navigator.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'app/navigators/main-navigator.tsx')
-rw-r--r--app/navigators/main-navigator.tsx57
1 files changed, 57 insertions, 0 deletions
diff --git a/app/navigators/main-navigator.tsx b/app/navigators/main-navigator.tsx
new file mode 100644
index 0000000..9ad110a
--- /dev/null
+++ b/app/navigators/main-navigator.tsx
@@ -0,0 +1,57 @@
+/**
+ * This is the navigator you will modify to display the logged-in screens of your app.
+ * You can use RootNavigator to also display an auth flow or other user flows.
+ *
+ * You'll likely spend most of your time in this file.
+ */
+import React from "react"
+import { createStackNavigator } from "@react-navigation/stack"
+import { WelcomeScreen, DemoScreen, DemoListScreen } from "../screens"
+
+/**
+ * This type allows TypeScript to know what routes are defined in this navigator
+ * as well as what properties (if any) they might take when navigating to them.
+ *
+ * If no params are allowed, pass through `undefined`. Generally speaking, we
+ * recommend using your MobX-State-Tree store(s) to keep application state
+ * rather than passing state through navigation params.
+ *
+ * For more information, see this documentation:
+ * https://reactnavigation.org/docs/params/
+ * https://reactnavigation.org/docs/typescript#type-checking-the-navigator
+ */
+export type PrimaryParamList = {
+ welcome: undefined
+ demo: undefined
+ demoList: undefined
+}
+
+// Documentation: https://reactnavigation.org/docs/stack-navigator/
+const Stack = createStackNavigator<PrimaryParamList>()
+
+export function MainNavigator() {
+ return (
+ <Stack.Navigator
+ screenOptions={{
+ cardStyle: { backgroundColor: "transparent" },
+ headerShown: false,
+ }}
+ >
+ <Stack.Screen name="welcome" component={WelcomeScreen} />
+ <Stack.Screen name="demo" component={DemoScreen} />
+ <Stack.Screen name="demoList" component={DemoListScreen} />
+ </Stack.Navigator>
+ )
+}
+
+/**
+ * A list of routes from which we're allowed to leave the app when
+ * the user presses the back button on Android.
+ *
+ * Anything not on this list will be a standard `back` action in
+ * react-navigation.
+ *
+ * `canExit` is used in ./app/app.tsx in the `useBackButtonHandler` hook.
+ */
+const exitRoutes = ["welcome"]
+export const canExit = (routeName: string) => exitRoutes.includes(routeName)