Set student status to inactive if logging out and clear query cache

App.tsx

@@ -75,9 +75,9 @@ export default function App() {
               drawerContent={CustomDrawerContent}
               screenOptions={DrawerScreenSettings}
             >
-              <Drawer.Screen name="Home" component={Home} />
               <Drawer.Screen name="Login" component={Login} />
               <Drawer.Screen name="Register" component={Register} />
+              <Drawer.Screen name="Home" component={Home} />
               <Drawer.Screen name="Onboarding" component={Onboarding} />
               <Drawer.Screen name="Revalidation" component={Revalidation} />
               <Drawer.Screen name="Activation" component={Activation} />

src/components/Api/Api.tsx

@@ -254,6 +254,7 @@ export async function PatchStudentStatus(info: StudentStatusPatchType) {
     })
     .catch((error) => {
       let error_message = ParseError(error);
+      console.log("DEBUG", error.response.data);
       return [false, error_message];
     });
 }

src/components/DrawerSettings/CustomDrawerContent.tsx

@@ -5,7 +5,10 @@ import { Text, View } from "react-native";
 import { colors } from "../../styles";
 import styles from "../../styles";
 
-import { RootDrawerParamList } from "../../interfaces/Interfaces";
+import {
+  RootDrawerParamList,
+  StudentStatusPatchType,
+} from "../../interfaces/Interfaces";
 import AppIcon from "../../icons/AppIcon/AppIcon";
 import HomeIcon from "../../icons/HomeIcon/HomeIcon";
 import LoginIcon from "../../icons/LoginIcon/LoginIcon";
@@ -18,13 +21,48 @@ import { logout } from "../../features/redux/slices/StatusSlice/StatusSlice";
 import AsyncStorage from "@react-native-async-storage/async-storage";
 import UserIcon from "../../icons/UserIcon/UserIcon";
 import SubjectIcon from "../../icons/SubjectIcon/SubjectIcon";
-import { useQueryClient } from "@tanstack/react-query";
+import { useMutation, useQueryClient } from "@tanstack/react-query";
+import toast from "react-native-toast-notifications/lib/typescript/toast";
+import { PatchStudentStatus } from "../Api/Api";
+import { useToast } from "react-native-toast-notifications";
 
 export default function CustomDrawerContent(props: {}) {
   const navigation = useNavigation<RootDrawerParamList>();
   const status = useSelector((state: RootState) => state.status);
   const dispatch = useDispatch();
   const queryClient = useQueryClient();
+  const debug = false;
+  const toast = useToast();
+  const stop_studying_logout = useMutation({
+    mutationFn: async (info: StudentStatusPatchType) => {
+      const data = await PatchStudentStatus(info);
+      if (data[0] != true) {
+        return Promise.reject(new Error());
+      }
+      console.log("DEBUG", data);
+      return data;
+    },
+    onSuccess: async () => {
+      toast.show("Logged out. Stopped studying", {
+        type: "warning",
+        placement: "top",
+        duration: 2000,
+        animationType: "slide-in",
+      });
+      queryClient.clear();
+      dispatch(logout());
+      await AsyncStorage.clear();
+      navigation.navigate("Login");
+    },
+    onError: (error: Error) => {
+      toast.show(String(error), {
+        type: "warning",
+        placement: "top",
+        duration: 2000,
+        animationType: "slide-in",
+      });
+    },
+  });
   if (status.logged_in && status.onboarding) {
     return (
       <DrawerContentScrollView {...props}>
@@ -39,11 +77,10 @@ export default function CustomDrawerContent(props: {}) {
         </View>
 
         <DrawerButton
-          onPress={async () => {
-            dispatch(logout());
-            await AsyncStorage.clear();
-            queryClient.clear();
-            navigation.navigate("Login");
+          onPress={() => {
+            stop_studying_logout.mutate({
+              active: false,
+            });
           }}
         >
           <LogoutIcon size={32} />
@@ -88,10 +125,10 @@ export default function CustomDrawerContent(props: {}) {
           <Text style={styles.text_white_medium}>Subjects</Text>
         </DrawerButton>
         <DrawerButton
-          onPress={async () => {
-            dispatch(logout());
-            await AsyncStorage.clear();
-            navigation.navigate("Login");
+          onPress={() => {
+            stop_studying_logout.mutate({
+              active: false,
+            });
           }}
         >
           <LogoutIcon size={32} />

src/interfaces/Interfaces.tsx

@@ -13,6 +13,7 @@ export interface ResponsiveIconProps {
 
 export interface RootDrawerParamList {
   navigate: any;
+  replace: any;
 }
 
 // Redux Interfaces