119 lines
4.3 KiB
TypeScript
119 lines
4.3 KiB
TypeScript
import IP from "@/assets/icons/svg/ip.svg";
|
|
import { ThemedText } from "@/components/ThemedText";
|
|
import { Message } from "@/types/ask";
|
|
import { Dispatch, SetStateAction } from "react";
|
|
import { useTranslation } from "react-i18next";
|
|
import { ScrollView, StyleSheet, TouchableOpacity, View } from 'react-native';
|
|
import { createNewConversation, getConversation } from "./utils";
|
|
|
|
interface AskHelloProps {
|
|
setUserMessages: Dispatch<SetStateAction<Message[]>>;
|
|
setConversationId: Dispatch<SetStateAction<string | null>>;
|
|
setIsHello: Dispatch<SetStateAction<boolean>>;
|
|
}
|
|
export default function AskHello({ setUserMessages, setConversationId, setIsHello }: AskHelloProps) {
|
|
const { t } = useTranslation();
|
|
|
|
const handleCase = async (text: string) => {
|
|
setIsHello(false)
|
|
setUserMessages([
|
|
{
|
|
content: {
|
|
text: text
|
|
},
|
|
role: 'User',
|
|
timestamp: new Date().toISOString()
|
|
},
|
|
{
|
|
content: {
|
|
text: "keepSearchIng"
|
|
},
|
|
role: 'Assistant',
|
|
timestamp: new Date().toISOString()
|
|
}
|
|
]);
|
|
const data = await createNewConversation(text);
|
|
setConversationId(data);
|
|
const response = await getConversation({ session_id: data, user_text: text, material_ids: [] });
|
|
setUserMessages((prev: Message[]) => {
|
|
const newMessages = [...(prev || [])];
|
|
if (response) {
|
|
newMessages.push(response);
|
|
}
|
|
return newMessages.filter((item: Message) =>
|
|
item?.content?.text !== 'keepSearchIng'
|
|
);
|
|
});
|
|
}
|
|
return (
|
|
<View className="flex-1 bg-white w-full">
|
|
<ScrollView
|
|
contentContainerStyle={{
|
|
flexGrow: 1,
|
|
paddingHorizontal: 16,
|
|
paddingBottom: 20
|
|
}}
|
|
keyboardDismissMode="interactive"
|
|
keyboardShouldPersistTaps="handled"
|
|
>
|
|
<View className="items-center">
|
|
<ThemedText className="text-3xl font-bold text-center">
|
|
{t('ask.hi', { ns: 'ask' })}
|
|
{"\n"}
|
|
{t('ask.iAmMemo', { ns: 'ask' })}
|
|
</ThemedText>
|
|
<View className="-mt-10">
|
|
<IP />
|
|
</View>
|
|
<ThemedText className="!text-textPrimary text-center -mt-20">
|
|
{t('ask.ready', { ns: 'ask' })}
|
|
{"\n"}
|
|
{t('ask.justAsk', { ns: 'ask' })}
|
|
</ThemedText>
|
|
<View style={styles.caseContainer}>
|
|
<TouchableOpacity onPress={() => {
|
|
handleCase(t('ask:ask.case1'));
|
|
}}>
|
|
<ThemedText style={styles.case}>
|
|
{t('ask:ask.case1')}
|
|
</ThemedText>
|
|
</TouchableOpacity>
|
|
<TouchableOpacity onPress={() => {
|
|
handleCase(t('ask:ask.case2'));
|
|
}}>
|
|
<ThemedText style={styles.case}>
|
|
{t('ask:ask.case2')}
|
|
</ThemedText>
|
|
</TouchableOpacity>
|
|
<TouchableOpacity onPress={() => {
|
|
handleCase(t('ask:ask.case3'));
|
|
}}>
|
|
<ThemedText style={styles.case}>
|
|
{t('ask:ask.case3')}
|
|
</ThemedText>
|
|
</TouchableOpacity>
|
|
</View>
|
|
</View>
|
|
</ScrollView>
|
|
</View>
|
|
);
|
|
}
|
|
|
|
|
|
const styles = StyleSheet.create({
|
|
caseContainer: {
|
|
flexDirection: 'row',
|
|
flexWrap: 'wrap',
|
|
justifyContent: 'center',
|
|
gap: 8,
|
|
width: '100%',
|
|
marginTop: 16
|
|
},
|
|
case: {
|
|
borderWidth: 2,
|
|
borderColor: "#FFB645",
|
|
borderRadius: 24,
|
|
paddingHorizontal: 8,
|
|
width: 'auto'
|
|
}
|
|
}) |