basic ui updated auth

- cannot swipe back anymore - required textfield for province and household no. - basic makeover for signup/longin - update user info page ui basic makeover
utmgdsc · Dec 16, 2023 · 3fab6e7 · 3fab6e7
1 parent f63d732
commit 3fab6e7
Show file tree

Hide file tree

Showing 11 changed files with 145 additions and 209 deletions.
diff --git a/backend/routes/users.py b/backend/routes/users.py
@@ -219,49 +219,4 @@ def update_user_name(user_id: str) -> Response:
         return jsonify({"user": item}), 200
     except CarbonTrackError as e:
         abort(code=400, description=f"{e}")
-
-
-@users.route("/user/update_province/<user_id>", methods=["PATCH"])
-def update_user_province(user_id: str) -> Response:
-    try:
-        print("Updating province...")
-        new_province = request.get_json().get("newProvince", "")
-        print("Updating province...")
-        query = {"uid": user_id}
-
-        updated_user = CarbonTrackDB.users_coll.find_one_and_update(
-            query,
-            {"$set": {"province": new_province}},
-            return_document=ReturnDocument.AFTER
-        )
-
-        updated_user = User.from_json(updated_user).to_json()
-
-        return jsonify({"user": updated_user}), 200
-    except CarbonTrackError as e:
-        abort(code=400, description=f"{e}")
-
-@users.route("/user/update_occupancy/<user_id>", methods=["PATCH"])
-def update_user_occupancy(user_id: str) -> Response:
-    try:
-        print("Updating occupancy...")
-        print(request.get_json())
-        new_occupancy = request.get_json().get("newOccupancy", 0)
-        query = {"uid": user_id}
-
-        current_user = carbon_auth.auth.current_user()
-        print(current_user)
-
-        print(f"Updating occupancy for user {user_id} to {new_occupancy}")
-
-        CarbonTrackDB.users_coll.update_one(query, {"$set": {"household": new_occupancy}})
-
-        item = CarbonTrackDB.users_coll.find_one(query)
-
-        item = User.from_json(item).to_json()
-
-        print(f"User updated: {item}")
-
-        return jsonify({"user": item}), 200
-    except CarbonTrackError as e:
-        abort(code=400, description=f"{e}")
+
diff --git a/frontend/src/components/appNavigation.tsx b/frontend/src/components/appNavigation.tsx
@@ -43,11 +43,11 @@ const AppNavigation = (): JSX.Element => {
   return (
     <NavigationContainer>
       <Stack.Navigator>
-        <Stack.Screen name="Home" component={HomeScreen} options={{ headerShown: false }} />
-        <Stack.Screen name="LogIn" component={LogInScreen} options={{ headerShown: false }} />
-        <Stack.Screen name="SignUp" component={SignUpScreen} options={{ headerShown: false }} />
+        <Stack.Screen name="Home" component={HomeScreen} options={{ headerShown: false, gestureEnabled: false }} />
+        <Stack.Screen name="LogIn" component={LogInScreen} options={{ headerShown: false, gestureEnabled: false }} />
+        <Stack.Screen name="SignUp" component={SignUpScreen} options={{ headerShown: false, gestureEnabled: false }}/>
         <Stack.Screen name="Settings" component={SettingsScreen} />
-        <Stack.Screen name="MainApp" component={MainAppTabs} options={{ headerShown: false }} />
+        <Stack.Screen name="MainApp" component={MainAppTabs} options={{ headerShown: false, gestureEnabled: false }} />
         <Stack.Screen name="Forum" component={Forum}  />
 
         <Stack.Screen name='FootprintDecomp'
@@ -118,7 +118,7 @@ const AppNavigation = (): JSX.Element => {
         <Stack.Screen
           name="Welcome"
           component={WelcomeScreen}
-          options={{ headerShown: false }}
+          options={{ headerShown: false, gestureEnabled: false }}
         />
       </Stack.Navigator>
     </NavigationContainer>
@@ -218,6 +218,7 @@ const DashboardStack = (): React.JSX.Element => (
         headerStyle: { backgroundColor: Colors.DARKGREEN },
         headerTintColor: '#fff',
         headerTitleStyle: { fontWeight: 'bold' },
+        gestureEnabled: false,
       }}
     />
   </Stack.Navigator>

diff --git a/frontend/src/components/dropDown.tsx b/frontend/src/components/dropDown.tsx
@@ -48,8 +48,8 @@ const CustomDropdown = ({ options, onSelect }: CustomDropdownProps): React.JSX.E
 
 const styles = StyleSheet.create({
   dropdownContainer: {
-    position: 'relative',
     zIndex: 1,
+    flex:1,
   },
   dropdownButton: {
     backgroundColor: Colors.DARKGREEN,
@@ -65,14 +65,17 @@ const styles = StyleSheet.create({
   },
   dropdownList: {
     position: 'absolute',
-    top: 51,
     left: 0,
-    maxHeight: 200,
+    maxHeight: 175,
     width: '100%',
     borderRadius: 10,
     borderWidth: 1,
     borderColor: Colors.DARKGREEN,
     backgroundColor: Colors.WHITE,
+    opacity:0.8,
+    top: '100%'
+
+
   },
   dropdownItem: {
     padding: 10,

diff --git a/frontend/src/components/forms/formTextField.tsx b/frontend/src/components/forms/formTextField.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { StyleSheet, Text, View, TextInput } from 'react-native';
+import { StyleSheet, Text, View, TextInput, type TextStyle } from 'react-native';
 import Colors from '../../../assets/colorConstants';
 
 interface IFormTextFieldProps {
@@ -23,6 +23,8 @@ interface IFormTextFieldProps {
 
   /* secureTextEntry value - should always be true for passwords */
   secureTextEntry: boolean;
+
+  styling: TextStyle;
 }
 
 /**
@@ -41,18 +43,20 @@ export default function FormTextField(props: IFormTextFieldProps): JSX.Element {
     touchedValue,
     errorValue,
     secureTextEntry,
+    styling,
   } = props;
 
   return (
     <View style={styles.fieldInputContainer}>
       <View style={styles.textbox}>
         <TextInput
-          style={styles.textInputBox}
+          style={[styles.textInputBox, styling]}
           placeholder={placeholder}
           onChangeText={handleChange}
           onBlur={handleBlur}
           value={value}
           secureTextEntry={secureTextEntry}
+          keyboardType='email-address'
         />
       </View>
 
@@ -69,14 +73,19 @@ const styles = StyleSheet.create({
     paddingVertical: 0,
   },
   textbox: {
-    borderBottomColor: Colors.GREY,
-    borderBottomWidth: 1,
+    borderBottomColor: Colors.DARKDARKGREEN,
+    backgroundColor:Colors.TRANSLIGHTGREEN,
+    borderBottomWidth: 2,
+    borderRadius: 5,
     flexDirection: 'row',
-    paddingBottom: 8,
     marginBottom: 10,
+    paddingVertical: 10,
+    paddingHorizontal: 10,
+    textAlignVertical: 'middle'
   },
   fieldInputContainer: {
-    marginBottom: 25,
+    marginBottom: 10,
+
   },
   fieldErrorMessage: {
     color: Colors.ERROR,

diff --git a/frontend/src/screens/dashboard.tsx b/frontend/src/screens/dashboard.tsx
@@ -84,9 +84,7 @@ export default function DashBoardScreen(): JSX.Element {
               <ChallengesWidget challenges={sampleChallenges}/>
           </View>
       </View>
-
-
-
+
     </ScrollView>
   );
 }

diff --git a/frontend/src/screens/login.tsx b/frontend/src/screens/login.tsx
@@ -64,7 +64,7 @@ export default function LogInScreen({ navigation }: LoginScreenProps): JSX.Eleme
         onSubmit={async (values) => await handleLogIn(values)}
       >
         {({ handleChange, handleBlur, handleSubmit, values, errors, touched }) => (
-          <View style={styles.headerContainer}>
+          <View style={[styles.headerContainer, styles.container]}>
             <View style={styles.headerBox}>
               <Text style={styles.header}>Log In</Text>
 
@@ -76,6 +76,7 @@ export default function LogInScreen({ navigation }: LoginScreenProps): JSX.Eleme
                 touchedValue={touched.email}
                 errorValue={errors.email}
                 secureTextEntry={false}
+                styling={styles.texts}
               />
 
               <FormTextField
@@ -86,6 +87,7 @@ export default function LogInScreen({ navigation }: LoginScreenProps): JSX.Eleme
                 touchedValue={touched.password}
                 errorValue={errors.password}
                 secureTextEntry={true}
+                styling={styles.texts}
               />
 
               <TouchableOpacity style={styles.buttoning} onPress={() => handleSubmit()}>
@@ -99,7 +101,7 @@ export default function LogInScreen({ navigation }: LoginScreenProps): JSX.Eleme
                     navigation.navigate('SignUp');
                   }}
                 >
-                  <Text style={styles.footerBold}> Sign Up</Text>
+                  <Text style={styles.footerBold}>Sign Up!</Text>
                 </TouchableOpacity>
               </View>
             </View>
@@ -123,18 +125,21 @@ const styles = StyleSheet.create({
     fontWeight: '700',
     textAlign: 'center',
   },
+  container:{
+    backgroundColor: Colors.LIGHTFGREEN
+  },
   footer: {
     color: Colors.DARKLIMEGREEN,
-    fontFamily: 'Montserrat',
     fontSize: 18,
     marginBottom: 30,
     textAlign: 'center',
+    fontWeight: '500'
   },
   footerBold: {
-    color: Colors.DARKGREEN,
-    fontFamily: 'Montserrat',
+    color: Colors.DARKLIMEGREEN,
+    textDecorationLine:'underline',
     fontSize: 18,
-    fontWeight: 'bold',
+    fontWeight: '500',
     marginBottom: 30,
     textAlign: 'center',
   },
@@ -144,8 +149,7 @@ const styles = StyleSheet.create({
   },
   header: {
     color: Colors.DARKGREEN,
-    fontFamily: 'Montserrat',
-    fontSize: 30,
+    fontSize: 36,
     fontWeight: '700',
     marginBottom: 30,
   },
@@ -156,4 +160,9 @@ const styles = StyleSheet.create({
     flex: 1,
     justifyContent: 'center',
   },
+  texts:{
+    fontSize: 14,
+    fontWeight: '600',
+    justifyContent: 'center',
+  },
 });
-Original file line number
+Diff line change
@@ Expand Up / @@ -84,9 +84,7 @@ export default function DashBoardScreen(): JSX.Element { @@
                   <ChallengesWidget challenges={sampleChallenges}/>
               </View>
           </View>
         </ScrollView>
       );
     }
@@ Expand Down @@