MVP is done. App is functional

This commit is contained in:
Gabriel Brown 2024-09-10 11:03:30 -05:00
parent 5dfbc98035
commit 274c3a5151
4 changed files with 142 additions and 24 deletions

View File

@ -4,17 +4,17 @@ import { ThemedText } from '@/components/ThemedText';
import { ThemedView } from '@/components/ThemedView'; import { ThemedView } from '@/components/ThemedView';
import axios from 'axios'; import axios from 'axios';
//const API_KEY = 'I_Love_Madeline'; const API_KEY = 'I_Love_Madeline';
const BASE_URL = 'http://192.168.0.39:3000/api'; //const BASE_URL = 'http://192.168.0.39:3000/api';
//const BASE_URL = 'https://ismadelinethecutest.gibbyb.com/api'; const BASE_URL = 'https://ismadelinethecutest.gibbyb.com/api';
// Separate API call function // Separate API call function
const fetchCountdownDate = async () => { const fetchCountdownDate = async () => {
try { try {
//const response = await axios.get(`${BASE_URL}/getCountdown`, { const response = await axios.get(`${BASE_URL}/getCountdown`, {
//params: { apiKey: API_KEY } params: { apiKey: API_KEY }
//}); });
const response = await axios.get(`${BASE_URL}/getCountdown?apiKey=I_Love_Madeline`); //const response = await axios.get(`${BASE_URL}/getCountdown?apiKey=I_Love_Madeline`);
console.log('API response:', response.data); console.log('API response:', response.data);
if (response.data && response.data[0] && response.data[0].countdown) { if (response.data && response.data[0] && response.data[0].countdown) {
console.log('Countdown date:', response.data[0].countdown); console.log('Countdown date:', response.data[0].countdown);

View File

@ -1,15 +1,53 @@
import { Image, StyleSheet, Platform } from 'react-native'; import React, { useState, useEffect } from 'react';
import { StyleSheet } from 'react-native';
import { ThemedText } from '@/components/ThemedText'; import { ThemedText } from '@/components/ThemedText';
import { ThemedView } from '@/components/ThemedView'; import { ThemedView } from '@/components/ThemedView';
import AsyncStorage from '@react-native-async-storage/async-storage';
import axios from 'axios';
const API_KEY = 'I_Love_Madeline';
const BASE_URL = 'https://ismadelinethecutest.gibbyb.com/api';
export default function HomeScreen() { export default function HomeScreen() {
const message = "This is the message"; const [message, setMessage] = useState('Loading message...');
useEffect(() => {
fetchMessage();
const intervalId = setInterval(fetchMessage, 10000); // Every 10 seconds
return () => clearInterval(intervalId);
}, []);
const fetchMessage = async () => {
try {
const storedUser = await AsyncStorage.getItem('@user');
if (!storedUser) {
setMessage('User not found. Please select a user.');
return;
}
const user = JSON.parse(storedUser);
//const otherUserId = user.id === 1 ? 2 : 1;
const response = await axios.get(`${BASE_URL}/getMessage`, {
params: { apiKey: API_KEY, userId: user.id }
});
if (response.data && response.data[0] && response.data[0].receivedMessage) {
setMessage(response.data[0].receivedMessage);
} else {
setMessage('No message found.');
}
} catch (error) {
console.error('API call error:', error);
setMessage('Failed to fetch message. Please try again.');
}
};
return ( return (
<ThemedView style={styles.container}> <ThemedView style={styles.container}>
<ThemedText style={styles.title}>{message}</ThemedText> <ThemedText style={styles.title}>{message}</ThemedText>
</ThemedView> </ThemedView>
); );
} }
const styles = StyleSheet.create({ const styles = StyleSheet.create({
@ -19,11 +57,11 @@ const styles = StyleSheet.create({
justifyContent: 'center', justifyContent: 'center',
}, },
title: { title: {
fontSize: 56, fontSize: 32,
lineHeight: 64, lineHeight: 40,
fontWeight: 'bold', fontWeight: 'bold',
marginBottom: 20, marginBottom: 20,
textAlign: 'center', textAlign: 'center',
paddingHorizontal: 20, paddingHorizontal: 20,
}, },
}); });

View File

@ -1,13 +1,73 @@
import { Image, StyleSheet, Platform } from 'react-native'; import React, { useState, useEffect } from 'react';
import { StyleSheet, TextInput, TouchableOpacity, Alert, Keyboard } from 'react-native';
import { ThemedText } from '@/components/ThemedText'; import { ThemedText } from '@/components/ThemedText';
import { ThemedView } from '@/components/ThemedView'; import { ThemedView } from '@/components/ThemedView';
import AsyncStorage from '@react-native-async-storage/async-storage';
import axios from 'axios';
const API_KEY = 'I_Love_Madeline';
const BASE_URL = 'https://ismadelinethecutest.gibbyb.com/api';
export default function SendMessageScreen() {
const [message, setMessage] = useState('');
const [userId, setUserId] = useState(null);
useEffect(() => {
getUserId();
}, []);
const getUserId = async () => {
try {
const storedUser = await AsyncStorage.getItem('@user');
if (storedUser) {
const user = JSON.parse(storedUser);
setUserId(user.id);
}
} catch (error) {
console.error('Failed to get user ID:', error);
}
};
const sendMessage = async () => {
if (!message.trim()) {
Alert.alert('Error', 'Please enter a message');
return;
}
if (!userId) {
Alert.alert('Error', 'User not found. Please select a user first.');
return;
}
try {
await axios.post(`${BASE_URL}/setMessage`, null, {
params: { apiKey: API_KEY, userId, message }
});
Alert.alert('Success', 'Message sent successfully');
setMessage('');
Keyboard.dismiss();
} catch (error) {
console.error('Failed to send message:', error);
Alert.alert('Error', 'Failed to send message. Please try again.');
}
};
export default function HomeScreen() {
return ( return (
<ThemedView style={styles.container}> <ThemedView style={styles.container}>
<ThemedText style={styles.title}>Send a Message</ThemedText>
<TextInput
style={styles.input}
value={message}
onChangeText={setMessage}
placeholder="Enter your message"
placeholderTextColor="#999"
multiline
/>
<TouchableOpacity style={styles.button} onPress={sendMessage}>
<ThemedText style={styles.buttonText}>Send Message</ThemedText>
</TouchableOpacity>
</ThemedView> </ThemedView>
); );
} }
const styles = StyleSheet.create({ const styles = StyleSheet.create({
@ -15,13 +75,33 @@ const styles = StyleSheet.create({
flex: 1, flex: 1,
alignItems: 'center', alignItems: 'center',
justifyContent: 'center', justifyContent: 'center',
padding: 20,
}, },
title: { title: {
fontSize: 56, fontSize: 24,
lineHeight: 64,
fontWeight: 'bold', fontWeight: 'bold',
marginBottom: 20, marginBottom: 20,
textAlign: 'center', textAlign: 'center',
paddingHorizontal: 20,
}, },
}); input: {
width: '100%',
height: 100,
borderColor: '#ccc',
borderWidth: 1,
borderRadius: 5,
padding: 10,
marginBottom: 20,
textAlignVertical: 'top',
color: '#FFF',
},
button: {
backgroundColor: '#007AFF',
padding: 15,
borderRadius: 5,
},
buttonText: {
color: 'white',
fontSize: 16,
fontWeight: 'bold',
},
});

View File

@ -16,8 +16,8 @@ interface UserSelectionProps {
} }
const API_KEY = 'I_Love_Madeline'; const API_KEY = 'I_Love_Madeline';
//const BASE_URL = 'https://ismadelinethecutest.gibbyb.com/api'; const BASE_URL = 'https://ismadelinethecutest.gibbyb.com/api';
const BASE_URL = 'http://192.168.0.39:3000/api'; //const BASE_URL = 'http://192.168.0.39:3000/api';
const UserSelection: React.FC<UserSelectionProps> = ({ onUserSelected }) => { const UserSelection: React.FC<UserSelectionProps> = ({ onUserSelected }) => {
const [users, setUsers] = useState<User[]>([]); const [users, setUsers] = useState<User[]>([]);