mirror of
https://github.com/lemeow125/StudE-Frontend.git
synced 2024-11-17 06:19:25 +08:00
Finished onboarding page
This commit is contained in:
parent
bccc808150
commit
3931f58472
4 changed files with 54 additions and 38 deletions
|
@ -3,6 +3,7 @@ import AsyncStorage from "@react-native-async-storage/async-storage";
|
||||||
import {
|
import {
|
||||||
ActivationParams,
|
ActivationParams,
|
||||||
LoginParams,
|
LoginParams,
|
||||||
|
OnboardingParams,
|
||||||
RegistrationParams,
|
RegistrationParams,
|
||||||
} from "../../interfaces/Interfaces";
|
} from "../../interfaces/Interfaces";
|
||||||
|
|
||||||
|
@ -113,7 +114,7 @@ export async function UserInfo() {
|
||||||
})
|
})
|
||||||
.then((response) => {
|
.then((response) => {
|
||||||
// console.log(JSON.stringify(response.data));
|
// console.log(JSON.stringify(response.data));
|
||||||
return response.data;
|
return [true, response.data];
|
||||||
})
|
})
|
||||||
.catch((error) => {
|
.catch((error) => {
|
||||||
let error_message = "";
|
let error_message = "";
|
||||||
|
@ -198,3 +199,23 @@ export async function GetYearLevels() {
|
||||||
return false;
|
return false;
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export async function OnboardingUpdateStudentInfo(info: OnboardingParams) {
|
||||||
|
const accessToken = await getAccessToken();
|
||||||
|
const headers = {
|
||||||
|
Authorization: `Bearer ${accessToken}`,
|
||||||
|
};
|
||||||
|
return instance
|
||||||
|
.patch("/api/v1/accounts/users/me/", info, { headers })
|
||||||
|
.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 updating onboarding info", error_message);
|
||||||
|
return false;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
|
@ -64,3 +64,9 @@ export interface CourseParams {
|
||||||
name: string;
|
name: string;
|
||||||
shortname: string;
|
shortname: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export interface OnboardingParams {
|
||||||
|
year_level: string;
|
||||||
|
course: string;
|
||||||
|
semester: string;
|
||||||
|
}
|
||||||
|
|
|
@ -19,18 +19,18 @@ import {
|
||||||
GetCourses,
|
GetCourses,
|
||||||
GetSemesters,
|
GetSemesters,
|
||||||
GetYearLevels,
|
GetYearLevels,
|
||||||
|
OnboardingUpdateStudentInfo,
|
||||||
} from "../../components/Api/Api";
|
} from "../../components/Api/Api";
|
||||||
export default function Onboarding() {
|
export default function Onboarding() {
|
||||||
const navigation = useNavigation<RootDrawerParamList>();
|
const navigation = useNavigation<RootDrawerParamList>();
|
||||||
// const dispatch = useDispatch();
|
// const dispatch = useDispatch();
|
||||||
// const creds = useSelector((state: RootState) => state.auth.creds);
|
// const creds = useSelector((state: RootState) => state.auth.creds);
|
||||||
const [error, setError] = useState(false);
|
|
||||||
// Semesters
|
// Semesters
|
||||||
const [semester, setSemester] = useState("");
|
const [semester, setSemester] = useState("");
|
||||||
const [semesterOpen, setSemesterOpen] = useState(false);
|
const [semesterOpen, setSemesterOpen] = useState(false);
|
||||||
const [semesters, setSemesters] = useState([
|
const [semesters, setSemesters] = useState([
|
||||||
{ label: "1st Semester", value: "1st Sem", id: "" },
|
{ label: "1st Semester", value: "1st Sem" },
|
||||||
{ label: "2nd Semester", value: "2nd Sem", id: "" },
|
{ label: "2nd Semester", value: "2nd Sem" },
|
||||||
]);
|
]);
|
||||||
const semester_query = useQuery({
|
const semester_query = useQuery({
|
||||||
queryKey: ["semesters"],
|
queryKey: ["semesters"],
|
||||||
|
@ -38,21 +38,17 @@ export default function Onboarding() {
|
||||||
onSuccess: (data) => {
|
onSuccess: (data) => {
|
||||||
let semesters = data.map((item: SemesterParams) => ({
|
let semesters = data.map((item: SemesterParams) => ({
|
||||||
label: item.name,
|
label: item.name,
|
||||||
value: item.shortname,
|
value: item.name,
|
||||||
id: item.id,
|
|
||||||
}));
|
}));
|
||||||
setSemesters(semesters);
|
setSemesters(semesters);
|
||||||
},
|
},
|
||||||
onError: () => {
|
|
||||||
setError(true);
|
|
||||||
},
|
|
||||||
});
|
});
|
||||||
// Year Level
|
// Year Level
|
||||||
const [year_level, setYearLevel] = useState("");
|
const [year_level, setYearLevel] = useState("");
|
||||||
const [yearLevelOpen, setYearLevelOpen] = useState(false);
|
const [yearLevelOpen, setYearLevelOpen] = useState(false);
|
||||||
const [year_levels, setYearLevels] = useState([
|
const [year_levels, setYearLevels] = useState([
|
||||||
{ label: "1st Year", value: "1st Year", id: "" },
|
{ label: "1st Year", value: "1st Year" },
|
||||||
{ label: "2nd Year", value: "2nd Year", id: "" },
|
{ label: "2nd Year", value: "2nd Year" },
|
||||||
]);
|
]);
|
||||||
const yearlevel_query = useQuery({
|
const yearlevel_query = useQuery({
|
||||||
queryKey: ["year_levels"],
|
queryKey: ["year_levels"],
|
||||||
|
@ -60,14 +56,10 @@ export default function Onboarding() {
|
||||||
onSuccess: (data) => {
|
onSuccess: (data) => {
|
||||||
let year_levels = data.map((item: YearLevelParams) => ({
|
let year_levels = data.map((item: YearLevelParams) => ({
|
||||||
label: item.name,
|
label: item.name,
|
||||||
value: item.shortname,
|
value: item.name,
|
||||||
id: item.id,
|
|
||||||
}));
|
}));
|
||||||
setYearLevels(year_levels);
|
setYearLevels(year_levels);
|
||||||
},
|
},
|
||||||
onError: () => {
|
|
||||||
setError(true);
|
|
||||||
},
|
|
||||||
});
|
});
|
||||||
// Course
|
// Course
|
||||||
const [course, setCourse] = useState("");
|
const [course, setCourse] = useState("");
|
||||||
|
@ -76,34 +68,21 @@ export default function Onboarding() {
|
||||||
{
|
{
|
||||||
label: "Bachelor of Science in Information Technology",
|
label: "Bachelor of Science in Information Technology",
|
||||||
value: "BSIT",
|
value: "BSIT",
|
||||||
id: "",
|
|
||||||
},
|
},
|
||||||
{ label: "Bachelor of Science in Computer Science", value: "BSCS", id: "" },
|
{ label: "Bachelor of Science in Computer Science", value: "BSCS" },
|
||||||
]);
|
]);
|
||||||
const [complete, setComplete] = useState(false);
|
|
||||||
const course_query = useQuery({
|
const course_query = useQuery({
|
||||||
queryKey: ["courses"],
|
queryKey: ["courses"],
|
||||||
queryFn: GetCourses,
|
queryFn: GetCourses,
|
||||||
onSuccess: (data) => {
|
onSuccess: (data) => {
|
||||||
let courses = data.map((item: CourseParams) => ({
|
let courses = data.map((item: CourseParams) => ({
|
||||||
label: item.name,
|
label: item.name,
|
||||||
value: item.shortname,
|
value: item.name,
|
||||||
id: item.id,
|
|
||||||
}));
|
}));
|
||||||
setCourses(courses);
|
setCourses(courses);
|
||||||
},
|
},
|
||||||
onError: () => {
|
|
||||||
setError(true);
|
|
||||||
},
|
|
||||||
});
|
});
|
||||||
useEffect(() => {
|
if (yearlevel_query.error || semester_query.error || course_query.error) {
|
||||||
setComplete(
|
|
||||||
!isStringEmpty(year_level) &&
|
|
||||||
!isStringEmpty(course) &&
|
|
||||||
!isStringEmpty(semester)
|
|
||||||
);
|
|
||||||
}, [year_level, course, semester, complete]);
|
|
||||||
if (error) {
|
|
||||||
return (
|
return (
|
||||||
<View style={styles.background}>
|
<View style={styles.background}>
|
||||||
<View style={styles.container}>
|
<View style={styles.container}>
|
||||||
|
@ -213,8 +192,15 @@ export default function Onboarding() {
|
||||||
style={styles.button_template}
|
style={styles.button_template}
|
||||||
>
|
>
|
||||||
<Button
|
<Button
|
||||||
disabled={!complete}
|
disabled={!year_level || !course || !semester}
|
||||||
onPress={() => console.log(complete)}
|
onPress={async () => {
|
||||||
|
console.log(semester, course, year_level);
|
||||||
|
await OnboardingUpdateStudentInfo({
|
||||||
|
semester: semester,
|
||||||
|
course: course,
|
||||||
|
year_level: year_level,
|
||||||
|
});
|
||||||
|
}}
|
||||||
color={colors.blue_3}
|
color={colors.blue_3}
|
||||||
>
|
>
|
||||||
<Text style={styles.text_white_small}>Proceed</Text>
|
<Text style={styles.text_white_small}>Proceed</Text>
|
||||||
|
|
|
@ -17,12 +17,15 @@ export default function Revalidation() {
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
setState("Previous session found");
|
setState("Previous session found");
|
||||||
TokenRefresh().then(async (response) => {
|
TokenRefresh().then(async (response) => {
|
||||||
if (response) {
|
let user_info = await UserInfo();
|
||||||
let user_info = await UserInfo();
|
if (response && user_info[0]) {
|
||||||
await dispatch(setUser(user_info));
|
await dispatch(setUser(user_info));
|
||||||
if (
|
if (
|
||||||
!(user_info.year_level || user_info.course || user_info.semester) &&
|
!(
|
||||||
(await UserInfo())
|
user_info[1].year_level ||
|
||||||
|
user_info[1].course ||
|
||||||
|
user_info[1].semester
|
||||||
|
)
|
||||||
) {
|
) {
|
||||||
await setTimeout(() => {
|
await setTimeout(() => {
|
||||||
navigation.navigate("Onboarding");
|
navigation.navigate("Onboarding");
|
||||||
|
|
Loading…
Reference in a new issue