8 files changed, 159 insertions, 0 deletions
diff --git a/src/view/screens/Home.tsx b/src/view/screens/Home.tsx
new file mode 100644
index 000000000..5210d9d40
--- /dev/null
+++ b/src/view/screens/Home.tsx
@@ -0,0 +1,21 @@
+import React from 'react'
+import {Text, Button, View} from 'react-native'
+import {Shell} from '../shell'
+import type {RootTabsScreenProps} from '../routes/types'
+import {useStores} from '../../state'
+
+export function Home({navigation}: RootTabsScreenProps<'Home'>) {
+  const store = useStores()
+  return (
+    <Shell>
+      <View style={{alignItems: 'center'}}>
+        <Text style={{fontSize: 20, fontWeight: 'bold'}}>Home</Text>
+        <Button
+          title="Go to Jane's profile"
+          onPress={() => navigation.navigate('Profile', {name: 'Jane'})}
+        />
+        <Button title="Logout" onPress={() => store.session.logout()} />
+      </View>
+    </Shell>
+  )
+}
diff --git a/src/view/screens/Login.tsx b/src/view/screens/Login.tsx
new file mode 100644
index 000000000..207557369
--- /dev/null
+++ b/src/view/screens/Login.tsx
@@ -0,0 +1,29 @@
+import React from 'react'
+import {Text, Button, View, ActivityIndicator} from 'react-native'
+import {observer} from 'mobx-react-lite'
+import {Shell} from '../shell'
+import type {RootTabsScreenProps} from '../routes/types'
+import {useStores} from '../../state'
+
+export const Login = observer(({navigation}: RootTabsScreenProps<'Login'>) => {
+  const store = useStores()
+  return (
+    <Shell>
+      <View style={{justifyContent: 'center', alignItems: 'center'}}>
+        <Text style={{fontSize: 20, fontWeight: 'bold'}}>Sign In</Text>
+        {store.session.uiError ?? <Text>{store.session.uiError}</Text>}
+        {!store.session.uiIsProcessing ? (
+          <>
+            <Button title="Login" onPress={() => store.session.login()} />
+            <Button
+              title="Sign Up"
+              onPress={() => navigation.navigate('Signup')}
+            />
+          </>
+        ) : (
+          <ActivityIndicator />
+        )}
+      </View>
+    </Shell>
+  )
+})
diff --git a/src/view/screens/Menu.tsx b/src/view/screens/Menu.tsx
new file mode 100644
index 000000000..8cf93676e
--- /dev/null
+++ b/src/view/screens/Menu.tsx
@@ -0,0 +1,16 @@
+import React from 'react'
+import {Shell} from '../shell'
+import {ScrollView, Text, View} from 'react-native'
+import type {RootTabsScreenProps} from '../routes/types'
+
+export const Menu = (_props: RootTabsScreenProps<'Menu'>) => {
+  return (
+    <Shell>
+      <ScrollView contentInsetAdjustmentBehavior="automatic">
+        <View style={{justifyContent: 'center', alignItems: 'center'}}>
+          <Text style={{fontSize: 20, fontWeight: 'bold'}}>Menu</Text>
+        </View>
+      </ScrollView>
+    </Shell>
+  )
+}
diff --git a/src/view/screens/NotFound.tsx b/src/view/screens/NotFound.tsx
new file mode 100644
index 000000000..3f6dd7aa0
--- /dev/null
+++ b/src/view/screens/NotFound.tsx
@@ -0,0 +1,15 @@
+import React from 'react'
+import {Shell} from '../shell'
+import {Text, Button, View} from 'react-native'
+import type {RootTabsScreenProps} from '../routes/types'
+
+export const NotFound = ({navigation}: RootTabsScreenProps<'NotFound'>) => {
+  return (
+    <Shell>
+      <View style={{justifyContent: 'center', alignItems: 'center'}}>
+        <Text style={{fontSize: 20, fontWeight: 'bold'}}>Page not found</Text>
+        <Button title="Home" onPress={() => navigation.navigate('Home')} />
+      </View>
+    </Shell>
+  )
+}
diff --git a/src/view/screens/Notifications.tsx b/src/view/screens/Notifications.tsx
new file mode 100644
index 000000000..5bade68fa
--- /dev/null
+++ b/src/view/screens/Notifications.tsx
@@ -0,0 +1,14 @@
+import React from 'react'
+import {Shell} from '../shell'
+import {Text, View} from 'react-native'
+import type {RootTabsScreenProps} from '../routes/types'
+
+export const Notifications = (_props: RootTabsScreenProps<'Notifications'>) => {
+  return (
+    <Shell>
+      <View style={{justifyContent: 'center', alignItems: 'center'}}>
+        <Text style={{fontSize: 20, fontWeight: 'bold'}}>Notifications</Text>
+      </View>
+    </Shell>
+  )
+}
diff --git a/src/view/screens/Profile.tsx b/src/view/screens/Profile.tsx
new file mode 100644
index 000000000..2c93f4bf9
--- /dev/null
+++ b/src/view/screens/Profile.tsx
@@ -0,0 +1,16 @@
+import React from 'react'
+import {Shell} from '../shell'
+import {View, Text} from 'react-native'
+import type {RootTabsScreenProps} from '../routes/types'
+
+export const Profile = ({route}: RootTabsScreenProps<'Profile'>) => {
+  return (
+    <Shell>
+      <View style={{justifyContent: 'center', alignItems: 'center'}}>
+        <Text style={{fontSize: 20, fontWeight: 'bold'}}>
+          {route.params?.name}'s profile
+        </Text>
+      </View>
+    </Shell>
+  )
+}
diff --git a/src/view/screens/Search.tsx b/src/view/screens/Search.tsx
new file mode 100644
index 000000000..2f111cf72
--- /dev/null
+++ b/src/view/screens/Search.tsx
@@ -0,0 +1,14 @@
+import React from 'react'
+import {Shell} from '../shell'
+import {Text, View} from 'react-native'
+import type {RootTabsScreenProps} from '../routes/types'
+
+export const Search = (_props: RootTabsScreenProps<'Search'>) => {
+  return (
+    <Shell>
+      <View style={{justifyContent: 'center', alignItems: 'center'}}>
+        <Text style={{fontSize: 20, fontWeight: 'bold'}}>Search</Text>
+      </View>
+    </Shell>
+  )
+}
diff --git a/src/view/screens/Signup.tsx b/src/view/screens/Signup.tsx
new file mode 100644
index 000000000..8ca47e3ef
--- /dev/null
+++ b/src/view/screens/Signup.tsx
@@ -0,0 +1,34 @@
+import React from 'react'
+import {Text, Button, View, ActivityIndicator} from 'react-native'
+import {observer} from 'mobx-react-lite'
+import {Shell} from '../shell'
+import type {RootTabsScreenProps} from '../routes/types'
+import {useStores} from '../../state'
+
+export const Signup = observer(
+  ({navigation}: RootTabsScreenProps<'Signup'>) => {
+    const store = useStores()
+    return (
+      <Shell>
+        <View style={{justifyContent: 'center', alignItems: 'center'}}>
+          <Text style={{fontSize: 20, fontWeight: 'bold'}}>Create Account</Text>
+          {store.session.uiError ?? <Text>{store.session.uiError}</Text>}
+          {!store.session.uiIsProcessing ? (
+            <>
+              <Button
+                title="Create new account"
+                onPress={() => store.session.login()}
+              />
+              <Button
+                title="Log in to an existing account"
+                onPress={() => navigation.navigate('Login')}
+              />
+            </>
+          ) : (
+            <ActivityIndicator />
+          )}
+        </View>
+      </Shell>
+    )
+  },
+)