Fixed modal styling

2/4 Bug Blitz Issues #37
avichaljadeja2002 · Feb 6, 2025 · 705dae7 · 705dae7
1 parent f79213e
commit 705dae7
Show file tree

Hide file tree

Showing 5 changed files with 40 additions and 111 deletions.
diff --git a/app/alert.tsx b/app/alert.tsx
@@ -12,7 +12,7 @@ interface AlertProps {
     closeButtonText?: string;
 }
 
-const Alert: React.FC<AlertProps> = ({ isVisible, toggleModal, header, description, onSave, saveButtonText, closeButtonText="Cancel"}) => {
+const Alert: React.FC<AlertProps> = ({ isVisible, toggleModal, header, description, onSave, saveButtonText, closeButtonText = "Cancel" }) => {
     const handleSave = () => {
         onSave();
         toggleModal();
@@ -29,33 +29,34 @@ const Alert: React.FC<AlertProps> = ({ isVisible, toggleModal, header, descripti
                 <View style={styles.modalView}>
                     <Text style={styles.modalHeader}>{header}</Text>
                     <Text style={styles.modalMessage}>{description}</Text>
-                    <TouchableOpacity
-                        style={[styles.button, styles.buttonClose]}
-                        onPress={toggleModal}
-                    >
-                        <Text style={styles.textStyle}>{closeButtonText}</Text>
-                    </TouchableOpacity>
-                    {saveButtonText && (
+                    <View style={styles.modalButtons}>
                         <TouchableOpacity
-                            style={[styles.button, styles.saveButton]}
-                            onPress={handleSave}
+                            style={[styles.button, styles.buttonClose]}
+                            onPress={toggleModal}
                         >
-                            <Text style={styles.textStyle}>{saveButtonText}</Text>
+                            <Text style={styles.textStyle}>{closeButtonText}</Text>
                         </TouchableOpacity>
-                    )}
+                        {saveButtonText && (
+                            <TouchableOpacity
+                                style={[styles.button, styles.saveButton]}
+                                onPress={handleSave}
+                            >
+                                <Text style={styles.textStyle}>{saveButtonText}</Text>
+                            </TouchableOpacity>
+                        )}
+                    </View>
                 </View>
             </View>
         </Modal>
     );
 };
 
-
 const styles = StyleSheet.create({
     centeredView: {
         flex: 1,
         justifyContent: "center",
         alignItems: "center",
-        backgroundColor: 'rgba(0, 0, 0, 0.5)'
+        backgroundColor: 'rgba(0, 0, 0, 0.5)',
     },
     modalView: {
         margin: 20,
@@ -64,115 +65,45 @@ const styles = StyleSheet.create({
         padding: 35,
         alignItems: "center",
         shadowColor: "#000",
-        shadowOffset: {
-            width: 0,
-            height: 2
-        },
+        shadowOffset: { width: 0, height: 2 },
         shadowOpacity: 0.25,
         shadowRadius: 4,
         elevation: 5
     },
-    modalText: {
-        marginBottom: 15,
-        textAlign: "center"
+    modalHeader: {
+        fontSize: 18,
+        fontWeight: 'bold',
+        marginBottom: 10,
+        textAlign: 'center',
+    },
+    modalMessage: {
+        fontSize: 14,
+        textAlign: 'center',
+        marginBottom: 20,
     },
     modalButtons: {
         flexDirection: 'row',
-        justifyContent: 'space-between',
-        width: '100%'
+        justifyContent: 'center',  // Center buttons horizontally
+        alignItems: 'center',  // Center buttons vertically if needed
     },
     button: {
-        borderRadius: 20,
-        padding: 10,
+        borderRadius: 10,
+        paddingVertical: 10,
+        paddingHorizontal: 40,
+        marginHorizontal: 5,
         elevation: 2,
-        minWidth: 100,
     },
     textStyle: {
         color: "white",
         fontWeight: "bold",
-        textAlign: "center"
-    },
-    container: {
-        flex: 1,
-        justifyContent: 'center',
-        flexDirection: 'column',
-        paddingHorizontal: 20,
-        backgroundColor: '#fff',
-    },
-    accountSetting: {
-        width: '100%',
-        flexDirection: 'row',
-        justifyContent: 'space-between',
-        alignItems: 'center',
-    },
-    header: {
-        flexDirection: 'column',
-        gap: 20,
-        marginBottom: 20,
-        width: '100%',
-        alignItems: 'center',
-    },
-    label: {
-        fontSize: 14,
-        color: '#333',
-        textAlign: 'left',
-
+        textAlign: "center",
     },
-    textInput: {
-        height: 45,
-        borderColor: '#ccc',
-        width: '70%',
-        borderWidth: 1,
-        borderRadius: 8,
-        padding: 10,
-    },
-    footer: {
-        alignItems: 'center',
-        marginTop: 20,
+    buttonClose: {
+        backgroundColor: "#2196F3", 
     },
     saveButton: {
         backgroundColor: '#65558f',
-        borderRadius: 8,
-        paddingVertical: 12,
-        paddingHorizontal: 40,
-        alignItems: 'center',
-    },
-    saveButtonText: {
-        color: '#fff',
-        fontSize: 16,
-        fontWeight: '600',
-    },
-    logoutButton: {
-        backgroundColor: '#ff6347',
-        borderRadius: 8,
-        paddingVertical: 12,
-        paddingHorizontal: 40,
-        marginTop: 10,
-        alignItems: 'center',
     },
-    logoutButtonText: {
-        color: '#fff',
-        fontSize: 16,
-        fontWeight: '600',
-    },
-    modalHeader: {
-        fontSize: 18,
-        fontWeight: 'bold',
-        marginBottom: 10,
-        textAlign: 'center',
-    },
-    modalMessage: {
-        fontSize: 14,
-        textAlign: 'center',
-        marginBottom: 20,
-    },
-    buttonClose: {
-        backgroundColor: "#2196F3",
-        paddingVertical: 10,
-        paddingHorizontal: 20,
-        borderRadius: 10,
-    },
-
 });
 
-export default Alert;
+export default Alert;
diff --git a/app/index.tsx b/app/index.tsx
@@ -54,6 +54,8 @@ export default function AuthScreen() {
             console.error("Google login failed:", response);
             showAlert("Google Login Failed", "Please try again.", "Cancel", "");
         }
+
+        verifyLoginStatus();
     }, [response]);
 
 
@@ -154,10 +156,6 @@ export default function AuthScreen() {
         }
     };
 
-    useEffect(() => {
-        verifyLoginStatus();
-    }, []);
-
     return (
         <View style={styles.authPage}>
 

diff --git a/backend/.idea/dataSources.local.xml b/backend/.idea/dataSources.local.xml
diff --git a/backend/omniplanner/omniplanner.db b/backend/omniplanner/omniplanner.db
diff --git a/constants/constants.tsx b/constants/constants.tsx
@@ -1,7 +1,7 @@
 import { Field } from "@/components/Types";
 
 // export const IPAddr = "http://34.204.83.156:8080" // For AWS
-export const IPAddr = "http://137.112.196.212:8080" // For local testing on laptop
+export const IPAddr = "http://137.112.155.151:8080" // For local testing on laptop
 
 export const repeatingData = [
   { label: 'Daily', value: 1 },