diff --git a/README.md b/README.md index 159d374a..9627e39e 100644 --- a/README.md +++ b/README.md @@ -24,8 +24,6 @@ Uses: ## TODOs -- Navigation - - Auth / Unauthed - Web - Desktop vs mobile styling - API diff --git a/package.json b/package.json index 764c79b4..763f6d89 100644 --- a/package.json +++ b/package.json @@ -17,6 +17,7 @@ "@react-navigation/native-stack": "^6.6.2", "@react-navigation/stack": "^6.2.1", "mobx": "^6.6.0", + "mobx-react-lite": "^3.4.0", "mobx-state-tree": "^5.1.5", "react": "17.0.2", "react-dom": "17.0.2", diff --git a/src/routes/index.tsx b/src/routes/index.tsx index 9ea1766f..fa035e3c 100644 --- a/src/routes/index.tsx +++ b/src/routes/index.tsx @@ -8,12 +8,16 @@ import { } from '@react-navigation/native' import {createNativeStackNavigator} from '@react-navigation/native-stack' import {createBottomTabNavigator} from '@react-navigation/bottom-tabs' +import {observer} from 'mobx-react-lite' import type {RootStackParamList} from './types' +import {useStores} from '../state' import {Home} from '../screens/Home' import {Search} from '../screens/Search' import {Notifications} from '../screens/Notifications' import {Menu} from '../screens/Menu' import {Profile} from '../screens/Profile' +import {Login} from '../screens/Login' +import {Signup} from '../screens/Signup' import {NotFound} from '../screens/NotFound' const linking: LinkingOptions = { @@ -30,6 +34,8 @@ const linking: LinkingOptions = { Menu: 'menu', }, }, + Login: 'login', + Signup: 'signup', Profile: 'profile/:name', NotFound: '*', }, @@ -50,23 +56,38 @@ const tabBarScreenOptions = ({ }, }) -const Primary = () => ( - - - - - - -) +function Primary() { + return ( + + + + + + + ) +} -export const Root = () => ( - Loading...}> - - - - - - -) +export const Root = observer(() => { + const store = useStores() + return ( + Loading...}> + + {store.session.isAuthed ? ( + <> + + + + + ) : ( + <> + + + + )} + + + ) +}) diff --git a/src/routes/types.ts b/src/routes/types.ts index 668dc2e2..88148fd4 100644 --- a/src/routes/types.ts +++ b/src/routes/types.ts @@ -6,6 +6,8 @@ import type {BottomTabScreenProps} from '@react-navigation/bottom-tabs' export type RootStackParamList = { Primary: undefined Profile: {name: string} + Login: undefined + Signup: undefined NotFound: undefined } export type RootStackScreenProps = diff --git a/src/screens/Home.tsx b/src/screens/Home.tsx index f4b8ffb6..a2d013ab 100644 --- a/src/screens/Home.tsx +++ b/src/screens/Home.tsx @@ -1,8 +1,10 @@ import React from 'react' import {Text, Button, View, SafeAreaView} from 'react-native' import type {PrimaryTabScreenProps} from '../routes/types' +import {useStores} from '../state' -export const Home = ({navigation}: PrimaryTabScreenProps<'Home'>) => { +export function Home({navigation}: PrimaryTabScreenProps<'Home'>) { + const store = useStores() return ( @@ -11,6 +13,7 @@ export const Home = ({navigation}: PrimaryTabScreenProps<'Home'>) => { title="Go to Jane's profile" onPress={() => navigation.navigate('Profile', {name: 'Jane'})} /> +