Improved revalidation and added drop down menus to onboarding

src/components/Api/Api.tsx

@@ -135,3 +135,66 @@ export function UserActivate(activation: ActivationParams) {
 }
 
 // App APIs
+
+export async function GetCourses() {
+  const accessToken = await getAccessToken();
+  return instance
+    .get("/api/v1/courses/", {
+      headers: {
+        Authorization: `Bearer ${accessToken}`,
+      },
+    })
+    .then((response) => {
+      // console.log(JSON.stringify(response.data));
+      return response.data;
+    })
+    .catch((error) => {
+      let error_message = "";
+      if (error.response) error_message = error.response.data;
+      else error_message = "Unable to reach servers";
+      console.log("Error getting courses", error_message);
+      return false;
+    });
+}
+
+export async function GetSemesters() {
+  const accessToken = await getAccessToken();
+  return instance
+    .get("/api/v1/semesters/", {
+      headers: {
+        Authorization: `Bearer ${accessToken}`,
+      },
+    })
+    .then((response) => {
+      // console.log(JSON.stringify(response.data));
+      return response.data;
+    })
+    .catch((error) => {
+      let error_message = "";
+      if (error.response) error_message = error.response.data;
+      else error_message = "Unable to reach servers";
+      console.log("Error getting semesters", error_message);
+      return false;
+    });
+}
+
+export async function GetYearLevels() {
+  const accessToken = await getAccessToken();
+  return instance
+    .get("/api/v1/year_levels/", {
+      headers: {
+        Authorization: `Bearer ${accessToken}`,
+      },
+    })
+    .then((response) => {
+      // console.log(JSON.stringify(response.data));
+      return response.data;
+    })
+    .catch((error) => {
+      let error_message = "";
+      if (error.response) error_message = error.response.data;
+      else error_message = "Unable to reach servers";
+      console.log("Error getting year levels", error_message);
+      return false;
+    });
+}

src/interfaces/Interfaces.tsx

@@ -46,3 +46,21 @@ export interface ActivationParams {
   uid: string;
   token: string;
 }
+
+export interface SemesterParams {
+  id: string;
+  name: string;
+  shortname: string;
+}
+
+export interface YearLevelParams {
+  id: string;
+  name: string;
+  shortname: string;
+}
+
+export interface CourseParams {
+  id: string;
+  name: string;
+  shortname: string;
+}

src/routes/Onboarding/Onboarding.tsx

@@ -2,42 +2,100 @@ import * as React from "react";
 import styles from "../../styles";
 import { View, Text } from "react-native";
 import { useNavigation } from "@react-navigation/native";
-import { RootDrawerParamList } from "../../interfaces/Interfaces";
+import {
+  CourseParams,
+  RootDrawerParamList,
+  SemesterParams,
+  YearLevelParams,
+} from "../../interfaces/Interfaces";
 import { colors } from "../../styles";
 import { AnimatePresence, MotiView } from "moti";
 import { useEffect, useState } from "react";
 import Button from "../../components/Button/Button";
 import DropDownPicker from "react-native-dropdown-picker";
 import isStringEmpty from "../../components/IsStringEmpty/IsStringEmpty";
-
+import { useQuery } from "@tanstack/react-query";
+import {
+  GetCourses,
+  GetSemesters,
+  GetYearLevels,
+} from "../../components/Api/Api";
 export default function Onboarding() {
   const navigation = useNavigation<RootDrawerParamList>();
   // const dispatch = useDispatch();
   // const creds = useSelector((state: RootState) => state.auth.creds);
-
+  const [error, setError] = useState(false);
   // Semesters
   const [semester, setSemester] = useState("");
   const [semesterOpen, setSemesterOpen] = useState(false);
   const [semesters, setSemesters] = useState([
-    { label: "1st Semester", value: "1st Sem" },
-    { label: "2nd Semester", value: "2nd Sem" },
+    { label: "1st Semester", value: "1st Sem", id: "" },
+    { label: "2nd Semester", value: "2nd Sem", id: "" },
   ]);
+  const semester_query = useQuery({
+    queryKey: ["semesters"],
+    queryFn: GetSemesters,
+    onSuccess: (data) => {
+      let semesters = data.map((item: SemesterParams) => ({
+        label: item.name,
+        value: item.shortname,
+        id: item.id,
+      }));
+      setSemesters(semesters);
+    },
+    onError: () => {
+      setError(true);
+    },
+  });
   // Year Level
   const [year_level, setYearLevel] = useState("");
   const [yearLevelOpen, setYearLevelOpen] = useState(false);
   const [year_levels, setYearLevels] = useState([
-    { label: "1st Year", value: "1st Year" },
-    { label: "2nd Year", value: "2nd Year" },
+    { label: "1st Year", value: "1st Year", id: "" },
+    { label: "2nd Year", value: "2nd Year", id: "" },
   ]);
+  const yearlevel_query = useQuery({
+    queryKey: ["year_levels"],
+    queryFn: GetYearLevels,
+    onSuccess: (data) => {
+      let year_levels = data.map((item: YearLevelParams) => ({
+        label: item.name,
+        value: item.shortname,
+        id: item.id,
+      }));
+      setYearLevels(year_levels);
+    },
+    onError: () => {
+      setError(true);
+    },
+  });
   // Course
   const [course, setCourse] = useState("");
   const [courseOpen, setCourseOpen] = useState(false);
   const [courses, setCourses] = useState([
-    { label: "Bachelor of Science in Information Technology", value: "BSIT" },
-    { label: "Bachelor of Science in Computer Science", value: "BSCS" },
+    {
+      label: "Bachelor of Science in Information Technology",
+      value: "BSIT",
+      id: "",
+    },
+    { label: "Bachelor of Science in Computer Science", value: "BSCS", id: "" },
   ]);
   const [complete, setComplete] = useState(false);
-
+  const course_query = useQuery({
+    queryKey: ["courses"],
+    queryFn: GetCourses,
+    onSuccess: (data) => {
+      let courses = data.map((item: CourseParams) => ({
+        label: item.name,
+        value: item.shortname,
+        id: item.id,
+      }));
+      setCourses(courses);
+    },
+    onError: () => {
+      setError(true);
+    },
+  });
   useEffect(() => {
     setComplete(
       !isStringEmpty(year_level) &&
@@ -45,7 +103,15 @@ export default function Onboarding() {
         !isStringEmpty(semester)
     );
   }, [year_level, course, semester, complete]);
-
+  if (error) {
+    return (
+      <View style={styles.background}>
+        <View style={styles.container}>
+          <Text style={styles.text_white_medium}>Error loading details</Text>
+        </View>
+      </View>
+    );
+  }
   return (
     <View style={styles.background}>
       <View style={styles.container}>

src/routes/Revalidation/Revalidation.tsx

@@ -20,7 +20,10 @@ export default function Revalidation() {
       if (response) {
         let user_info = await UserInfo();
         await dispatch(setUser(user_info));
-        if (!(user_info.year_level || user_info.course || user_info.semester)) {
+        if (
+          !(user_info.year_level || user_info.course || user_info.semester) &&
+          (await UserInfo())
+        ) {
           await setTimeout(() => {
             navigation.navigate("Onboarding");
           }, 700);