Unified styling for buttons

src/components/Button/DrawerButton.tsx

@@ -1,21 +1,16 @@
 import * as React from "react";
-import { Pressable, GestureResponderEvent } from "react-native";
+import { Pressable } from "react-native";
 import styles from "../../styles";
+import { colors } from "../../styles";
 
-export interface props {
+export default function DrawerButton({ color = colors.secondary_3, ...props }) {
-  children: React.ReactNode;
-  onPress: (event: GestureResponderEvent) => void;
-  color: string;
-}
-
-export default function DrawerButton(props: props) {
   return (
     <Pressable
       onPress={props.onPress}
       style={{
         ...styles.button_template,
         ...{
-          backgroundColor: props.color,
+          backgroundColor: color,
           width: "95%",
           justifyContent: "flex-start",
         },

src/components/DrawerSettings/CustomDrawerContent.tsx

@@ -36,7 +36,6 @@ export default function CustomDrawerContent(props: {}) {
         </View>
 
         <DrawerButton
-          color={colors.secondary_3}
           onPress={async () => {
             dispatch(logout());
             await AsyncStorage.clear();
@@ -61,7 +60,6 @@ export default function CustomDrawerContent(props: {}) {
           <Text style={styles.text_white_medium}>Stud-E</Text>
         </View>
         <DrawerButton
-          color={colors.secondary_2}
           onPress={() => {
             navigation.navigate("Home");
           }}
@@ -70,7 +68,6 @@ export default function CustomDrawerContent(props: {}) {
           <Text style={styles.text_white_medium}>Home</Text>
         </DrawerButton>
         <DrawerButton
-          color={colors.secondary_2}
           onPress={() => {
             navigation.navigate("User Info");
           }}
@@ -79,7 +76,6 @@ export default function CustomDrawerContent(props: {}) {
           <Text style={styles.text_white_medium}>User Info</Text>
         </DrawerButton>
         <DrawerButton
-          color={colors.secondary_2}
           onPress={() => {
             navigation.navigate("Subjects");
           }}
@@ -88,7 +84,6 @@ export default function CustomDrawerContent(props: {}) {
           <Text style={styles.text_white_medium}>Subjects</Text>
         </DrawerButton>
         <DrawerButton
-          color={colors.secondary_3}
           onPress={async () => {
             dispatch(logout());
             await AsyncStorage.clear();
@@ -113,7 +108,6 @@ export default function CustomDrawerContent(props: {}) {
           <Text style={styles.text_white_medium}>Stud-E</Text>
         </View>
         <DrawerButton
-          color={colors.secondary_2}
           onPress={() => {
             navigation.navigate("Login");
           }}
@@ -122,7 +116,6 @@ export default function CustomDrawerContent(props: {}) {
           <Text style={styles.text_white_medium}>Login</Text>
         </DrawerButton>
         <DrawerButton
-          color={colors.secondary_2}
           onPress={() => {
             navigation.navigate("Register");
           }}

src/routes/Home/Home.tsx

@@ -43,6 +43,9 @@ export default function Home() {
   useEffect(() => {
     requestLocation();
   }, [location]);
+  useEffect(() => {
+    requestLocation();
+  }, []);
 
   async function getDistance(location: LocationType) {
     let dist = GetDistance(

src/routes/Login/Login.tsx

@@ -99,14 +99,10 @@ export default function Login() {
               }
             });
           }}
-          color={colors.secondary_3}
         >
           <Text style={styles.text_white_small}>Login</Text>
         </Button>
-        <Button
+        <Button onPress={() => navigation.navigate("Register")}>
-          onPress={() => navigation.navigate("Register")}
-          color={colors.secondary_3}
-        >
           <Text style={styles.text_white_small}>Register</Text>
         </Button>
       </AnimatedContainer>

src/routes/Register/Register.tsx

@@ -158,7 +158,6 @@ export default function Register() {
             {
             }
           }}
-          color={colors.secondary_3}
         >
           <Text style={styles.text_white_small}>Register</Text>
         </Button>

src/routes/SubjectsPage/SubjectsPage.tsx

@@ -201,7 +201,6 @@ export default function SubjectsPage() {
         </View>
         <View style={{ zIndex: -1 }}>
           <Button
-            color={colors.secondary_3}
             onPress={() => {
               if (subjectsOpen) {
                 setSelectedSubjects([]);

src/routes/UserInfoPage/UserInfoPage.tsx

@@ -311,7 +311,6 @@ export default function UserInfoPage() {
         <View style={styles.padding} />
         <View style={{ zIndex: -1 }}>
           <Button
-            color={colors.secondary_3}
             onPress={() => {
               if (isEditable) {
                 setYearLevelOpen(false);