Pray to the gods the duplicate subjects bug is fixed. Move irregular status toggle to user info page from subjects page

This commit is contained in:
Keannu Bernasol 2023-07-27 00:01:44 +08:00
parent 283c030b37
commit 3331ccb974
5 changed files with 79 additions and 155 deletions

View file

@ -11,7 +11,7 @@ import {
export let backendURL = ""; export let backendURL = "";
export let backendURLWebsocket = ""; export let backendURLWebsocket = "";
let use_production = true; let use_production = false;
if (__DEV__ && !use_production) { if (__DEV__ && !use_production) {
backendURL = "http://10.0.10.8:8000"; backendURL = "http://10.0.10.8:8000";
backendURLWebsocket = "ws://10.0.10.8:8000"; backendURLWebsocket = "ws://10.0.10.8:8000";
@ -224,47 +224,19 @@ export async function GetYearLevels() {
}); });
} }
export async function GetSubjects( export async function GetSubjects() {
byCourseOnly: boolean,
course: string,
year_level?: string,
semester?: string
) {
const config = await GetConfig(); const config = await GetConfig();
console.log("by course only?", byCourseOnly); return instance
// If year level and semester specified, .get("/api/v1/subjects/", config)
if (!byCourseOnly && year_level && semester) { .then((response) => {
return instance return [true, response.data];
.get( })
"/api/v1/subjects/" + course + "/" + year_level + "/" + semester, .catch((error) => {
config let error_message = "";
) if (error.response) error_message = error.response.data;
.then((response) => { else error_message = "Unable to reach servers";
// console.log(JSON.stringify(response.data)); return [false, error_message];
return [true, response.data]; });
})
.catch((error) => {
let error_message = "";
if (error.response) error_message = error.response.data;
else error_message = "Unable to reach servers";
return [false, error_message];
});
}
// If only course is specified
else {
return instance
.get("/api/v1/subjects/" + course, config)
.then((response) => {
// console.log(JSON.stringify(response.data));
return [true, response.data];
})
.catch((error) => {
let error_message = "";
if (error.response) error_message = error.response.data;
else error_message = "Unable to reach servers";
return [false, error_message];
});
}
} }
export async function OnboardingUpdateStudentInfo(info: OnboardingParams) { export async function OnboardingUpdateStudentInfo(info: OnboardingParams) {

View file

@ -85,11 +85,12 @@ export type CourseParams = [boolean, Courses];
// Subject // Subject
export interface Subject { export interface Subject {
id: number;
name: string; name: string;
code: string; code: string;
// courses: any[]; // To-do course: string;
// year_levels: any[]; // To-do year_level: string;
// semesters: any[]; // To-do semester: string;
} }
export type Subjects = Array<Subject>; export type Subjects = Array<Subject>;
@ -110,6 +111,7 @@ export interface PatchStudentData {
semester?: string | null; semester?: string | null;
subjects?: any[] | null; // To-do, replace 'any' with your actual type subjects?: any[] | null; // To-do, replace 'any' with your actual type
year_level?: string | null; year_level?: string | null;
irregular?: boolean | null;
} }
export interface StudentData { export interface StudentData {
@ -118,14 +120,14 @@ export interface StudentData {
email: string; email: string;
avatar: string; avatar: string;
student_id_number: string; student_id_number: string;
is_banned: boolean; irregular: boolean;
semester: string; semester: string;
semester_shortname: string; semester_shortname: string;
course: string; course: string;
course_shortname: string; course_shortname: string;
year_level: string; year_level: string;
yearlevel_shortname: string; yearlevel_shortname: string;
subjects: any[]; // To-do subjects: Subject[]; // To-do
username: string; username: string;
} }

View file

@ -28,11 +28,9 @@ export default function Revalidation() {
dispatch(login()); dispatch(login());
dispatch(setUser(user_info[1])); dispatch(setUser(user_info[1]));
if ( if (
!( !user_info[1].year_level ||
user_info[1].year_level || !user_info[1].course ||
user_info[1].course || !user_info[1].semester
user_info[1].semester
)
) { ) {
dispatch(setOnboarding()); dispatch(setOnboarding());
await setTimeout(() => { await setTimeout(() => {

View file

@ -33,9 +33,11 @@ import {
import { colors } from "../../styles"; import { colors } from "../../styles";
import DropDownPicker from "react-native-dropdown-picker"; import DropDownPicker from "react-native-dropdown-picker";
import AnimatedContainerNoScroll from "../../components/AnimatedContainer/AnimatedContainerNoScroll"; import AnimatedContainerNoScroll from "../../components/AnimatedContainer/AnimatedContainerNoScroll";
import BouncyCheckbox from "react-native-bouncy-checkbox"; import { useSelector } from "react-redux";
import { RootState } from "../../features/redux/Store/Store";
export default function SubjectsPage() { export default function SubjectsPage() {
const logged_in_user = useSelector((state: RootState) => state.user.user);
const queryClient = useQueryClient(); const queryClient = useQueryClient();
// User Info // User Info
const [user, setUser] = useState({ const [user, setUser] = useState({
@ -51,15 +53,10 @@ export default function SubjectsPage() {
student_id_number: "", student_id_number: "",
subjects: [] as Subjects, subjects: [] as Subjects,
}); });
const [displayName, setDisplayName] = useState({
first_name: "",
last_name: "",
});
const StudentInfo = useQuery({ const StudentInfo = useQuery({
queryKey: ["user"], queryKey: ["user"],
queryFn: UserInfo, queryFn: UserInfo,
onSuccess: (data: UserInfoParams) => { onSuccess: (data: UserInfoParams) => {
// console.log(data[1]);
setUser({ setUser({
...user, ...user,
first_name: data[1].first_name, first_name: data[1].first_name,
@ -71,31 +68,18 @@ export default function SubjectsPage() {
student_id_number: data[1].student_id_number, student_id_number: data[1].student_id_number,
subjects: data[1].subjects, subjects: data[1].subjects,
}); });
setDisplayName({ setSelectedSubjects(data[1].subjects);
first_name: data[1].first_name,
last_name: data[1].last_name,
});
setSelectedSubjects(user.subjects);
}, },
}); });
const mutation = useMutation({ const mutation = useMutation({
mutationFn: PatchUserInfo, mutationFn: PatchUserInfo,
onSuccess: () => { onSuccess: () => {
queryClient.invalidateQueries({ queryKey: ["user"] }); queryClient.invalidateQueries({ queryKey: ["user"] });
queryClient.invalidateQueries({ queryKey: ["subjects", viewAll] }); queryClient.invalidateQueries({ queryKey: ["subjects"] });
setSelectedSubjects([]); setSelectedSubjects([]);
}, },
}); });
// View all Subjects or only view those under current course, year level, and semester
// This is for irregular students
const [viewAll, setViewAll] = useState(false);
// If viewing all subjects, refresh the choices
useEffect(() => {
queryClient.invalidateQueries({ queryKey: ["subjects", viewAll] });
}, [viewAll]);
// Subjects // Subjects
const [selected_subjects, setSelectedSubjects] = useState<any>([]); const [selected_subjects, setSelectedSubjects] = useState<any>([]);
@ -104,42 +88,17 @@ export default function SubjectsPage() {
const Subjects = useQuery({ const Subjects = useQuery({
enabled: StudentInfo.isFetched, enabled: StudentInfo.isFetched,
queryKey: ["subjects", viewAll], queryKey: ["subjects"],
queryFn: async () => { queryFn: GetSubjects,
let data;
if (
StudentInfo.data &&
StudentInfo.data[1].course_shortname &&
StudentInfo.data[1].yearlevel_shortname &&
StudentInfo.data[1].semester_shortname
) {
data = await GetSubjects(
viewAll,
StudentInfo.data[1].course_shortname,
StudentInfo.data[1].yearlevel_shortname,
StudentInfo.data[1].semester_shortname
);
console.log(JSON.stringify(data));
}
if (data) {
if (!data[0]) {
throw new Error("Error with query" + data[1]);
}
if (!data[1]) {
throw new Error("User has no course, year level, or semester!");
}
// console.log("Subjects available:", data[1]);
}
return data;
},
onSuccess: (data: SubjectParams) => { onSuccess: (data: SubjectParams) => {
let subjectsData = data[1].map((subject: Subject) => ({ if (data[1]) {
label: subject.name, let subjects = data[1].map((subject: Subject) => ({
value: subject.name, label: subject.name,
})); value: subject.name,
// Update the 'subjects' state }));
setSelectedSubjects(user.subjects);
setSubjects(subjectsData); setSubjects(subjects);
}
}, },
}); });
@ -163,9 +122,9 @@ export default function SubjectsPage() {
<View style={styles.flex_row}> <View style={styles.flex_row}>
<Avatar /> <Avatar />
<Text style={{ ...styles.text_white_small, ...{ marginLeft: 16 } }}> <Text style={{ ...styles.text_white_small, ...{ marginLeft: 16 } }}>
{(displayName.first_name || "Undefined") + {(logged_in_user.first_name || "Undefined") +
" " + " " +
(displayName.last_name || "User") + (logged_in_user.last_name || "User") +
"\n" + "\n" +
user.student_id_number} user.student_id_number}
</Text> </Text>
@ -211,22 +170,9 @@ export default function SubjectsPage() {
</View> </View>
</View> </View>
<View style={{ zIndex: -1 }}> <View style={{ zIndex: -1 }}>
<View style={styles.padding} />
<View style={styles.flex_row}>
<BouncyCheckbox
onPress={() => {
setViewAll(!viewAll);
setSubjectsOpen(false);
}}
fillColor={colors.secondary_3}
/>
<Text style={styles.text_white_small}>Irregular </Text>
</View>
<View style={styles.padding} /> <View style={styles.padding} />
<Button <Button
onPress={() => { onPress={() => {
setSelectedSubjects([]);
setSubjectsOpen(!subjectsOpen);
mutation.mutate({ mutation.mutate({
subjects: selected_subjects, subjects: selected_subjects,
}); });

View file

@ -34,8 +34,15 @@ import { colors } from "../../styles";
import DropDownPicker from "react-native-dropdown-picker"; import DropDownPicker from "react-native-dropdown-picker";
import { ValueType } from "react-native-dropdown-picker"; import { ValueType } from "react-native-dropdown-picker";
import AnimatedContainerNoScroll from "../../components/AnimatedContainer/AnimatedContainerNoScroll"; import AnimatedContainerNoScroll from "../../components/AnimatedContainer/AnimatedContainerNoScroll";
import BouncyCheckbox from "react-native-bouncy-checkbox";
import { useSelector } from "react-redux";
import { RootState } from "../../features/redux/Store/Store";
import { useDispatch } from "react-redux";
import { setUser as setUserinState } from "../../features/redux/slices/UserSlice/UserSlice";
export default function UserInfoPage() { export default function UserInfoPage() {
const logged_in_user = useSelector((state: RootState) => state.user.user);
const dispatch = useDispatch();
const queryClient = useQueryClient(); const queryClient = useQueryClient();
// User Info // User Info
const [user, setUser] = useState({ const [user, setUser] = useState({
@ -49,10 +56,7 @@ export default function UserInfoPage() {
course_shortname: "", course_shortname: "",
avatar: "", avatar: "",
student_id_number: "", student_id_number: "",
}); irregular: false,
const [displayName, setDisplayName] = useState({
first_name: "",
last_name: "",
}); });
const StudentInfo = useQuery({ const StudentInfo = useQuery({
queryKey: ["user"], queryKey: ["user"],
@ -68,14 +72,12 @@ export default function UserInfoPage() {
course: data[1].course, course: data[1].course,
avatar: data[1].avatar, avatar: data[1].avatar,
student_id_number: data[1].student_id_number, student_id_number: data[1].student_id_number,
}); irregular: data[1].irregular,
setDisplayName({
first_name: data[1].first_name,
last_name: data[1].last_name,
}); });
setSelectedCourse(data[1].course); setSelectedCourse(data[1].course);
setSelectedSemester(data[1].semester); setSelectedSemester(data[1].semester);
setSelectedYearLevel(data[1].year_level); setSelectedYearLevel(data[1].year_level);
dispatch(setUserinState(data[1]));
}, },
}); });
const mutation = useMutation({ const mutation = useMutation({
@ -83,6 +85,7 @@ export default function UserInfoPage() {
onSuccess: () => { onSuccess: () => {
queryClient.invalidateQueries({ queryKey: ["user"] }); queryClient.invalidateQueries({ queryKey: ["user"] });
queryClient.invalidateQueries({ queryKey: ["subjects"] }); queryClient.invalidateQueries({ queryKey: ["subjects"] });
dispatch(setUserinState(user));
}, },
}); });
@ -135,8 +138,7 @@ export default function UserInfoPage() {
setCourses(courses); setCourses(courses);
}, },
}); });
// Toggle editing of profile
const [isEditable, setIsEditable] = useState(false);
// Profile photo // Profile photo
function Avatar() { function Avatar() {
if (user.avatar) { if (user.avatar) {
@ -157,9 +159,9 @@ export default function UserInfoPage() {
<View style={styles.flex_row}> <View style={styles.flex_row}>
<Avatar /> <Avatar />
<Text style={{ ...styles.text_white_small, ...{ marginLeft: 16 } }}> <Text style={{ ...styles.text_white_small, ...{ marginLeft: 16 } }}>
{(displayName.first_name || "Undefined") + {(logged_in_user.first_name || "Undefined") +
" " + " " +
(displayName.last_name || "User") + (logged_in_user.last_name || "User") +
"\n" + "\n" +
user.student_id_number} user.student_id_number}
</Text> </Text>
@ -173,7 +175,6 @@ export default function UserInfoPage() {
<View style={{ flex: 3 }}> <View style={{ flex: 3 }}>
<TextInput <TextInput
style={styles.input} style={styles.input}
editable={isEditable}
onChange={( onChange={(
e: NativeSyntheticEvent<TextInputChangeEventData> e: NativeSyntheticEvent<TextInputChangeEventData>
): void => { ): void => {
@ -190,7 +191,6 @@ export default function UserInfoPage() {
<View style={{ flex: 3 }}> <View style={{ flex: 3 }}>
<TextInput <TextInput
style={styles.input} style={styles.input}
editable={isEditable}
onChange={( onChange={(
e: NativeSyntheticEvent<TextInputChangeEventData> e: NativeSyntheticEvent<TextInputChangeEventData>
): void => { ): void => {
@ -206,7 +206,6 @@ export default function UserInfoPage() {
</View> </View>
<View style={{ flex: 3 }}> <View style={{ flex: 3 }}>
<DropDownPicker <DropDownPicker
disabled={!isEditable}
zIndex={4000} zIndex={4000}
open={yearLevelOpen} open={yearLevelOpen}
value={selected_yearlevel} value={selected_yearlevel}
@ -242,7 +241,6 @@ export default function UserInfoPage() {
</View> </View>
<View style={{ flex: 3 }}> <View style={{ flex: 3 }}>
<DropDownPicker <DropDownPicker
disabled={!isEditable}
zIndex={3000} zIndex={3000}
open={semesterOpen} open={semesterOpen}
value={selected_semester} value={selected_semester}
@ -278,7 +276,6 @@ export default function UserInfoPage() {
</View> </View>
<View style={{ flex: 3 }}> <View style={{ flex: 3 }}>
<DropDownPicker <DropDownPicker
disabled={!isEditable}
zIndex={2000} zIndex={2000}
open={courseOpen} open={courseOpen}
value={selected_course} value={selected_course}
@ -310,26 +307,35 @@ export default function UserInfoPage() {
</View> </View>
<View style={styles.padding} /> <View style={styles.padding} />
<View style={{ zIndex: -1 }}> <View style={{ zIndex: -1 }}>
<View style={styles.flex_row}>
<BouncyCheckbox
onPress={() => {
mutation.mutate({
irregular: !user.irregular,
});
setUser({ ...user, irregular: !user.irregular });
}}
isChecked={user.irregular}
disableBuiltInState
fillColor={colors.secondary_3}
/>
<Text style={styles.text_white_small}>Irregular </Text>
</View>
<Button <Button
onPress={() => { onPress={() => {
if (isEditable) { setYearLevelOpen(false);
setYearLevelOpen(false); setSemesterOpen(false);
setSemesterOpen(false); setCourseOpen(false);
setCourseOpen(false); mutation.mutate({
mutation.mutate({ first_name: user.first_name,
first_name: user.first_name, last_name: user.last_name,
last_name: user.last_name, course: selected_course,
course: selected_course, semester: selected_semester,
semester: selected_semester, year_level: selected_yearlevel,
year_level: selected_yearlevel, });
});
}
setIsEditable(!isEditable);
}} }}
> >
<Text style={styles.text_white_small}> <Text style={styles.text_white_small}>Save Changes</Text>
{isEditable && StudentInfo.isSuccess ? "Save" : "Edit Profile"}
</Text>
</Button> </Button>
</View> </View>
</AnimatedContainerNoScroll> </AnimatedContainerNoScroll>