diff --git a/ChatPage.js b/ChatPage.js new file mode 100644 index 0000000000000000000000000000000000000000..529a86b1f1863e541e40b7e06a96a1eace6da7ca --- /dev/null +++ b/ChatPage.js @@ -0,0 +1,70 @@ +import React, { useState } from 'react'; +import { View, Text, TextInput, Button, ScrollView, StyleSheet } from 'react-native'; +import axios from 'axios'; + +const ChatPage = () => { + const [inputText, setInputText] = useState(''); + const [entities, setEntities] = useState([]); + + const handleSend = async () => { + try { + const response = await axios.post('http://10.0.2.2:3000/process', { text: inputText }); + console.log("Server response:", response.data); + const newEntities = response.data.entities || []; + setEntities(newEntities); + } catch (error) { + console.error("Error fetching entities:", error); + setEntities([]); + } + }; + + return ( + <View style={styles.container}> + <Text style={styles.header}>Chat Page</Text> + <TextInput + style={styles.input} + value={inputText} + onChangeText={setInputText} + placeholder="Type your message..." + /> + <Button title="Send" onPress={handleSend} /> + <Text style={styles.entitiesHeader}>Entities:</Text> + <ScrollView style={styles.entitiesList}> + {entities.map((entity, index) => ( + <Text key={index} style={styles.entityText}>{`${entity.text} (${entity.label})`}</Text> + ))} + </ScrollView> + </View> + ); +}; + +const styles = StyleSheet.create({ + container: { + padding: 20, + }, + header: { + fontSize: 20, + fontWeight: 'bold', + }, + input: { + borderWidth: 1, + borderColor: '#ddd', + padding: 10, + marginBottom: 10, + borderRadius: 5, + }, + entitiesHeader: { + marginTop: 20, + fontSize: 16, + fontWeight: 'bold', + }, + entitiesList: { + marginTop: 10, + }, + entityText: { + fontSize: 14, + marginBottom: 5, + }, +}); + +export default ChatPage; \ No newline at end of file