Added global study groups rendering

This commit is contained in:
Keannu Bernasol 2023-09-24 21:26:15 +08:00
parent 1bd07f9edd
commit ed19150d53
2 changed files with 113 additions and 1 deletions

View file

@ -302,7 +302,20 @@ export async function GetStudyGroupListFiltered() {
return instance
.get("/api/v1/study_groups/near/", config)
.then((response) => {
console.log("Data:", response.data);
return [true, response.data];
})
.catch((error) => {
let error_message = ParseError(error);
return [false, error_message];
});
}
export async function GetStudyGroupList() {
const config = await GetConfig();
return instance
.get("/api/v1/study_groups/", config)
.then((response) => {
console.log("test", response.data);
return [true, response.data];
})
.catch((error) => {

View file

@ -33,6 +33,7 @@ import {
GetStudentStatus,
GetStudentStatusList,
GetStudentStatusListFiltered,
GetStudyGroupList,
GetStudyGroupListFiltered,
PatchStudentStatus,
urlProvider,
@ -242,6 +243,34 @@ export default function Home() {
});
},
});
const [study_groups_global, setStudyGroupsGlobal] = useState<
StudyGroupType[]
>([]);
// Student Status List
const StudyGroupGlobalQuery = useQuery({
enabled: !studying,
queryKey: ["study_group_list_global"],
queryFn: async () => {
const data = await GetStudyGroupList();
if (data[0] == false) {
return Promise.reject(new Error(JSON.stringify(data[1])));
}
return data;
},
onSuccess: (data: StudyGroupReturnType) => {
if (data[1] && location) {
setStudyGroupsGlobal(data[1]);
}
},
onError: (error: Error) => {
toast.show(String(error), {
type: "warning",
placement: "top",
duration: 2000,
animationType: "slide-in",
});
},
});
function CustomMap() {
if (dist && location) {
@ -395,6 +424,76 @@ export default function Home() {
</React.Fragment>
);
})}
{study_groups_global.map(
(studygroup: StudyGroupType, index: number) => {
const randomColorWithOpacity = `rgba(${Math.floor(
Math.random() * 256
)}, ${Math.floor(Math.random() * 256)}, ${Math.floor(
Math.random() * 256
)}, 0.7)`;
return (
<React.Fragment key={index}>
<Marker
coordinate={studygroup.location}
pinColor={randomColorWithOpacity}
zIndex={1000}
onPress={() => {
toast.hideAll();
toast.show(
<View
style={{
alignContent: "center",
alignSelf: "center",
justifyContent: "center",
}}
>
<Text style={styles.text_white_tiny_bold}>
Subject: {studygroup.subject}
</Text>
<Text style={styles.text_white_tiny_bold}>
Students Studying: {studygroup.users.length}
</Text>
<Button
onPress={() => {
toast.show("Joined successfully", {
type: "success",
placement: "top",
duration: 2000,
animationType: "slide-in",
});
}}
>
<Text style={styles.text_white_tiny_bold}>
Join Group
</Text>
</Button>
</View>,
{
type: "normal",
placement: "top",
duration: 2000,
animationType: "slide-in",
style: {
backgroundColor: colors.secondary_2,
borderWidth: 1,
borderColor: colors.primary_1,
},
}
);
}}
/>
<Circle
center={studygroup.location}
radius={studygroup.radius}
fillColor={randomColorWithOpacity}
strokeColor="white"
zIndex={1000}
/>
</React.Fragment>
);
}
)}
<Marker
zIndex={1001}
coordinate={{