mirror of
https://github.com/lemeow125/StudE-Frontend.git
synced 2024-11-16 22:09:26 +08:00
Added enter button to conversation page and fixed error not properly displaying when sending an invalid message. Also added refresh interval of 20 seconds to study group query in conversations page to automatically refresh students count
This commit is contained in:
parent
88d8ce05b8
commit
a65a3a84aa
3 changed files with 70 additions and 22 deletions
|
|
@ -3,7 +3,7 @@ import { IconProps } from "../../interfaces/Interfaces";
|
|||
import { Svg, Path } from "react-native-svg";
|
||||
import { colors } from "../../styles";
|
||||
|
||||
export default function CaretLeftIcon(props: IconProps) {
|
||||
export default function CaretRightIcon(props: IconProps) {
|
||||
return (
|
||||
<>
|
||||
<Svg
|
||||
|
|
@ -18,9 +18,9 @@ export default function CaretLeftIcon(props: IconProps) {
|
|||
>
|
||||
<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"
|
||||
d="M9 6c0 -.852 .986 -1.297 1.623 -.783l.084 .076l6 6a1 1 0 0 1 .083 1.32l-.083 .094l-6 6l-.094 .083l-.077 .054l-.096 .054l-.036 .017l-.067 .027l-.108 .032l-.053 .01l-.06 .01l-.057 .004l-.059 .002l-.059 -.002l-.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 -12.059z"
|
||||
stroke-width="0"
|
||||
fill={colors.icon_color}
|
||||
fill="currentColor"
|
||||
></Path>
|
||||
</Svg>
|
||||
</>
|
||||
|
|
|
|||
28
src/icons/CaretRightIcon/CaretLeftIcon.tsx
Normal file
28
src/icons/CaretRightIcon/CaretLeftIcon.tsx
Normal file
|
|
@ -0,0 +1,28 @@
|
|||
import * as React from "react";
|
||||
import { IconProps } from "../../interfaces/Interfaces";
|
||||
import { Svg, Path } from "react-native-svg";
|
||||
import { colors } from "../../styles";
|
||||
|
||||
export default function CaretLeftIcon(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,5 +1,5 @@
|
|||
import * as React from "react";
|
||||
import { ActivityIndicator, Image } from "react-native";
|
||||
import { ActivityIndicator, Image, Pressable } from "react-native";
|
||||
import styles from "../../styles";
|
||||
import {
|
||||
View,
|
||||
|
|
@ -36,6 +36,7 @@ import AnimatedContainer from "../../components/AnimatedContainer/AnimatedContai
|
|||
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();
|
||||
|
|
@ -70,6 +71,7 @@ export default function ConversationPage() {
|
|||
enabled:
|
||||
student_status?.study_group != "" && student_status?.study_group != null,
|
||||
queryKey: ["study_group"],
|
||||
refetchInterval: 20,
|
||||
queryFn: async () => {
|
||||
const data = await GetStudyGroup(student_status?.study_group || "");
|
||||
if (data[0] == false) {
|
||||
|
|
@ -162,7 +164,7 @@ export default function ConversationPage() {
|
|||
mutationFn: async (info: MessagePostType) => {
|
||||
const data = await PostMessage(info);
|
||||
if (data[0] != true) {
|
||||
return Promise.reject(new Error());
|
||||
return Promise.reject(new Error(data[1]));
|
||||
}
|
||||
return data;
|
||||
},
|
||||
|
|
@ -293,6 +295,7 @@ 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..."
|
||||
|
|
@ -310,6 +313,23 @@ 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>
|
||||
);
|
||||
|
|
|
|||
Loading…
Reference in a new issue