Update frontend/src/components/ChatInterface.jsx
Browse files
frontend/src/components/ChatInterface.jsx
CHANGED
|
@@ -4,7 +4,7 @@ import Avatar from './Avatar.jsx';
|
|
| 4 |
import '../App.css';
|
| 5 |
|
| 6 |
const ChatInterface = ({ messages = [], setMessages = () => {}, onMessageSent = () => {}, activeConversationId,
|
| 7 |
-
saveBotResponse, toLogin, onCreateNewConversation = () => {},onNewChat = () => {} }) => {
|
| 8 |
const [inputMessage, setInputMessage] = useState('');
|
| 9 |
const [isLoading, setIsLoading] = useState(false);
|
| 10 |
const messagesEndRef = useRef(null);
|
|
@@ -72,31 +72,29 @@ saveBotResponse, toLogin, onCreateNewConversation = () => {},onNewChat = () => {
|
|
| 72 |
const sendMessage = async (message) => {
|
| 73 |
try {
|
| 74 |
setHasInteractionStarted(true);
|
| 75 |
-
|
| 76 |
setIsLoading(true);
|
| 77 |
|
| 78 |
setMessages(prev => [...prev, { sender: 'user', text: message }]);
|
| 79 |
|
| 80 |
const updatedConversationId = await onMessageSent(message);
|
| 81 |
|
| 82 |
-
const chatRes = await fetch('/api/chat', {
|
| 83 |
method: 'POST',
|
| 84 |
headers: { 'Content-Type': 'application/json' },
|
| 85 |
credentials: 'include',
|
| 86 |
body: JSON.stringify({
|
| 87 |
message,
|
| 88 |
-
conversation_id: activeConversationId
|
|
|
|
| 89 |
}),
|
| 90 |
});
|
| 91 |
|
| 92 |
const responseData = await chatRes.json();
|
| 93 |
|
| 94 |
-
// Vérifier si la limite de tokens est atteinte
|
| 95 |
if (responseData.error === 'token_limit_exceeded') {
|
| 96 |
setIsLoading(false);
|
| 97 |
setTokenLimitReached(true);
|
| 98 |
|
| 99 |
-
// Afficher un message à l'utilisateur
|
| 100 |
setMessages(prev => [...prev, {
|
| 101 |
sender: 'bot',
|
| 102 |
text: "⚠️ **Limite de taille de conversation atteinte**\n\nCette conversation est devenue trop longue. Pour continuer à discuter, veuillez créer une nouvelle conversation."
|
|
@@ -110,14 +108,19 @@ saveBotResponse, toLogin, onCreateNewConversation = () => {},onNewChat = () => {
|
|
| 110 |
const { response: botResponse } = responseData;
|
| 111 |
|
| 112 |
setIsLoading(false);
|
| 113 |
-
setMessages(prev => [...prev, { sender: 'bot-streaming', text: '' }]);
|
| 114 |
|
| 115 |
streamResponse(botResponse);
|
| 116 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 117 |
if (updatedConversationId) {
|
| 118 |
-
saveBotResponse(updatedConversationId, botResponse);
|
| 119 |
} else if (activeConversationId) {
|
| 120 |
-
saveBotResponse(activeConversationId, botResponse);
|
| 121 |
}
|
| 122 |
|
| 123 |
} catch (error) {
|
|
|
|
| 4 |
import '../App.css';
|
| 5 |
|
| 6 |
const ChatInterface = ({ messages = [], setMessages = () => {}, onMessageSent = () => {}, activeConversationId,
|
| 7 |
+
saveBotResponse, toLogin, onCreateNewConversation = () => {},onNewChat = () => {},refreshConversationList = () => {} }) => {
|
| 8 |
const [inputMessage, setInputMessage] = useState('');
|
| 9 |
const [isLoading, setIsLoading] = useState(false);
|
| 10 |
const messagesEndRef = useRef(null);
|
|
|
|
| 72 |
const sendMessage = async (message) => {
|
| 73 |
try {
|
| 74 |
setHasInteractionStarted(true);
|
|
|
|
| 75 |
setIsLoading(true);
|
| 76 |
|
| 77 |
setMessages(prev => [...prev, { sender: 'user', text: message }]);
|
| 78 |
|
| 79 |
const updatedConversationId = await onMessageSent(message);
|
| 80 |
|
| 81 |
+
const chatRes = await fetch('http://localhost:7860/api/chat', {
|
| 82 |
method: 'POST',
|
| 83 |
headers: { 'Content-Type': 'application/json' },
|
| 84 |
credentials: 'include',
|
| 85 |
body: JSON.stringify({
|
| 86 |
message,
|
| 87 |
+
conversation_id: activeConversationId,
|
| 88 |
+
skip_save: true
|
| 89 |
}),
|
| 90 |
});
|
| 91 |
|
| 92 |
const responseData = await chatRes.json();
|
| 93 |
|
|
|
|
| 94 |
if (responseData.error === 'token_limit_exceeded') {
|
| 95 |
setIsLoading(false);
|
| 96 |
setTokenLimitReached(true);
|
| 97 |
|
|
|
|
| 98 |
setMessages(prev => [...prev, {
|
| 99 |
sender: 'bot',
|
| 100 |
text: "⚠️ **Limite de taille de conversation atteinte**\n\nCette conversation est devenue trop longue. Pour continuer à discuter, veuillez créer une nouvelle conversation."
|
|
|
|
| 108 |
const { response: botResponse } = responseData;
|
| 109 |
|
| 110 |
setIsLoading(false);
|
|
|
|
| 111 |
|
| 112 |
streamResponse(botResponse);
|
| 113 |
|
| 114 |
+
|
| 115 |
+
|
| 116 |
+
if (activeConversationId && typeof refreshConversationList === 'function') {
|
| 117 |
+
refreshConversationList();
|
| 118 |
+
}
|
| 119 |
+
|
| 120 |
if (updatedConversationId) {
|
| 121 |
+
saveBotResponse(updatedConversationId, botResponse, true);
|
| 122 |
} else if (activeConversationId) {
|
| 123 |
+
saveBotResponse(activeConversationId, botResponse, true);
|
| 124 |
}
|
| 125 |
|
| 126 |
} catch (error) {
|