translation-terrace/components/ConversationThread.tsx
2025-02-01 08:58:03 -08:00

43 lines
1.2 KiB
TypeScript

import React, { useState, useEffect } from 'react';
import { View } from 'react-native';
import { Conversation, Message } from '@/app/lib/conversation';
import MessageBubble from '@/components/ui/MessageBubble';
import { NavigationProp, ParamListBase } from '@react-navigation/native';
import { language_matrix_entry, Translator } from '@/app/i18n/api';
import { getDb } from '@/app/lib/db';
interface ConversationThreadProps {
conversation: Conversation;
}
const ConversationThread = (p : ConversationThreadProps) => {
const [messages, setMessages] = useState<Message[]>([]);
useEffect(() => {
const updateMessages = (c : Conversation) => {
setMessages([...c]);
};
p.conversation.onAddMessage = updateMessages;
p.conversation.onTranslationDone = updateMessages;
return () => {
p.conversation.onAddMessage = undefined;
p.conversation.onTranslationDone = undefined;
};
}, [p.conversation]);
const renderMessages = () => (
messages.map((message, index) => (
<MessageBubble key={index} message={message} />
))
);
return (
<View style={{ flex: 1 }}>
{renderMessages()}
</View>
);
};
export default ConversationThread;