2 files changed, 52 insertions, 24 deletions
diff --git a/src/screens/Login.tsx b/src/screens/Login.tsx
index 0eea085d5..8451eb3c8 100644
--- a/src/screens/Login.tsx
+++ b/src/screens/Login.tsx
@@ -1,18 +1,34 @@
 import React from 'react'
-import {Text, Button, View} from 'react-native'
+import {Text, Button, View, ActivityIndicator} from 'react-native'
+import {observer} from 'mobx-react-lite'
 import {Shell} from '../platform/shell'
 import type {RootTabsScreenProps} from '../routes/types'
 import {useStores} from '../state'
 
-export function Login({navigation}: RootTabsScreenProps<'Login'>) {
+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>
-        <Button title="Login" onPress={() => store.session.setAuthed(true)} />
-        <Button title="Sign Up" onPress={() => navigation.navigate('Signup')} />
+        {store.session.uiError ?? <Text>{store.session.uiError}</Text>}
+        {store.session.uiState === 'idle' ? (
+          <>
+            {store.session.hasAccount ?? (
+              <Button
+                title="Login"
+                onPress={() => store.session.loadAccount()}
+              />
+            )}
+            <Button
+              title="Sign Up"
+              onPress={() => navigation.navigate('Signup')}
+            />
+          </>
+        ) : (
+          <ActivityIndicator />
+        )}
       </View>
     </Shell>
   )
-}
+})
diff --git a/src/screens/Signup.tsx b/src/screens/Signup.tsx
index bab7abc1c..1d5915d65 100644
--- a/src/screens/Signup.tsx
+++ b/src/screens/Signup.tsx
@@ -1,24 +1,36 @@
 import React from 'react'
+import {Text, Button, View, ActivityIndicator} from 'react-native'
+import {observer} from 'mobx-react-lite'
 import {Shell} from '../platform/shell'
-import {Text, Button, View} from 'react-native'
 import type {RootTabsScreenProps} from '../routes/types'
 import {useStores} from '../state'
 
-export function Signup({navigation}: RootTabsScreenProps<'Signup'>) {
-  const store = useStores()
-  return (
-    <Shell>
-      <View style={{justifyContent: 'center', alignItems: 'center'}}>
-        <Text style={{fontSize: 20, fontWeight: 'bold'}}>Create Account</Text>
-        <Button
-          title="Create new account"
-          onPress={() => store.session.setAuthed(true)}
-        />
-        <Button
-          title="Log in to an existing account"
-          onPress={() => navigation.navigate('Login')}
-        />
-      </View>
-    </Shell>
-  )
-}
+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.uiState === 'idle' ? (
+            <>
+              <Button
+                title="Create new account"
+                onPress={() =>
+                  store.session.createTestAccount('http://localhost:1986')
+                }
+              />
+              <Button
+                title="Log in to an existing account"
+                onPress={() => navigation.navigate('Login')}
+              />
+            </>
+          ) : (
+            <ActivityIndicator />
+          )}
+        </View>
+      </Shell>
+    )
+  },
+)