keannu125/StudE-Frontend
1
0
Fork 0
mirror of https://github.com/lemeow125/StudE-Frontend.git synced 2024-11-17 06:19:25 +08:00
Code Issues Projects Releases Packages Wiki Activity Actions

Added refresh button to homepage and made it possible to join and leave groups from list view

Browse source
This commit is contained in:
Keannu Bernasol 2023-10-13 14:01:11 +08:00
parent 02eabd2b41
commit 0c9f53b84d
2 changed files with 119 additions and 25 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

26
src/icons/RefreshIcon/RefreshIcon.tsx Normal file
View file

@ -0,0 +1,26 @@
import * as React from "react";
import { IconProps } from "../../interfaces/Interfaces";
import { Svg, Path } from "react-native-svg";
import { colors } from "../../styles";
export default function RefreshIcon(props: IconProps) {
return (
<>
<Svg
width={props.size}
height={props.size}
viewBox="0 0 24 24"
strokeWidth="2"
stroke={colors.icon_color}
fill="none"
strokeLinecap="round"
strokeLinejoin="round"
>
<Path stroke="none" d="M0 0h24v24H0z" fill="none"></Path>
<Path d="M20 11a8.1 8.1 0 0 0 -15.5 -2m-.5 -4v4h4"></Path>
<Path d="M4 13a8.1 8.1 0 0 0 15.5 2m.5 4v-4h-4"></Path>
</Svg>
</>
);
}

88
src/routes/Home/Home.tsx
View file

@ -43,6 +43,7 @@ import GetDistanceFromUSTP from "../../components/GetDistance/GetDistanceFromUST
import Modal from "react-native-modal";
import DropdownIcon from "../../icons/CaretDownIcon/CaretDownIcon";
import CaretUpIcon from "../../icons/CaretUpIcon/CaretUpIcon";
import RefreshIcon from "../../icons/RefreshIcon/RefreshIcon";
export default function Home() {
// Switch this condition to see the main map when debugging
@ -64,7 +65,6 @@ export default function Home() {
async function requestLocation() {
const { status } = await Location.requestForegroundPermissionsAsync();
if (status !== "granted") {
setLocationPermitted(true);
setFeedback("Allow location permissions to continue");
toast.show(
"Location permission was denied. Please allow in order to use StudE",
@ -78,6 +78,10 @@ export default function Home() {
return;
}
if (status == "granted") {
if (locationPermitted === false) {
setLocationPermitted(true);
}
let newLocation = await Location.getCurrentPositionAsync();
if (newLocation) {
// Only update location state if user's location has changed
@ -357,7 +361,6 @@ export default function Home() {
});
function CustomMap() {
if (dist && location && locationFetched) {
if (
(StudentStatusQuery.isFetching && studying) ||
StudentStatusListQuery.isFetching ||
@ -373,10 +376,36 @@ export default function Home() {
<Text style={styles.text_white_medium}>Loading...</Text>
</>
);
}
} else if (!locationPermitted) {
console.log(locationPermitted);
return (
<>
<Text style={styles.text_white_medium}>{feedback}</Text>
<Button onPress={async () => await requestLocation()}>
<Text style={styles.text_white_medium}>Allow Access</Text>
</Button>
</>
);
} else if (dist && location && locationFetched) {
if (dist <= 1 || map_distance_override) {
return (
<>
<View style={{ alignSelf: "flex-end" }}>
<Pressable
onPress={() => {
queryClient.invalidateQueries({ queryKey: ["user"] });
queryClient.invalidateQueries({ queryKey: ["user_status"] });
queryClient.invalidateQueries({
queryKey: ["user_status_list"],
});
queryClient.invalidateQueries({
queryKey: ["study_group_list"],
});
}}
>
<RefreshIcon size={32} />
</Pressable>
</View>
<MapView
mapType={"none"}
style={styles.map}
@ -862,17 +891,14 @@ export default function Home() {
} else {
return <MapRendererFar location={location.coords} dist={dist} />;
}
} else if (!locationPermitted) {
} else {
return (
<>
<Text style={styles.text_white_medium}>{feedback}</Text>
<Button onPress={async () => await requestLocation()}>
<Text style={styles.text_white_medium}>Allow Access</Text>
</Button>
<View style={{ paddingVertical: 8 }} />
<ActivityIndicator size={96} color={colors.secondary_1} />
<Text style={styles.text_white_medium}>Loading...</Text>
</>
);
} else {
return <></>;
}
}
return (
@ -970,6 +996,47 @@ export default function Home() {
) : (
<></>
)}
{student_status?.study_group != studygroup.name ? (
<Pressable
style={{
...styles.button_template,
backgroundColor: colors.secondary_2,
}}
onPress={() => {
change_study_group.mutate({
study_group: studygroup.name,
subject: studygroup.subject,
});
setModalOpen(!modalOpen);
}}
>
<Text style={styles.text_white_tiny_bold}>
Join Group
</Text>
</Pressable>
) : (
<></>
)}
{student_status?.study_group == studygroup.name ? (
<Pressable
style={{
...styles.button_template,
backgroundColor: colors.secondary_2,
}}
onPress={() => {
change_study_group.mutate({
study_group: "",
});
setModalOpen(!modalOpen);
}}
>
<Text style={styles.text_white_tiny_bold}>
Leave Group
</Text>
</Pressable>
) : (
<></>
)}
</View>
);
})
@ -979,6 +1046,7 @@ export default function Home() {
</ScrollView>
</AnimatedContainer>
</Modal>
<AnimatedContainer>
<View style={{ borderRadius: 16, overflow: "hidden" }}>
<CustomMap />