very basics of auth state - not actually authenticating anything right now....

2025-08-05 12:04:02 -05:00
parent 813cb44637
commit 409f15f233
8 changed files with 224 additions and 23 deletions
--- a/app/login.tsx
+++ b/app/login.tsx
@@ -0,0 +1,84 @@
+import { router } from 'expo-router'
+import React from 'react'
+import { StyleSheet, Text, TextInput, TouchableOpacity, View } from 'react-native'
+import { useSession } from './ctx'
+
+export default function LoginScreen() {
+    const [username, setUsername] = React.useState('')
+    const [password, setPassword] = React.useState('')
+    const { login } = useSession()
+
+    return (
+        <View style={styles.container}>
+            <Text style={styles.text}>Login</Text>
+            <View style={{ width: '80%', marginTop: 20 }}>
+                <Text style={styles.textlabel}>Username</Text>
+                <TextInput
+                    style={styles.input}
+                    value={username}
+                    placeholder='Enter username'
+                    onChangeText={setUsername}
+                />
+                <Text style={styles.textlabel}>Password</Text>
+                <TextInput
+                    style={styles.input}
+                    value={password}
+                    placeholder='Enter password'
+                    secureTextEntry
+                    onChangeText={setPassword}
+                />
+                <TouchableOpacity
+                    style={styles.button}
+                    onPress={() => {
+                        login()
+                        if (localStorage.getItem('session') === 'success') {
+                            router.replace('/')
+                        }
+                    }}
+                >
+                    <Text style={{ color: '#fff', fontWeight: 'bold' }}>Login</Text>
+                </TouchableOpacity>
+                <TouchableOpacity
+                    style={styles.signup}
+                    onPress={() => {
+                        router.navigate('/signup')
+                    }}
+                >
+                    <Text style={{ color: '#fff' }}>Sign Up</Text>
+                </TouchableOpacity>
+            </View>
+        </View>
+    )
+}
+
+const styles = StyleSheet.create({
+    container: {
+        flex: 1,
+        backgroundColor: '#25292e',
+        justifyContent: 'center',
+        alignItems: 'center'
+    },
+    text: {
+        color: '#fff'
+    },
+    textlabel: {
+        color: '#fff',
+        marginBottom: 3
+    },
+    input: {
+        backgroundColor: '#fff',
+        borderRadius: 5,
+        padding: 10,
+        marginBottom: 15
+    },
+    button: {
+        backgroundColor: '#1e90ff',
+        padding: 12,
+        borderRadius: 5,
+        alignItems: 'center',
+        marginBottom: 12
+    },
+    signup: {
+        alignItems: 'center'
+    }
+})