mirror of
https://github.com/lemeow125/StudE-Frontend.git
synced 2025-04-20 08:51:21 +08:00
Compare commits
No commits in common. "master" and "v0.9.0-beta" have entirely different histories.
master
...
v0.9.0-bet
20 changed files with 1949 additions and 1155 deletions
1819
package-lock.json
generated
1819
package-lock.json
generated
File diff suppressed because it is too large
Load diff
|
|
@ -26,7 +26,7 @@
|
|||
"moment": "^2.29.4",
|
||||
"moti": "^0.25.3",
|
||||
"react": "18.2.0",
|
||||
"react-native": "0.71.14",
|
||||
"react-native": "0.71.8",
|
||||
"react-native-bouncy-checkbox": "^3.0.7",
|
||||
"react-native-dropdown-picker": "^5.4.6",
|
||||
"react-native-gesture-handler": "~2.9.0",
|
||||
|
|
|
|||
|
|
@ -17,10 +17,7 @@ export default function Button({ disabled = false, ...props }: props) {
|
|||
<Pressable
|
||||
disabled={disabled}
|
||||
onPress={props.onPress}
|
||||
style={({ pressed }) => [
|
||||
styles.button_template,
|
||||
{ backgroundColor: pressed ? colors.primary_2 : props.color },
|
||||
]}
|
||||
style={{ ...styles.button_template, ...{ backgroundColor: props.color } }}
|
||||
>
|
||||
{props.children}
|
||||
</Pressable>
|
||||
|
|
|
|||
|
|
@ -24,7 +24,6 @@ import SubjectIcon from "../../icons/SubjectIcon/SubjectIcon";
|
|||
import { useMutation, useQueryClient } from "@tanstack/react-query";
|
||||
import { PatchStudentStatus } from "../Api/Api";
|
||||
import { useToast } from "react-native-toast-notifications";
|
||||
import MessageIcon from "../../icons/MessageIcon/MessageIcon";
|
||||
|
||||
export default function CustomDrawerContent(props: {}) {
|
||||
const debug = false;
|
||||
|
|
@ -137,13 +136,13 @@ export default function CustomDrawerContent(props: {}) {
|
|||
navigation.navigate("Conversation");
|
||||
}}
|
||||
>
|
||||
<MessageIcon size={32} />
|
||||
<SubjectIcon size={32} />
|
||||
<Text style={styles.text_white_medium}>Conversation</Text>
|
||||
</DrawerButton>
|
||||
<DrawerButton
|
||||
onPress={async () => {
|
||||
// We don't clear student statuses when logging out on debug
|
||||
if (debug) {
|
||||
if (!debug) {
|
||||
queryClient.clear();
|
||||
dispatch(logout());
|
||||
await AsyncStorage.clear();
|
||||
|
|
|
|||
|
|
@ -15,6 +15,6 @@ export default function GetDistanceFromUSTP(location: LocationType) {
|
|||
ustpCoords.latitude,
|
||||
ustpCoords.longitude
|
||||
);
|
||||
dist = Math.round(dist * 100) / 100;
|
||||
dist = Math.round(dist);
|
||||
return dist;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,17 +0,0 @@
|
|||
import * as React from "react";
|
||||
import styles from "../../styles";
|
||||
import { View, Text, ActivityIndicator } from "react-native";
|
||||
import { colors } from "../../styles";
|
||||
import AnimatedContainer from "../AnimatedContainer/AnimatedContainer";
|
||||
|
||||
export default function LoadingFeedback() {
|
||||
return (
|
||||
<View style={styles.background}>
|
||||
<AnimatedContainer>
|
||||
<View style={{ paddingVertical: 8 }} />
|
||||
<ActivityIndicator size={128} color={colors.secondary_1} />
|
||||
<Text style={styles.text_white_medium}>Loading...</Text>
|
||||
</AnimatedContainer>
|
||||
</View>
|
||||
);
|
||||
}
|
||||
|
|
@ -1,28 +0,0 @@
|
|||
import * as React from "react";
|
||||
import { IconProps } from "../../interfaces/Interfaces";
|
||||
import { Svg, Path } from "react-native-svg";
|
||||
import { colors } from "../../styles";
|
||||
|
||||
export default function CaretRightIcon(props: IconProps) {
|
||||
return (
|
||||
<>
|
||||
<Svg
|
||||
height={props.size + "px"}
|
||||
width={props.size + "px"}
|
||||
viewBox="0 0 24 24"
|
||||
stroke-width="2"
|
||||
stroke={colors.icon_color}
|
||||
fill="none"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<Path stroke="none" d="M0 0h24v24H0z" fill="none"></Path>
|
||||
<Path
|
||||
d="M13.883 5.007l.058 -.005h.118l.058 .005l.06 .009l.052 .01l.108 .032l.067 .027l.132 .07l.09 .065l.081 .073l.083 .094l.054 .077l.054 .096l.017 .036l.027 .067l.032 .108l.01 .053l.01 .06l.004 .057l.002 .059v12c0 .852 -.986 1.297 -1.623 .783l-.084 -.076l-6 -6a1 1 0 0 1 -.083 -1.32l.083 -.094l6 -6l.094 -.083l.077 -.054l.096 -.054l.036 -.017l.067 -.027l.108 -.032l.053 -.01l.06 -.01z"
|
||||
stroke-width="0"
|
||||
fill={colors.icon_color}
|
||||
></Path>
|
||||
</Svg>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
|
@ -1,28 +0,0 @@
|
|||
import * as React from "react";
|
||||
import { IconProps } from "../../interfaces/Interfaces";
|
||||
import { Svg, Path } from "react-native-svg";
|
||||
import { colors } from "../../styles";
|
||||
|
||||
export default function CaretRightIcon(props: IconProps) {
|
||||
return (
|
||||
<>
|
||||
<Svg
|
||||
height={props.size + "px"}
|
||||
width={props.size + "px"}
|
||||
viewBox="0 0 24 24"
|
||||
stroke-width="2"
|
||||
stroke={colors.icon_color}
|
||||
fill="none"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<Path stroke="none" d="M0 0h24v24H0z" fill="none"></Path>
|
||||
<Path
|
||||
d="M13.883 5.007l.058 -.005h.118l.058 .005l.06 .009l.052 .01l.108 .032l.067 .027l.132 .07l.09 .065l.081 .073l.083 .094l.054 .077l.054 .096l.017 .036l.027 .067l.032 .108l.01 .053l.01 .06l.004 .057l.002 .059v12c0 .852 -.986 1.297 -1.623 .783l-.084 -.076l-6 -6a1 1 0 0 1 -.083 -1.32l.083 -.094l6 -6l.094 -.083l.077 -.054l.096 -.054l.036 -.017l.067 -.027l.108 -.032l.053 -.01l.06 -.01z"
|
||||
stroke-width="0"
|
||||
fill={colors.icon_color}
|
||||
></Path>
|
||||
</Svg>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
|
@ -1,29 +0,0 @@
|
|||
import * as React from "react";
|
||||
import { IconProps } from "../../interfaces/Interfaces";
|
||||
|
||||
import { Svg, Path } from "react-native-svg";
|
||||
import { colors } from "../../styles";
|
||||
|
||||
export default function MessageIcon(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="M8 9h8"></Path>
|
||||
<Path d="M8 13h6"></Path>
|
||||
<Path d="M12.5 20.5l-.5 .5l-3 -3h-3a3 3 0 0 1 -3 -3v-8a3 3 0 0 1 3 -3h12a3 3 0 0 1 3 3v4"></Path>
|
||||
<Path d="M21.121 20.121a3 3 0 1 0 -4.242 0c.418 .419 1.125 1.045 2.121 1.879c1.051 -.89 1.759 -1.516 2.121 -1.879z"></Path>
|
||||
<Path d="M19 18v.01"></Path>
|
||||
</Svg>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
|
@ -1,26 +0,0 @@
|
|||
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>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
import * as React from "react";
|
||||
import { ActivityIndicator, Image, Pressable } from "react-native";
|
||||
import { ActivityIndicator, Image } from "react-native";
|
||||
import styles from "../../styles";
|
||||
import {
|
||||
View,
|
||||
|
|
@ -34,13 +34,9 @@ import { useToast } from "react-native-toast-notifications";
|
|||
import { useQueryClient } from "@tanstack/react-query";
|
||||
import AnimatedContainer from "../../components/AnimatedContainer/AnimatedContainer";
|
||||
import AsyncStorage from "@react-native-async-storage/async-storage";
|
||||
import { useSelector } from "react-redux";
|
||||
import { RootState } from "../../features/redux/Store/Store";
|
||||
import CaretRightIcon from "../../icons/CaretLeftIcon/CaretLeftIcon";
|
||||
|
||||
export default function ConversationPage() {
|
||||
const toast = useToast();
|
||||
const user = useSelector((state: RootState) => state.user);
|
||||
// Student Status
|
||||
const [student_status, setStudentStatus] = useState<StudentStatusType>();
|
||||
const StudentStatusQuery = useQuery({
|
||||
|
|
@ -71,7 +67,6 @@ export default function ConversationPage() {
|
|||
enabled:
|
||||
student_status?.study_group != "" && student_status?.study_group != null,
|
||||
queryKey: ["study_group"],
|
||||
refetchInterval: 10000,
|
||||
queryFn: async () => {
|
||||
const data = await GetStudyGroup(student_status?.study_group || "");
|
||||
if (data[0] == false) {
|
||||
|
|
@ -129,7 +124,7 @@ export default function ConversationPage() {
|
|||
// Avatar List
|
||||
const [users, setUsers] = useState<GroupMessageAvatarType[]>([]);
|
||||
const AvatarsQuery = useQuery({
|
||||
refetchInterval: 10000,
|
||||
refetchInterval: 3000,
|
||||
enabled:
|
||||
student_status?.study_group != null ||
|
||||
(student_status?.study_group != "" &&
|
||||
|
|
@ -164,7 +159,7 @@ export default function ConversationPage() {
|
|||
mutationFn: async (info: MessagePostType) => {
|
||||
const data = await PostMessage(info);
|
||||
if (data[0] != true) {
|
||||
return Promise.reject(new Error(data[1]));
|
||||
return Promise.reject(new Error());
|
||||
}
|
||||
return data;
|
||||
},
|
||||
|
|
@ -200,17 +195,9 @@ export default function ConversationPage() {
|
|||
>
|
||||
<View style={styles.flex_row}>
|
||||
<Text style={{ ...styles.text_white_medium }}>
|
||||
{`Group: ${studygroup?.name ? studygroup.name : "Loading..."}`}
|
||||
{`Group: ${studygroup?.name ? studygroup.name : ""}`}
|
||||
</Text>
|
||||
</View>
|
||||
{studygroup.landmark ? (
|
||||
<Text style={{...styles.text_white_tiny_bold,...{textAlign:'left'}}}>
|
||||
{studygroup.landmark}
|
||||
</Text>
|
||||
) : (
|
||||
<></>
|
||||
)}
|
||||
|
||||
<View style={{ ...styles.flex_row }}>
|
||||
<Text
|
||||
style={{
|
||||
|
|
@ -219,9 +206,7 @@ export default function ConversationPage() {
|
|||
paddingRight: 4,
|
||||
}}
|
||||
>
|
||||
{!StudyGroupQuery.isFetching
|
||||
? studygroup.students.length + " studying"
|
||||
: "Loading"}
|
||||
{studygroup.students.length} studying
|
||||
</Text>
|
||||
{users.map((user: GroupMessageAvatarType, index: number) => {
|
||||
if (index > 6) {
|
||||
|
|
@ -263,10 +248,7 @@ export default function ConversationPage() {
|
|||
key={message.id}
|
||||
style={{
|
||||
...styles.message_contentContainer,
|
||||
alignItems:
|
||||
message.user === user.user.username
|
||||
? "flex-end"
|
||||
: "flex-start",
|
||||
alignItems: index % 2 == 0 ? "flex-end" : "flex-start",
|
||||
}}
|
||||
>
|
||||
<View style={styles.flex_row}>
|
||||
|
|
@ -305,7 +287,6 @@ export default function ConversationPage() {
|
|||
<Text style={styles.text_white_small}>There are no messages</Text>
|
||||
)}
|
||||
</ScrollView>
|
||||
<View style={styles.flex_row}>
|
||||
<TextInput
|
||||
style={styles.chatbox}
|
||||
placeholder="Send a message..."
|
||||
|
|
@ -323,23 +304,6 @@ export default function ConversationPage() {
|
|||
setMessage("");
|
||||
}}
|
||||
/>
|
||||
<Pressable
|
||||
style={{
|
||||
backgroundColor: colors.secondary_3,
|
||||
borderRadius: 16,
|
||||
alignSelf: "center",
|
||||
marginLeft: 16,
|
||||
}}
|
||||
onPress={() => {
|
||||
send_message.mutate({
|
||||
message_content: message,
|
||||
});
|
||||
setMessage("");
|
||||
}}
|
||||
>
|
||||
<CaretRightIcon size={48} />
|
||||
</Pressable>
|
||||
</View>
|
||||
</AnimatedContainer>
|
||||
</View>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -6,7 +6,6 @@ import {
|
|||
TextInput,
|
||||
NativeSyntheticEvent,
|
||||
TextInputChangeEventData,
|
||||
Pressable,
|
||||
} from "react-native";
|
||||
import { useState } from "react";
|
||||
import {
|
||||
|
|
@ -23,8 +22,6 @@ import { urlProvider } from "../../components/Api/Api";
|
|||
import MapView, { UrlTile, Marker } from "react-native-maps";
|
||||
import { useNavigation } from "@react-navigation/native";
|
||||
import { useToast } from "react-native-toast-notifications";
|
||||
import CaretLeftIcon from "../../icons/CaretLeftIcon/CaretLeftIcon";
|
||||
import AnimatedContainer from "../../components/AnimatedContainer/AnimatedContainer";
|
||||
|
||||
export default function CreateGroup({ route }: any) {
|
||||
const { location, subject } = route.params;
|
||||
|
|
@ -44,6 +41,7 @@ export default function CreateGroup({ route }: any) {
|
|||
onSuccess: () => {
|
||||
queryClient.invalidateQueries({ queryKey: ["user"] });
|
||||
queryClient.invalidateQueries({ queryKey: ["user_status"] });
|
||||
queryClient.invalidateQueries({ queryKey: ["study_group_list"] });
|
||||
student_status_patch.mutate({
|
||||
study_group: name,
|
||||
});
|
||||
|
|
@ -75,18 +73,13 @@ export default function CreateGroup({ route }: any) {
|
|||
onSuccess: () => {
|
||||
queryClient.invalidateQueries({ queryKey: ["user"] });
|
||||
queryClient.invalidateQueries({ queryKey: ["user_status"] });
|
||||
queryClient.invalidateQueries({ queryKey: ["user_status_list"] });
|
||||
queryClient.invalidateQueries({ queryKey: ["study_group_list"] });
|
||||
toast.show(`Joined group ${name} successfully`, {
|
||||
type: "success",
|
||||
placement: "top",
|
||||
duration: 2000,
|
||||
animationType: "slide-in",
|
||||
});
|
||||
// Set a delay before going back to conversation page to hopefully let the queries refresh in time
|
||||
setTimeout(() => {
|
||||
navigation.navigate("Conversation");
|
||||
}, 200);
|
||||
navigation.navigate("Home");
|
||||
},
|
||||
onError: (error: Error) => {
|
||||
toast.show(String(error), {
|
||||
|
|
@ -101,10 +94,9 @@ export default function CreateGroup({ route }: any) {
|
|||
if (location) {
|
||||
return (
|
||||
<View style={styles.background}>
|
||||
<AnimatedContainer>
|
||||
<AnimatedContainerNoScroll>
|
||||
<View style={{ zIndex: -1 }}>
|
||||
<View style={styles.padding} />
|
||||
<View style={{ borderRadius: 16, overflow: "hidden" }}>
|
||||
<MapView
|
||||
style={{
|
||||
height: Viewport.height * 0.4,
|
||||
|
|
@ -150,7 +142,6 @@ export default function CreateGroup({ route }: any) {
|
|||
pinColor={colors.primary_1}
|
||||
/>
|
||||
</MapView>
|
||||
</View>
|
||||
<View style={styles.padding} />
|
||||
</View>
|
||||
<TextInput
|
||||
|
|
@ -166,10 +157,6 @@ export default function CreateGroup({ route }: any) {
|
|||
}}
|
||||
/>
|
||||
<View style={styles.padding} />
|
||||
<View style={styles.flex_row}>
|
||||
<Pressable onPress={() => navigation.navigate("Home")}>
|
||||
<CaretLeftIcon size={32} />
|
||||
</Pressable>
|
||||
<Button
|
||||
onPress={() => {
|
||||
study_group_create.mutate({
|
||||
|
|
@ -181,10 +168,8 @@ export default function CreateGroup({ route }: any) {
|
|||
>
|
||||
<Text style={styles.text_white_small}>Start Studying</Text>
|
||||
</Button>
|
||||
</View>
|
||||
|
||||
<View style={styles.padding} />
|
||||
</AnimatedContainer>
|
||||
</AnimatedContainerNoScroll>
|
||||
</View>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,16 +1,8 @@
|
|||
import styles, { colors } from "../../styles";
|
||||
import {
|
||||
View,
|
||||
Text,
|
||||
Pressable,
|
||||
ScrollView,
|
||||
Switch,
|
||||
ActivityIndicator,
|
||||
TouchableHighlight,
|
||||
} from "react-native";
|
||||
import { View, Text, Pressable, ScrollView, Switch } from "react-native";
|
||||
import AnimatedContainer from "../../components/AnimatedContainer/AnimatedContainer";
|
||||
import { useState, useEffect } from "react";
|
||||
import MapView, { Callout, Circle, Marker, UrlTile } from "react-native-maps";
|
||||
import MapView, { Circle, Marker } from "react-native-maps";
|
||||
import * as Location from "expo-location";
|
||||
import GetDistance from "../../components/GetDistance/GetDistance";
|
||||
import Button from "../../components/Button/Button";
|
||||
|
|
@ -34,7 +26,6 @@ import {
|
|||
GetStudyGroupList,
|
||||
GetStudyGroupListFiltered,
|
||||
PatchStudentStatus,
|
||||
urlProvider,
|
||||
} from "../../components/Api/Api";
|
||||
import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
|
||||
import { useToast } from "react-native-toast-notifications";
|
||||
|
|
@ -44,16 +35,12 @@ 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";
|
||||
import AsyncStorage from "@react-native-async-storage/async-storage";
|
||||
import AnimatedContainerNoScroll from "../../components/AnimatedContainer/AnimatedContainerNoScroll";
|
||||
|
||||
export default function Home() {
|
||||
// Switch this condition to see the main map when debugging
|
||||
const map_distance_override = false;
|
||||
const navigation = useNavigation<RootDrawerParamList>();
|
||||
const [location, setLocation] = useState<RawLocationType | null>(null);
|
||||
const [locationPermitted, setLocationPermitted] = useState(false);
|
||||
const [dist, setDist] = useState<number | null>(null);
|
||||
const [feedback, setFeedback] = useState(
|
||||
"To continue, please allow Stud-E permission to location services"
|
||||
|
|
@ -64,7 +51,7 @@ export default function Home() {
|
|||
const [modalOpen, setModalOpen] = useState(false);
|
||||
const [modalByGroup, setModalByGroup] = useState(false);
|
||||
|
||||
async function requestLocationPermission() {
|
||||
async function requestLocation() {
|
||||
const { status } = await Location.requestForegroundPermissionsAsync();
|
||||
if (status !== "granted") {
|
||||
setFeedback("Allow location permissions to continue");
|
||||
|
|
@ -78,51 +65,47 @@ export default function Home() {
|
|||
}
|
||||
);
|
||||
return;
|
||||
} else {
|
||||
setLocationPermitted(true);
|
||||
}
|
||||
}
|
||||
|
||||
async function requestLocation() {
|
||||
if (locationPermitted) {
|
||||
let newLocation = await Location.getCurrentPositionAsync();
|
||||
|
||||
if (status == "granted") {
|
||||
let newLocation = await Location.getCurrentPositionAsync({});
|
||||
if (newLocation) {
|
||||
// Only update location state if user's location has changed
|
||||
if (
|
||||
!location ||
|
||||
newLocation.coords.latitude !== location.coords.latitude ||
|
||||
newLocation.coords.longitude !== location.coords.longitude
|
||||
) {
|
||||
setLocation(newLocation);
|
||||
await DistanceHandler(newLocation);
|
||||
DistanceHandler(newLocation);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Refresh every 15 seconds
|
||||
useEffect(() => {
|
||||
// console.log("Location Update");
|
||||
// console.log(locationPermitted);
|
||||
requestLocation();
|
||||
}, [locationPermitted]);
|
||||
|
||||
useEffect(() => {
|
||||
requestLocationPermission();
|
||||
// Refresh every 30 seconds
|
||||
const interval = setInterval(() => {
|
||||
requestLocation();
|
||||
}, 30000);
|
||||
}, 15000);
|
||||
|
||||
return () => clearInterval(interval);
|
||||
});
|
||||
|
||||
// Refresh when screen loads
|
||||
useEffect(() => {
|
||||
requestLocation();
|
||||
}, []);
|
||||
|
||||
const [stopping_toofar, setStopping] = useState(false);
|
||||
async function DistanceHandler(location: RawLocationType) {
|
||||
let dist = GetDistanceFromUSTP(location.coords);
|
||||
setDist(dist);
|
||||
// Deactivate student status if too far away from USTP and still studying
|
||||
if (dist >= 1 && !map_distance_override && studying && !stopping_toofar) {
|
||||
// Deactivate student status if too far away and still studying
|
||||
if (dist >= 2 && !map_distance_override && studying)
|
||||
stop_studying.mutate({
|
||||
active: false,
|
||||
});
|
||||
setStopping(true);
|
||||
}
|
||||
}
|
||||
|
||||
async function clear_messages_notification_cache() {
|
||||
AsyncStorage.setItem("messages", "");
|
||||
}
|
||||
// Student Status
|
||||
const [studying, setStudying] = useState(false);
|
||||
const [subject, setSubject] = useState("");
|
||||
|
|
@ -146,22 +129,6 @@ export default function Home() {
|
|||
setSubject(data[1].subject);
|
||||
setStudying(data[1].active);
|
||||
setStudentStatus(data[1]);
|
||||
// Deactivate student status if too far away from current location you are studying in
|
||||
if (student_status && location) {
|
||||
const dist = GetDistance(
|
||||
student_status.location.latitude,
|
||||
student_status.location.longitude,
|
||||
location.coords.latitude,
|
||||
location.coords.longitude
|
||||
);
|
||||
if (dist > 0.5 && studying && !stopping_toofar) {
|
||||
console.log("Too far from current studying location");
|
||||
stop_studying.mutate({
|
||||
active: false,
|
||||
});
|
||||
setStopping(true);
|
||||
}
|
||||
}
|
||||
},
|
||||
onError: (error: Error) => {
|
||||
toast.show(String(error), {
|
||||
|
|
@ -177,7 +144,7 @@ export default function Home() {
|
|||
mutationFn: async (info: StudentStatusPatchType) => {
|
||||
const data = await PatchStudentStatus(info);
|
||||
if (data[0] != true) {
|
||||
return Promise.reject(new Error(JSON.stringify(data[1])));
|
||||
return Promise.reject(new Error());
|
||||
}
|
||||
return data;
|
||||
},
|
||||
|
|
@ -207,7 +174,6 @@ export default function Home() {
|
|||
}, 500);
|
||||
setStudyGroups([]);
|
||||
setStudying(false);
|
||||
setStopping(false);
|
||||
},
|
||||
onError: (error: Error) => {
|
||||
toast.show(String(error), {
|
||||
|
|
@ -228,7 +194,7 @@ export default function Home() {
|
|||
return data;
|
||||
},
|
||||
onSuccess: () => {
|
||||
if (student_status?.study_group == "") {
|
||||
if (student_status?.study_group) {
|
||||
// Display separate toast if you stop studying while in a study group
|
||||
toast.show("You left study group \n" + student_status?.study_group, {
|
||||
type: "success",
|
||||
|
|
@ -236,9 +202,7 @@ export default function Home() {
|
|||
duration: 2000,
|
||||
animationType: "slide-in",
|
||||
});
|
||||
clear_messages_notification_cache();
|
||||
}
|
||||
|
||||
queryClient.invalidateQueries({ queryKey: ["user_status"] });
|
||||
|
||||
// Delay refetching for study groups since backend still needs to delete groups without students after leaving a study group
|
||||
|
|
@ -380,51 +344,11 @@ export default function Home() {
|
|||
});
|
||||
|
||||
function CustomMap() {
|
||||
if (!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 (
|
||||
(!StudentStatusQuery.isSuccess &&
|
||||
studying &&
|
||||
!StudentStatusListQuery.isSuccess &&
|
||||
!StudyGroupQuery.isSuccess) ||
|
||||
(!StudentStatusQuery.isSuccess &&
|
||||
!studying &&
|
||||
!StudentStatusListGlobalQuery.isSuccess &&
|
||||
!StudyGroupGlobalQuery.isSuccess)
|
||||
) {
|
||||
return (
|
||||
<>
|
||||
<View style={{ paddingVertical: 8 }} />
|
||||
<ActivityIndicator size={96} color={colors.secondary_1} />
|
||||
<Text style={styles.text_white_medium}>Loading...</Text>
|
||||
</>
|
||||
);
|
||||
} else if (
|
||||
study_groups == undefined ||
|
||||
study_groups_global == undefined ||
|
||||
student_statuses == undefined ||
|
||||
student_statuses_global == undefined
|
||||
) {
|
||||
return (
|
||||
<>
|
||||
<View style={{ paddingVertical: 8 }} />
|
||||
<ActivityIndicator size={96} color={colors.secondary_1} />
|
||||
<Text style={styles.text_white_medium}>Loading...</Text>
|
||||
</>
|
||||
);
|
||||
} else if (dist && location) {
|
||||
if (dist <= 0.25 || map_distance_override) {
|
||||
if (dist && location) {
|
||||
if (dist <= 2 || map_distance_override) {
|
||||
return (
|
||||
<>
|
||||
<MapView
|
||||
mapType={"none"}
|
||||
style={styles.map}
|
||||
customMapStyle={[
|
||||
{
|
||||
|
|
@ -455,13 +379,6 @@ export default function Home() {
|
|||
}}
|
||||
loadingBackgroundColor={colors.secondary_2}
|
||||
>
|
||||
<UrlTile
|
||||
urlTemplate={urlProvider}
|
||||
shouldReplaceMapContent={true}
|
||||
maximumZ={19}
|
||||
flipY={false}
|
||||
zIndex={1}
|
||||
/>
|
||||
{!studying ? (
|
||||
student_statuses_global.map(
|
||||
(student_status: StudentStatusFilterType, index: number) => {
|
||||
|
|
@ -479,7 +396,6 @@ export default function Home() {
|
|||
zIndex={1000}
|
||||
onPress={() => {
|
||||
toast.hideAll();
|
||||
|
||||
toast.show(
|
||||
<View
|
||||
style={{
|
||||
|
|
@ -508,26 +424,7 @@ export default function Home() {
|
|||
}
|
||||
);
|
||||
}}
|
||||
>
|
||||
<Callout>
|
||||
<Text style={styles.text_white_tiny_bold}>
|
||||
Student: {student_status.user}
|
||||
</Text>
|
||||
<Text style={styles.text_white_tiny_bold}>
|
||||
{`Studying ${student_status.subject}`}
|
||||
</Text>
|
||||
<Text style={styles.text_black_tiny}>
|
||||
{`${Math.round(
|
||||
GetDistance(
|
||||
student_status.location.latitude,
|
||||
student_status.location.longitude,
|
||||
location.coords.latitude,
|
||||
location.coords.longitude
|
||||
) * 1000
|
||||
)}m away`}
|
||||
</Text>
|
||||
</Callout>
|
||||
</Marker>
|
||||
/>
|
||||
);
|
||||
}
|
||||
)
|
||||
|
|
@ -608,7 +505,6 @@ export default function Home() {
|
|||
zIndex={1000}
|
||||
onPress={() => {
|
||||
toast.hideAll();
|
||||
|
||||
toast.show(
|
||||
<View
|
||||
style={{
|
||||
|
|
@ -620,13 +516,6 @@ export default function Home() {
|
|||
<Text style={styles.text_white_tiny_bold}>
|
||||
Study Group: {studygroup.name}
|
||||
</Text>
|
||||
{studygroup.landmark ? (
|
||||
<Text style={styles.text_white_tiny_bold}>
|
||||
{studygroup.landmark}
|
||||
</Text>
|
||||
) : (
|
||||
<></>
|
||||
)}
|
||||
<Text style={styles.text_white_tiny_bold}>
|
||||
{`Studying ${studygroup.subject}`}
|
||||
</Text>
|
||||
|
|
@ -651,7 +540,6 @@ export default function Home() {
|
|||
study_group: studygroup.name,
|
||||
subject: studygroup.subject,
|
||||
});
|
||||
navigation.navigate("Conversation");
|
||||
}}
|
||||
>
|
||||
<Text style={styles.text_white_tiny_bold}>
|
||||
|
|
@ -691,35 +579,7 @@ export default function Home() {
|
|||
}
|
||||
);
|
||||
}}
|
||||
>
|
||||
<Callout>
|
||||
<Text style={styles.text_black_tiny}>
|
||||
Study Group: {studygroup.name}
|
||||
</Text>
|
||||
<Text style={styles.text_black_tiny}>
|
||||
Studying: {studygroup.subject}
|
||||
</Text>
|
||||
{studygroup.landmark ? (
|
||||
<Text style={styles.text_black_tiny}>
|
||||
{studygroup.landmark}
|
||||
</Text>
|
||||
) : (
|
||||
<></>
|
||||
)}
|
||||
<Text style={styles.text_black_tiny}>
|
||||
{`${studygroup.students.length} ${
|
||||
studygroup.students.length > 1
|
||||
? "students"
|
||||
: "student"
|
||||
} studying`}
|
||||
</Text>
|
||||
<Text style={styles.text_black_tiny}>
|
||||
{`${Math.round(
|
||||
studygroup.distance * 1000
|
||||
)}m away`}
|
||||
</Text>
|
||||
</Callout>
|
||||
</Marker>
|
||||
/>
|
||||
<Circle
|
||||
center={studygroup.location}
|
||||
radius={studygroup.radius}
|
||||
|
|
@ -762,13 +622,6 @@ export default function Home() {
|
|||
<Text style={styles.text_white_tiny_bold}>
|
||||
Study Group: {studygroup.name}
|
||||
</Text>
|
||||
{studygroup.landmark ? (
|
||||
<Text style={styles.text_white_tiny_bold}>
|
||||
{studygroup.landmark}
|
||||
</Text>
|
||||
) : (
|
||||
<></>
|
||||
)}
|
||||
<Text style={styles.text_white_tiny_bold}>
|
||||
{`Studying ${studygroup.subject}`}
|
||||
</Text>
|
||||
|
|
@ -801,40 +654,7 @@ export default function Home() {
|
|||
}
|
||||
);
|
||||
}}
|
||||
>
|
||||
<Callout>
|
||||
<Text style={styles.text_black_tiny}>
|
||||
Study Group: {studygroup.name}
|
||||
</Text>
|
||||
<Text style={styles.text_black_tiny}>
|
||||
Studying: {studygroup.subject}
|
||||
</Text>
|
||||
{studygroup.landmark ? (
|
||||
<Text style={styles.text_black_tiny}>
|
||||
{studygroup.landmark}
|
||||
</Text>
|
||||
) : (
|
||||
<></>
|
||||
)}
|
||||
<Text style={styles.text_black_tiny}>
|
||||
{`${studygroup.students.length} ${
|
||||
studygroup.students.length > 1
|
||||
? "students"
|
||||
: "student"
|
||||
} studying`}
|
||||
</Text>
|
||||
<Text style={styles.text_black_tiny}>
|
||||
{`${Math.round(
|
||||
GetDistance(
|
||||
studygroup.location.latitude,
|
||||
studygroup.location.longitude,
|
||||
location.coords.latitude,
|
||||
location.coords.longitude
|
||||
)
|
||||
)}m away`}
|
||||
</Text>
|
||||
</Callout>
|
||||
</Marker>
|
||||
/>
|
||||
<Circle
|
||||
center={studygroup.location}
|
||||
radius={studygroup.radius}
|
||||
|
|
@ -984,40 +804,9 @@ export default function Home() {
|
|||
>
|
||||
<Text style={styles.text_white_small}>{buttonLabel}</Text>
|
||||
</Button>
|
||||
<View
|
||||
style={{
|
||||
backgroundColor: colors.secondary_3,
|
||||
borderRadius: 16,
|
||||
alignSelf: "center",
|
||||
marginHorizontal: 8,
|
||||
}}
|
||||
>
|
||||
<Pressable
|
||||
onPress={() => {
|
||||
queryClient.invalidateQueries({ queryKey: ["user"] });
|
||||
queryClient.invalidateQueries({
|
||||
queryKey: ["user_status"],
|
||||
});
|
||||
queryClient.invalidateQueries({
|
||||
queryKey: ["user_status_list"],
|
||||
});
|
||||
queryClient.invalidateQueries({
|
||||
queryKey: ["study_group_list"],
|
||||
});
|
||||
toast.show("Refreshed", {
|
||||
type: "success",
|
||||
placement: "top",
|
||||
duration: 2000,
|
||||
animationType: "slide-in",
|
||||
});
|
||||
requestLocation();
|
||||
}}
|
||||
>
|
||||
<RefreshIcon size={32} />
|
||||
</Pressable>
|
||||
</View>
|
||||
<Pressable
|
||||
style={{
|
||||
display: modalOpen ? "none" : "flex",
|
||||
backgroundColor: colors.secondary_3,
|
||||
borderRadius: 16,
|
||||
alignSelf: "center",
|
||||
|
|
@ -1026,28 +815,10 @@ export default function Home() {
|
|||
setModalOpen(true);
|
||||
}}
|
||||
>
|
||||
<CaretUpIcon size={32} />
|
||||
{studying ? <CaretUpIcon size={32} /> : <></>}
|
||||
</Pressable>
|
||||
</View>
|
||||
{student_status?.active && !student_status?.study_group ? (
|
||||
<Button
|
||||
onPress={() => {
|
||||
if (student_status?.subject) {
|
||||
navigation.navigate("Create Group", {
|
||||
location: {
|
||||
latitude: student_status?.location.latitude,
|
||||
longitude: student_status?.location.longitude,
|
||||
},
|
||||
subject: student_status?.subject,
|
||||
});
|
||||
}
|
||||
}}
|
||||
>
|
||||
<Text style={styles.text_white_tiny_bold}>Create Group</Text>
|
||||
</Button>
|
||||
) : (
|
||||
<></>
|
||||
)}
|
||||
|
||||
<View style={styles.padding} />
|
||||
</>
|
||||
);
|
||||
|
|
@ -1055,13 +826,12 @@ export default function Home() {
|
|||
return <MapRendererFar location={location.coords} dist={dist} />;
|
||||
}
|
||||
} else {
|
||||
requestLocationPermission();
|
||||
requestLocation();
|
||||
return (
|
||||
<>
|
||||
<View style={{ paddingVertical: 8 }} />
|
||||
<ActivityIndicator size={96} color={colors.secondary_1} />
|
||||
<Text style={styles.text_white_medium}>Loading...</Text>
|
||||
<Text style={styles.text_white_medium}>{feedback}</Text>
|
||||
<Button onPress={async () => await requestLocation()}>
|
||||
<Text style={styles.text_white_medium}>Allow Access</Text>
|
||||
</Button>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
|
@ -1085,15 +855,14 @@ export default function Home() {
|
|||
>
|
||||
<DropdownIcon size={32} />
|
||||
</Pressable>
|
||||
<View style={styles.flex_column}>
|
||||
<Text style={styles.text_white_medium}>List View</Text>
|
||||
<View style={styles.flex_row}>
|
||||
<Switch
|
||||
value={modalByGroup}
|
||||
onChange={() => {
|
||||
setModalByGroup(!modalByGroup);
|
||||
}}
|
||||
style={{ alignSelf: "center" }}
|
||||
/>
|
||||
<Text style={styles.text_white_medium}>List View</Text>
|
||||
</View>
|
||||
|
||||
<ScrollView>
|
||||
|
|
@ -1112,7 +881,6 @@ export default function Home() {
|
|||
borderWidth: 1,
|
||||
borderRadius: 16,
|
||||
width: 256,
|
||||
marginVertical: 4,
|
||||
}}
|
||||
>
|
||||
<Text style={styles.text_white_tiny_bold}>
|
||||
|
|
@ -1124,20 +892,6 @@ export default function Home() {
|
|||
<Text style={styles.text_white_tiny_bold}>
|
||||
{`${Math.round(student_status.distance * 1000)}m away`}
|
||||
</Text>
|
||||
{location && location.coords ? (
|
||||
<Text style={styles.text_black_tiny}>
|
||||
{`${Math.round(
|
||||
GetDistance(
|
||||
student_status.location.latitude,
|
||||
student_status.location.longitude,
|
||||
location.coords.latitude,
|
||||
location.coords.longitude
|
||||
)
|
||||
)}m away`}
|
||||
</Text>
|
||||
) : (
|
||||
<></>
|
||||
)}
|
||||
</View>
|
||||
);
|
||||
}
|
||||
|
|
@ -1159,19 +913,11 @@ export default function Home() {
|
|||
borderWidth: 1,
|
||||
borderRadius: 16,
|
||||
width: 256,
|
||||
marginVertical: 4,
|
||||
}}
|
||||
>
|
||||
<Text style={styles.text_white_tiny_bold}>
|
||||
Group Name: {studygroup.name}
|
||||
</Text>
|
||||
{studygroup.landmark ? (
|
||||
<Text style={styles.text_white_tiny_bold}>
|
||||
{studygroup.landmark}
|
||||
</Text>
|
||||
) : (
|
||||
<></>
|
||||
)}
|
||||
<Text style={styles.text_white_tiny_bold}>
|
||||
{`Studying ${studygroup.subject}`}
|
||||
</Text>
|
||||
|
|
@ -1185,48 +931,6 @@ 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,
|
||||
});
|
||||
navigation.navigate("Conversation");
|
||||
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>
|
||||
);
|
||||
})
|
||||
|
|
@ -1236,143 +940,8 @@ export default function Home() {
|
|||
</ScrollView>
|
||||
</AnimatedContainer>
|
||||
</Modal>
|
||||
<Modal
|
||||
coverScreen={false}
|
||||
isVisible={modalOpen && !studying}
|
||||
style={{ opacity: 0.85 }}
|
||||
hasBackdrop={false}
|
||||
>
|
||||
<AnimatedContainer>
|
||||
<Pressable
|
||||
style={{
|
||||
alignContent: "flex-start",
|
||||
backgroundColor: colors.secondary_3,
|
||||
borderRadius: 16,
|
||||
}}
|
||||
onPress={() => setModalOpen(false)}
|
||||
>
|
||||
<DropdownIcon size={32} />
|
||||
</Pressable>
|
||||
<View style={styles.flex_column}>
|
||||
<Text style={styles.text_white_medium}>List View</Text>
|
||||
<Switch
|
||||
value={modalByGroup}
|
||||
onChange={() => {
|
||||
setModalByGroup(!modalByGroup);
|
||||
}}
|
||||
style={{ alignSelf: "center" }}
|
||||
/>
|
||||
</View>
|
||||
|
||||
<ScrollView>
|
||||
{!modalByGroup ? (
|
||||
student_statuses_global.map(
|
||||
(student_status: StudentStatusFilterType, index: number) => {
|
||||
return (
|
||||
<View
|
||||
key={index}
|
||||
style={{
|
||||
alignContent: "center",
|
||||
alignSelf: "center",
|
||||
justifyContent: "center",
|
||||
backgroundColor: colors.secondary_3,
|
||||
borderColor: colors.primary_2,
|
||||
borderWidth: 1,
|
||||
borderRadius: 16,
|
||||
width: 256,
|
||||
marginVertical: 4,
|
||||
}}
|
||||
>
|
||||
<Text style={styles.text_white_tiny_bold}>
|
||||
Student: {student_status.user}
|
||||
</Text>
|
||||
<Text style={styles.text_white_tiny_bold}>
|
||||
{`Studying ${student_status.subject}`}
|
||||
</Text>
|
||||
{location && location.coords ? (
|
||||
<Text style={styles.text_white_tiny}>
|
||||
{`${Math.round(
|
||||
GetDistance(
|
||||
student_status.location.latitude,
|
||||
student_status.location.longitude,
|
||||
location.coords.latitude,
|
||||
location.coords.longitude
|
||||
)
|
||||
)}m away`}
|
||||
</Text>
|
||||
) : (
|
||||
<></>
|
||||
)}
|
||||
</View>
|
||||
);
|
||||
}
|
||||
)
|
||||
) : (
|
||||
<></>
|
||||
)}
|
||||
{modalByGroup ? (
|
||||
study_groups_global.map(
|
||||
(studygroup: StudyGroupType, index: number) => {
|
||||
return (
|
||||
<View
|
||||
key={index}
|
||||
style={{
|
||||
alignContent: "center",
|
||||
alignSelf: "center",
|
||||
justifyContent: "center",
|
||||
backgroundColor: colors.secondary_3,
|
||||
borderColor: colors.primary_2,
|
||||
borderWidth: 1,
|
||||
borderRadius: 16,
|
||||
width: 256,
|
||||
marginVertical: 4,
|
||||
}}
|
||||
>
|
||||
<Text style={styles.text_white_tiny_bold}>
|
||||
Group Name: {studygroup.name}
|
||||
</Text>
|
||||
{studygroup.landmark ? (
|
||||
<Text style={styles.text_white_tiny_bold}>
|
||||
{studygroup.landmark}
|
||||
</Text>
|
||||
) : (
|
||||
<></>
|
||||
)}
|
||||
<Text style={styles.text_white_tiny_bold}>
|
||||
{`Studying ${studygroup.subject}`}
|
||||
</Text>
|
||||
<Text style={styles.text_white_tiny_bold}>
|
||||
Students Studying: {studygroup.students.length}
|
||||
</Text>
|
||||
{location && location.coords ? (
|
||||
<Text style={styles.text_white_tiny}>
|
||||
{`${Math.round(
|
||||
GetDistance(
|
||||
studygroup.location.latitude,
|
||||
studygroup.location.longitude,
|
||||
location.coords.latitude,
|
||||
location.coords.longitude
|
||||
)
|
||||
)}m away`}
|
||||
</Text>
|
||||
) : (
|
||||
<></>
|
||||
)}
|
||||
</View>
|
||||
);
|
||||
}
|
||||
)
|
||||
) : (
|
||||
<></>
|
||||
)}
|
||||
</ScrollView>
|
||||
</AnimatedContainer>
|
||||
</Modal>
|
||||
|
||||
<AnimatedContainer>
|
||||
<View style={{ borderRadius: 16, overflow: "hidden" }}>
|
||||
<CustomMap />
|
||||
</View>
|
||||
</AnimatedContainer>
|
||||
</View>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -7,8 +7,8 @@ import {
|
|||
NativeSyntheticEvent,
|
||||
TextInputChangeEventData,
|
||||
} from "react-native";
|
||||
import { useDispatch, useSelector } from "react-redux";
|
||||
import { useEffect, useState } from "react";
|
||||
import { useDispatch } from "react-redux";
|
||||
import { useState } from "react";
|
||||
import LoginIcon from "../../icons/LoginIcon/LoginIcon";
|
||||
import Button from "../../components/Button/Button";
|
||||
import { useNavigation } from "@react-navigation/native";
|
||||
|
|
@ -22,23 +22,15 @@ import {
|
|||
unsetOnboarding,
|
||||
} from "../../features/redux/slices/StatusSlice/StatusSlice";
|
||||
import { useToast } from "react-native-toast-notifications";
|
||||
import { RootState } from "../../features/redux/Store/Store";
|
||||
|
||||
export default function Login() {
|
||||
const navigation = useNavigation<RootDrawerParamList>();
|
||||
const status = useSelector((state: RootState) => state.status);
|
||||
const [logging_in, setLoggingIn] = useState(false);
|
||||
const dispatch = useDispatch();
|
||||
const [creds, setCreds] = useState({
|
||||
username: "",
|
||||
password: "",
|
||||
});
|
||||
const toast = useToast();
|
||||
useEffect(() => {
|
||||
if (status.logged_in) {
|
||||
navigation.navigate("Home");
|
||||
}
|
||||
}, []);
|
||||
return (
|
||||
<View style={styles.background}>
|
||||
<AnimatedContainer>
|
||||
|
|
@ -77,7 +69,6 @@ export default function Login() {
|
|||
<View style={{ paddingVertical: 4 }} />
|
||||
<Button
|
||||
onPress={async () => {
|
||||
if (!logging_in) {
|
||||
await UserLogin({
|
||||
username: creds.username,
|
||||
password: creds.password,
|
||||
|
|
@ -120,9 +111,7 @@ export default function Login() {
|
|||
animationType: "slide-in",
|
||||
});
|
||||
}
|
||||
setLoggingIn(false);
|
||||
});
|
||||
}
|
||||
}}
|
||||
>
|
||||
<Text style={styles.text_white_small}>Login</Text>
|
||||
|
|
|
|||
|
|
@ -195,13 +195,7 @@ export default function Onboarding() {
|
|||
...styles.text_white_small_bold,
|
||||
...{ textAlign: "center" },
|
||||
}}
|
||||
modalContentContainerStyle={{
|
||||
backgroundColor: colors.primary_2,
|
||||
borderWidth: 0,
|
||||
zIndex: 1000,
|
||||
}}
|
||||
dropDownDirection="BOTTOM"
|
||||
listMode="MODAL"
|
||||
dropDownContainerStyle={{ backgroundColor: colors.primary_2 }}
|
||||
/>
|
||||
<DropDownPicker
|
||||
zIndex={2000}
|
||||
|
|
@ -221,13 +215,7 @@ export default function Onboarding() {
|
|||
...styles.text_white_small_bold,
|
||||
...{ textAlign: "center" },
|
||||
}}
|
||||
modalContentContainerStyle={{
|
||||
backgroundColor: colors.primary_2,
|
||||
borderWidth: 0,
|
||||
zIndex: 1000,
|
||||
}}
|
||||
dropDownDirection="BOTTOM"
|
||||
listMode="MODAL"
|
||||
dropDownContainerStyle={{ backgroundColor: colors.primary_2 }}
|
||||
/>
|
||||
<DropDownPicker
|
||||
zIndex={1000}
|
||||
|
|
@ -247,13 +235,7 @@ export default function Onboarding() {
|
|||
...styles.text_white_small_bold,
|
||||
...{ textAlign: "center" },
|
||||
}}
|
||||
modalContentContainerStyle={{
|
||||
backgroundColor: colors.primary_2,
|
||||
borderWidth: 0,
|
||||
zIndex: 1000,
|
||||
}}
|
||||
dropDownDirection="BOTTOM"
|
||||
listMode="MODAL"
|
||||
dropDownContainerStyle={{ backgroundColor: colors.primary_2 }}
|
||||
/>
|
||||
</MotiView>
|
||||
<MotiView
|
||||
|
|
|
|||
|
|
@ -17,14 +17,12 @@ import { UserRegister } from "../../components/Api/Api";
|
|||
import IsNumber from "../../components/IsNumber/IsNumber";
|
||||
import AnimatedContainer from "../../components/AnimatedContainer/AnimatedContainer";
|
||||
import { useToast } from "react-native-toast-notifications";
|
||||
import { ScrollView } from "react-native-gesture-handler";
|
||||
|
||||
export default function Register() {
|
||||
const navigation = useNavigation<RootDrawerParamList>();
|
||||
const toast = useToast();
|
||||
// const dispatch = useDispatch();
|
||||
// const creds = useSelector((state: RootState) => state.auth.creds);
|
||||
const [registering, setRegistering] = useState(false);
|
||||
const [user, setUser] = useState({
|
||||
first_name: "",
|
||||
last_name: "",
|
||||
|
|
@ -32,7 +30,6 @@ export default function Register() {
|
|||
username: "",
|
||||
email: "",
|
||||
password: "",
|
||||
confirm_password: "",
|
||||
});
|
||||
return (
|
||||
<View style={styles.background}>
|
||||
|
|
@ -124,25 +121,8 @@ export default function Register() {
|
|||
}}
|
||||
/>
|
||||
<View style={{ paddingVertical: 4 }} />
|
||||
<TextInput
|
||||
style={styles.text_input}
|
||||
placeholder="Confirm Password"
|
||||
placeholderTextColor={colors.text_default}
|
||||
secureTextEntry={true}
|
||||
value={user.confirm_password}
|
||||
autoCapitalize={"none"}
|
||||
onChange={(
|
||||
e: NativeSyntheticEvent<TextInputChangeEventData>
|
||||
): void => {
|
||||
setUser({ ...user, confirm_password: e.nativeEvent.text });
|
||||
}}
|
||||
/>
|
||||
<View style={{ paddingVertical: 4 }} />
|
||||
<Button
|
||||
onPress={async () => {
|
||||
if (!registering) {
|
||||
if (user.password === user.confirm_password) {
|
||||
setRegistering(true);
|
||||
await UserRegister({
|
||||
username: user.username,
|
||||
email: user.email,
|
||||
|
|
@ -150,7 +130,7 @@ export default function Register() {
|
|||
student_id_number: user.student_id_number,
|
||||
first_name: user.first_name,
|
||||
last_name: user.last_name,
|
||||
}).then((result: any) => {
|
||||
}).then((result) => {
|
||||
console.log(result);
|
||||
if (result[0]) {
|
||||
setUser({
|
||||
|
|
@ -175,26 +155,15 @@ export default function Register() {
|
|||
navigation.navigate("Login");
|
||||
}, 10000);
|
||||
} else {
|
||||
toast.show(JSON.parse(JSON.stringify(result[1])), {
|
||||
toast.show(JSON.stringify(result[1]), {
|
||||
type: "warning",
|
||||
placement: "top",
|
||||
duration: 6000,
|
||||
animationType: "slide-in",
|
||||
});
|
||||
}
|
||||
setRegistering(false);
|
||||
});
|
||||
} else {
|
||||
toast.show(
|
||||
"Password does not match confirm password. Please try again"
|
||||
),
|
||||
{
|
||||
type: "warning",
|
||||
placement: "top",
|
||||
duration: 6000,
|
||||
animationType: "slide-in",
|
||||
};
|
||||
}
|
||||
}
|
||||
}}
|
||||
>
|
||||
|
|
|
|||
|
|
@ -1,12 +1,6 @@
|
|||
import * as React from "react";
|
||||
import styles, { Viewport } from "../../styles";
|
||||
import {
|
||||
View,
|
||||
Text,
|
||||
ToastAndroid,
|
||||
Pressable,
|
||||
ActivityIndicator,
|
||||
} from "react-native";
|
||||
import { View, Text, ToastAndroid } from "react-native";
|
||||
import { useState } from "react";
|
||||
import {
|
||||
UserInfoReturnType,
|
||||
|
|
@ -30,8 +24,6 @@ import { urlProvider } from "../../components/Api/Api";
|
|||
import MapView, { UrlTile, Marker } from "react-native-maps";
|
||||
import { useNavigation } from "@react-navigation/native";
|
||||
import { useToast } from "react-native-toast-notifications";
|
||||
import CaretLeftIcon from "../../icons/CaretLeftIcon/CaretLeftIcon";
|
||||
import AnimatedContainer from "../../components/AnimatedContainer/AnimatedContainer";
|
||||
|
||||
export default function StartStudying({ route }: any) {
|
||||
const { location } = route.params;
|
||||
|
|
@ -80,18 +72,13 @@ export default function StartStudying({ route }: any) {
|
|||
onSuccess: () => {
|
||||
queryClient.invalidateQueries({ queryKey: ["user"] });
|
||||
queryClient.invalidateQueries({ queryKey: ["user_status"] });
|
||||
queryClient.invalidateQueries({ queryKey: ["user_status_list"] });
|
||||
queryClient.invalidateQueries({ queryKey: ["study_group_list"] });
|
||||
toast.show("You are now studying \n" + selected_subject, {
|
||||
type: "success",
|
||||
placement: "top",
|
||||
duration: 2000,
|
||||
animationType: "slide-in",
|
||||
});
|
||||
// Set a delay before going back to homepage to hopefully let the queries refresh in time
|
||||
setTimeout(() => {
|
||||
navigation.navigate("Home");
|
||||
}, 200);
|
||||
},
|
||||
onError: (error: Error) => {
|
||||
toast.show(String(error), {
|
||||
|
|
@ -103,24 +90,12 @@ export default function StartStudying({ route }: any) {
|
|||
},
|
||||
});
|
||||
|
||||
if (StudentInfo.isLoading) {
|
||||
return (
|
||||
<View style={styles.background}>
|
||||
<AnimatedContainer>
|
||||
<View style={{ paddingVertical: 8 }} />
|
||||
<ActivityIndicator size={96} color={colors.secondary_1} />
|
||||
<Text style={styles.text_white_medium}>Loading...</Text>
|
||||
</AnimatedContainer>
|
||||
</View>
|
||||
);
|
||||
}
|
||||
if (location && location.coords) {
|
||||
return (
|
||||
<View style={styles.background}>
|
||||
<AnimatedContainerNoScroll>
|
||||
<View style={{ zIndex: -1 }}>
|
||||
<View style={styles.padding} />
|
||||
<View style={{ borderRadius: 16, overflow: "hidden" }}>
|
||||
<MapView
|
||||
style={{
|
||||
height: Viewport.height * 0.4,
|
||||
|
|
@ -166,7 +141,6 @@ export default function StartStudying({ route }: any) {
|
|||
pinColor={colors.primary_1}
|
||||
/>
|
||||
</MapView>
|
||||
</View>
|
||||
<View style={styles.padding} />
|
||||
</View>
|
||||
<DropDownPicker
|
||||
|
|
@ -200,10 +174,6 @@ export default function StartStudying({ route }: any) {
|
|||
listMode="MODAL"
|
||||
/>
|
||||
<View style={styles.padding} />
|
||||
<View style={styles.flex_row}>
|
||||
<Pressable onPress={() => navigation.navigate("Home")}>
|
||||
<CaretLeftIcon size={32} />
|
||||
</Pressable>
|
||||
<Button
|
||||
onPress={() => {
|
||||
console.log({
|
||||
|
|
@ -225,7 +195,7 @@ export default function StartStudying({ route }: any) {
|
|||
>
|
||||
<Text style={styles.text_white_small}>Start Studying</Text>
|
||||
</Button>
|
||||
</View>
|
||||
<View style={styles.padding} />
|
||||
</AnimatedContainerNoScroll>
|
||||
</View>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
import * as React from "react";
|
||||
import styles from "../../styles";
|
||||
import { View, Text, ActivityIndicator } from "react-native";
|
||||
import { View, Text } from "react-native";
|
||||
import { useState } from "react";
|
||||
import {
|
||||
UserInfoReturnType,
|
||||
|
|
@ -26,9 +26,6 @@ import AnimatedContainerNoScroll from "../../components/AnimatedContainer/Animat
|
|||
import { useSelector } from "react-redux";
|
||||
import { RootState } from "../../features/redux/Store/Store";
|
||||
import { useToast } from "react-native-toast-notifications";
|
||||
import AnimatedContainer from "../../components/AnimatedContainer/AnimatedContainer";
|
||||
import Loading from "../Loading/Loading";
|
||||
import LoadingFeedback from "../../components/LoadingFeedback/LoadingFeedback";
|
||||
|
||||
export default function SubjectsPage() {
|
||||
const logged_in_user = useSelector((state: RootState) => state.user.user);
|
||||
|
|
@ -186,9 +183,7 @@ export default function SubjectsPage() {
|
|||
);
|
||||
}
|
||||
}
|
||||
if (StudentInfo.isLoading || Subjects.isLoading) {
|
||||
return <LoadingFeedback />;
|
||||
}
|
||||
|
||||
return (
|
||||
<View style={styles.background}>
|
||||
<AnimatedContainerNoScroll>
|
||||
|
|
|
|||
|
|
@ -7,7 +7,6 @@ import {
|
|||
NativeSyntheticEvent,
|
||||
TextInputChangeEventData,
|
||||
Pressable,
|
||||
ActivityIndicator,
|
||||
} from "react-native";
|
||||
import { useState } from "react";
|
||||
import {
|
||||
|
|
@ -43,9 +42,6 @@ import { setUser as setUserinState } from "../../features/redux/slices/UserSlice
|
|||
import * as ImagePicker from "expo-image-picker";
|
||||
import * as FileSystem from "expo-file-system";
|
||||
import { useToast } from "react-native-toast-notifications";
|
||||
import AnimatedContainer from "../../components/AnimatedContainer/AnimatedContainer";
|
||||
import Loading from "../Loading/Loading";
|
||||
import LoadingFeedback from "../../components/LoadingFeedback/LoadingFeedback";
|
||||
|
||||
export default function UserInfoPage() {
|
||||
const logged_in_user = useSelector((state: RootState) => state.user.user);
|
||||
|
|
@ -289,14 +285,7 @@ export default function UserInfoPage() {
|
|||
);
|
||||
}
|
||||
}
|
||||
if (
|
||||
StudentInfo.isLoading ||
|
||||
Semesters.isLoading ||
|
||||
yearlevel_query.isLoading ||
|
||||
course_query.isLoading
|
||||
) {
|
||||
return <LoadingFeedback />;
|
||||
}
|
||||
|
||||
return (
|
||||
<View style={styles.background}>
|
||||
<AnimatedContainerNoScroll>
|
||||
|
|
@ -350,7 +339,7 @@ export default function UserInfoPage() {
|
|||
</View>
|
||||
<View style={{ flex: 3 }}>
|
||||
<DropDownPicker
|
||||
zIndex={1000}
|
||||
zIndex={4000}
|
||||
open={yearLevelOpen}
|
||||
value={selected_yearlevel}
|
||||
items={year_levels}
|
||||
|
|
@ -372,7 +361,7 @@ export default function UserInfoPage() {
|
|||
}}
|
||||
dropDownContainerStyle={{
|
||||
backgroundColor: colors.primary_2,
|
||||
zIndex: 1000,
|
||||
zIndex: 4000,
|
||||
borderWidth: 0,
|
||||
}}
|
||||
dropDownDirection="TOP"
|
||||
|
|
@ -385,7 +374,7 @@ export default function UserInfoPage() {
|
|||
</View>
|
||||
<View style={{ flex: 3 }}>
|
||||
<DropDownPicker
|
||||
zIndex={2000}
|
||||
zIndex={3000}
|
||||
open={semesterOpen}
|
||||
value={selected_semester}
|
||||
items={semesters}
|
||||
|
|
@ -407,7 +396,7 @@ export default function UserInfoPage() {
|
|||
}}
|
||||
dropDownContainerStyle={{
|
||||
backgroundColor: colors.primary_2,
|
||||
zIndex: 2000,
|
||||
zIndex: 3000,
|
||||
borderWidth: 0,
|
||||
}}
|
||||
dropDownDirection="TOP"
|
||||
|
|
@ -420,7 +409,7 @@ export default function UserInfoPage() {
|
|||
</View>
|
||||
<View style={{ flex: 3 }}>
|
||||
<DropDownPicker
|
||||
zIndex={3000}
|
||||
zIndex={2000}
|
||||
open={courseOpen}
|
||||
value={selected_course}
|
||||
items={courses}
|
||||
|
|
@ -442,7 +431,7 @@ export default function UserInfoPage() {
|
|||
}}
|
||||
dropDownContainerStyle={{
|
||||
backgroundColor: colors.primary_2,
|
||||
zIndex: 3000,
|
||||
zIndex: 2000,
|
||||
borderWidth: 0,
|
||||
}}
|
||||
dropDownDirection="TOP"
|
||||
|
|
|
|||
|
|
@ -44,9 +44,8 @@ const styles = StyleSheet.create({
|
|||
justifyContent: "center",
|
||||
display: "flex",
|
||||
flexDirection: "column",
|
||||
flexGrow: 1,
|
||||
flex: 1,
|
||||
paddingHorizontal: 4,
|
||||
paddingVertical: 32,
|
||||
},
|
||||
flex_row: {
|
||||
display: "flex",
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue