From 7cd549cad7cbfeb18458cec445083e4cc57fe667 Mon Sep 17 00:00:00 2001
From: Keannu Bernasol <noehbernasol0@gmail.com>
Date: Thu, 23 Nov 2023 23:27:38 +0800
Subject: [PATCH] Refetch user location when refreshing and added code snippet
 to stop user from studying if they stray too far from where they set their
 studying locatio. Also allow modal to be shown even when not currently
 studying

---
 src/routes/Home/Home.tsx | 132 ++++++++++++++++++++++++++++++++++++---
 1 file changed, 125 insertions(+), 7 deletions(-)

diff --git a/src/routes/Home/Home.tsx b/src/routes/Home/Home.tsx
index 3769c06..aa29b01 100644
--- a/src/routes/Home/Home.tsx
+++ b/src/routes/Home/Home.tsx
@@ -48,7 +48,7 @@ import AsyncStorage from "@react-native-async-storage/async-storage";
 
 export default function Home() {
   // Switch this condition to see the main map when debugging
-  const map_distance_override = false;
+  const map_distance_override = true;
   const navigation = useNavigation<RootDrawerParamList>();
   const [location, setLocation] = useState<RawLocationType | null>(null);
   const [locationPermitted, setLocationPermitted] = useState(false);
@@ -117,7 +117,7 @@ export default function Home() {
   async function DistanceHandler(location: RawLocationType) {
     let dist = GetDistanceFromUSTP(location.coords);
     setDist(dist);
-    // Deactivate student status if too far away and still studying
+    // Deactivate student status if too far away from USTP and still studying
     if (dist >= 2 && !map_distance_override && studying && !stopping_toofar) {
       stop_studying.mutate({
         active: false,
@@ -152,6 +152,28 @@ export default function Home() {
       setSubject(data[1].subject);
       setStudying(data[1].active);
       setStudentStatus(data[1]);
+      // Deactivate student status if too far away from current location you are studying in
+      if(student_status && location){
+        const dist = GetDistance(
+          student_status.location.latitude,
+          student_status.location.longitude,
+          location.coords.latitude,
+          location.coords.longitude
+        );
+        console.log('Distance:',dist)
+        console.log(student_status.location.latitude,
+          student_status.location.longitude,
+          location.coords.latitude,
+          location.coords.longitude)
+        if (dist > 0.02 && studying && !stopping_toofar) {
+          console.log('Too far from current studying location')
+          stop_studying.mutate({
+            active: false,
+          });
+          setStopping(true);
+        }
+      }
+
     },
     onError: (error: Error) => {
       toast.show(String(error), {
@@ -197,9 +219,7 @@ export default function Home() {
       }, 500);
       setStudyGroups([]);
       setStudying(false);
-      if (stopping_toofar) {
         setStopping(false);
-      }
     },
     onError: (error: Error) => {
       toast.show(String(error), {
@@ -893,6 +913,7 @@ export default function Home() {
                       duration: 2000,
                       animationType: "slide-in",
                     });
+                    requestLocation()
                   }}
                 >
                   <RefreshIcon size={32} />
@@ -908,7 +929,7 @@ export default function Home() {
                   setModalOpen(true);
                 }}
               >
-                {studying ? <CaretUpIcon size={32} /> : <></>}
+                <CaretUpIcon size={32} />
               </Pressable>
             </View>
             {student_status?.active && !student_status?.study_group ? (
@@ -967,14 +988,16 @@ export default function Home() {
           >
             <DropdownIcon size={32} />
           </Pressable>
-          <View style={styles.flex_row}>
+          <View style={styles.flex_column}>
+
+            <Text style={styles.text_white_medium}>List View</Text>
             <Switch
               value={modalByGroup}
               onChange={() => {
                 setModalByGroup(!modalByGroup);
               }}
+              style={{alignSelf:'center'}}
             />
-            <Text style={styles.text_white_medium}>List View</Text>
           </View>
 
           <ScrollView>
@@ -1096,7 +1119,102 @@ export default function Home() {
           </ScrollView>
         </AnimatedContainer>
       </Modal>
+      <Modal
+        coverScreen={false}
+        isVisible={modalOpen && !studying}
+        style={{ opacity: 0.85 }}
+        hasBackdrop={false}
+      >
+        <AnimatedContainer>
+          <Pressable
+            style={{
+              alignContent: "flex-start",
+              backgroundColor: colors.secondary_3,
+              borderRadius: 16,
+            }}
+            onPress={() => setModalOpen(false)}
+          >
+            <DropdownIcon size={32} />
+          </Pressable>
+          <View style={styles.flex_column}>
 
+            <Text style={styles.text_white_medium}>List View</Text>
+            <Switch
+              value={modalByGroup}
+              onChange={() => {
+                setModalByGroup(!modalByGroup);
+              }}
+              style={{alignSelf:'center'}}
+            />
+          </View>
+
+          <ScrollView>
+            {!modalByGroup ? (
+              student_statuses_global.map(
+                (student_status: StudentStatusFilterType, index: number) => {
+                  return (
+                    <View
+                      key={index}
+                      style={{
+                        alignContent: "center",
+                        alignSelf: "center",
+                        justifyContent: "center",
+                        backgroundColor: colors.secondary_3,
+                        borderColor: colors.primary_2,
+                        borderWidth: 1,
+                        borderRadius: 16,
+                        width: 256,
+                        marginVertical: 4,
+                      }}
+                    >
+                      <Text style={styles.text_white_tiny_bold}>
+                        Student: {student_status.user}
+                      </Text>
+                      <Text style={styles.text_white_tiny_bold}>
+                        {`Studying ${student_status.subject}`}
+                      </Text>
+                    </View>
+                  );
+                }
+              )
+            ) : (
+              <></>
+            )}
+            {modalByGroup ? (
+              study_groups_global.map((studygroup: StudyGroupType, index: number) => {
+                return (
+                  <View
+                    key={index}
+                    style={{
+                      alignContent: "center",
+                      alignSelf: "center",
+                      justifyContent: "center",
+                      backgroundColor: colors.secondary_3,
+                      borderColor: colors.primary_2,
+                      borderWidth: 1,
+                      borderRadius: 16,
+                      width: 256,
+                      marginVertical: 4,
+                    }}
+                  >
+                    <Text style={styles.text_white_tiny_bold}>
+                      Group Name: {studygroup.name}
+                    </Text>
+                    <Text style={styles.text_white_tiny_bold}>
+                      {`Studying ${studygroup.subject}`}
+                    </Text>
+                    <Text style={styles.text_white_tiny_bold}>
+                      Students Studying: {studygroup.students.length}
+                    </Text>
+                  </View>
+                );
+              })
+            ) : (
+              <></>
+            )}
+          </ScrollView>
+        </AnimatedContainer>
+      </Modal>
       <AnimatedContainer>
         <View style={{ borderRadius: 16, overflow: "hidden" }}>
           <CustomMap />