mirror of
https://github.com/lemeow125/StudE-Frontend.git
synced 2024-11-16 22:09:26 +08:00
Added refresh button to homepage and made it possible to join and leave groups from list view
This commit is contained in:
parent
02eabd2b41
commit
0c9f53b84d
2 changed files with 119 additions and 25 deletions
26
src/icons/RefreshIcon/RefreshIcon.tsx
Normal file
26
src/icons/RefreshIcon/RefreshIcon.tsx
Normal 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>
|
||||
</>
|
||||
);
|
||||
}
|
|
@ -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,26 +361,51 @@ export default function Home() {
|
|||
});
|
||||
|
||||
function CustomMap() {
|
||||
if (dist && location && locationFetched) {
|
||||
if (
|
||||
(StudentStatusQuery.isFetching && studying) ||
|
||||
StudentStatusListQuery.isFetching ||
|
||||
StudyGroupQuery.isFetching ||
|
||||
(StudentStatusQuery.isFetching && !studying) ||
|
||||
StudentStatusListGlobalQuery.isFetching ||
|
||||
StudyGroupGlobalQuery.isFetching
|
||||
) {
|
||||
return (
|
||||
<>
|
||||
<View style={{ paddingVertical: 8 }} />
|
||||
<ActivityIndicator size={96} color={colors.secondary_1} />
|
||||
<Text style={styles.text_white_medium}>Loading...</Text>
|
||||
</>
|
||||
);
|
||||
}
|
||||
if (
|
||||
(StudentStatusQuery.isFetching && studying) ||
|
||||
StudentStatusListQuery.isFetching ||
|
||||
StudyGroupQuery.isFetching ||
|
||||
(StudentStatusQuery.isFetching && !studying) ||
|
||||
StudentStatusListGlobalQuery.isFetching ||
|
||||
StudyGroupGlobalQuery.isFetching
|
||||
) {
|
||||
return (
|
||||
<>
|
||||
<View style={{ paddingVertical: 8 }} />
|
||||
<ActivityIndicator size={96} color={colors.secondary_1} />
|
||||
<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 />
|
||||
|
|
Loading…
Reference in a new issue