From 274c3a51512beda6a9a8d1e09b88f0d856767f6a Mon Sep 17 00:00:00 2001 From: gibbyb Date: Tue, 10 Sep 2024 11:03:30 -0500 Subject: [PATCH] MVP is done. App is functional --- app/(tabs)/countdown.tsx | 14 +++--- app/(tabs)/index.tsx | 52 ++++++++++++++++--- app/(tabs)/sendmessage.tsx | 96 +++++++++++++++++++++++++++++++++--- components/UserSelection.tsx | 4 +- 4 files changed, 142 insertions(+), 24 deletions(-) diff --git a/app/(tabs)/countdown.tsx b/app/(tabs)/countdown.tsx index b957208..55a5e1a 100644 --- a/app/(tabs)/countdown.tsx +++ b/app/(tabs)/countdown.tsx @@ -4,17 +4,17 @@ import { ThemedText } from '@/components/ThemedText'; import { ThemedView } from '@/components/ThemedView'; import axios from 'axios'; -//const API_KEY = 'I_Love_Madeline'; -const BASE_URL = 'http://192.168.0.39:3000/api'; -//const BASE_URL = 'https://ismadelinethecutest.gibbyb.com/api'; +const API_KEY = 'I_Love_Madeline'; +//const BASE_URL = 'http://192.168.0.39:3000/api'; +const BASE_URL = 'https://ismadelinethecutest.gibbyb.com/api'; // Separate API call function const fetchCountdownDate = async () => { try { - //const response = await axios.get(`${BASE_URL}/getCountdown`, { - //params: { apiKey: API_KEY } - //}); - const response = await axios.get(`${BASE_URL}/getCountdown?apiKey=I_Love_Madeline`); + const response = await axios.get(`${BASE_URL}/getCountdown`, { + params: { apiKey: API_KEY } + }); + //const response = await axios.get(`${BASE_URL}/getCountdown?apiKey=I_Love_Madeline`); console.log('API response:', response.data); if (response.data && response.data[0] && response.data[0].countdown) { console.log('Countdown date:', response.data[0].countdown); diff --git a/app/(tabs)/index.tsx b/app/(tabs)/index.tsx index e56c0d1..548477b 100644 --- a/app/(tabs)/index.tsx +++ b/app/(tabs)/index.tsx @@ -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 { 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() { - 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 ( {message} - ); + ); } const styles = StyleSheet.create({ @@ -19,11 +57,11 @@ const styles = StyleSheet.create({ justifyContent: 'center', }, title: { - fontSize: 56, - lineHeight: 64, + fontSize: 32, + lineHeight: 40, fontWeight: 'bold', marginBottom: 20, textAlign: 'center', paddingHorizontal: 20, }, - }); +}); diff --git a/app/(tabs)/sendmessage.tsx b/app/(tabs)/sendmessage.tsx index 671c71e..1edecf7 100644 --- a/app/(tabs)/sendmessage.tsx +++ b/app/(tabs)/sendmessage.tsx @@ -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 { 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 ( + Send a Message + + + Send Message + - ); + ); } const styles = StyleSheet.create({ @@ -15,13 +75,33 @@ const styles = StyleSheet.create({ flex: 1, alignItems: 'center', justifyContent: 'center', + padding: 20, }, title: { - fontSize: 56, - lineHeight: 64, + fontSize: 24, fontWeight: 'bold', marginBottom: 20, 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', + }, +}); diff --git a/components/UserSelection.tsx b/components/UserSelection.tsx index a3632d6..e5fd9a1 100644 --- a/components/UserSelection.tsx +++ b/components/UserSelection.tsx @@ -16,8 +16,8 @@ interface UserSelectionProps { } 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 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([]);