import React, { useState, useEffect } from 'react'; import { TouchableOpacity, StyleSheet, ActivityIndicator } from 'react-native'; import { ThemedView } from '@/components/ThemedView'; import { ThemedText } from '@/components/ThemedText'; import AsyncStorage from '@react-native-async-storage/async-storage'; import axios from 'axios'; interface User { id: number; name: string; message: string; } interface UserSelectionProps { onUserSelected: (user: User) => void; } const API_KEY = 'I_Love_Madeline'; //const BASE_URL = 'https://ismadelinethecutest.gibbyb.com/api'; const BASE_URL = 'http://192.168.0.39:3000/api'; const UserSelection: React.FC = ({ onUserSelected }) => { const [users, setUsers] = useState([]); const [loading, setLoading] = useState(true); useEffect(() => { checkStoredUser(); }, []); const checkStoredUser = async () => { try { const storedUser = await AsyncStorage.getItem('@user'); if (storedUser) { onUserSelected(JSON.parse(storedUser)); } else { fetchUsers(); } } catch (e) { console.error('Failed to load user', e); fetchUsers(); } }; const fetchUsers = async () => { try { const response = await axios.get(`${BASE_URL}/getUsers`, { params: { apiKey: API_KEY } }); setUsers(response.data); } catch (e) { console.error('Failed to fetch users', e); } finally { setLoading(false); } }; const selectUser = async (user: User) => { try { await AsyncStorage.setItem('@user', JSON.stringify(user)); onUserSelected(user); } catch (e) { console.error('Failed to save user', e); } }; if (loading) { return ( ); } return ( Who are you? {users.map((user) => ( selectUser(user)} > {user.name} ))} ); }; const styles = StyleSheet.create({ container: { flex: 1, justifyContent: 'center', alignItems: 'center', }, title: { fontSize: 24, fontWeight: 'bold', marginBottom: 20, }, button: { backgroundColor: '#007AFF', padding: 15, borderRadius: 5, marginVertical: 10, width: 200, alignItems: 'center', }, buttonText: { color: 'white', fontSize: 18, fontWeight: 'bold', }, }); export default UserSelection;