MVP is done. App is functional

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 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
 const fetchCountdownDate = async () => {
   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);
     if (response.data && response.data[0] && response.data[0].countdown) {
       console.log('Countdown date:', response.data[0].countdown);

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 (
     <ThemedView style={styles.container}>
       <ThemedText style={styles.title}>{message}</ThemedText>
     </ThemedView>
-      );
+  );
 }
 
 const styles = StyleSheet.create({
@@ -19,11 +57,11 @@ const styles = StyleSheet.create({
     justifyContent: 'center',
   },
   title: {
-    fontSize: 56,
+    fontSize: 32,
-    lineHeight: 64,
+    lineHeight: 40,
     fontWeight: 'bold',
     marginBottom: 20,
     textAlign: 'center',
     paddingHorizontal: 20,
   },
-  });
+});

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 (
     <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>
-      );
+  );
 }
 
 const styles = StyleSheet.create({
@@ -15,13 +75,33 @@ const styles = StyleSheet.create({
     flex: 1,
     alignItems: 'center',
     justifyContent: 'center',
+    padding: 20,
   },
   title: {
-    fontSize: 56,
+    fontSize: 24,
-    lineHeight: 64,
     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',
+  },
+});

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 = '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 [users, setUsers] = useState<User[]>([]);