Aktualizovat sk1/frontend/src/components/ChatInput.jsx

This commit is contained in:
Tetiana Mohorian 2025-04-28 23:03:09 +00:00
parent d99451c165
commit 1e770c1c5a

View File

@ -1,51 +1,67 @@
import React, { useState } from 'react'; import React, { useState } from 'react';
import { Send } from 'lucide-react'; import { Send } from 'lucide-react';
const ChatInput = ({ onSubmit }) => { const ChatInput = ({ onSubmit }) => {
const [input, setInput] = useState(''); const [input, setInput] = useState('');
const [error, setError] = useState('');
const handleSubmit = async (e) => {
e.preventDefault(); const handleSubmit = async (e) => {
console.log("Formulár bol odoslaný!", input); // Добавили лог e.preventDefault();
if (input.trim()) { setError(""); // reset chyby
try {
const response = await fetch("https://hate-backend-production.up.railway.app/api/predict", { if (input.trim()) {
method: "POST", try {
headers: { "Content-Type": "application/json" }, const response = await fetch("https://hate-backend-production.up.railway.app/api/predict", {
body: JSON.stringify({ text: input }), method: "POST",
}); headers: { "Content-Type": "application/json" },
const data = await response.json(); body: JSON.stringify({ text: input }),
//alert(`Výsledok analýzy: ${data.prediction}`); });
if (onSubmit) const data = await response.json();
{
onSubmit(input, data.prediction); if (!response.ok) {
} setError(data.error || "Chyba pri analýze textu.");
setInput(''); return;
} catch (error) { }
console.error("Ошибка запроса:", error);
alert("Chyba pri analýze textu!"); if (onSubmit) {
} onSubmit(input, data.prediction);
} }
};
setInput('');
} catch (error) {
return ( console.error("Chyba požiadavky:", error);
<div className="input-container"> setError("Nepodarilo sa spojiť so serverom.");
<form onSubmit={handleSubmit} className="input-wrapper"> }
<input } else {
type="text" setError("Text nesmie byť prázdny.");
value={input} }
onChange={(e) => setInput(e.target.value)} };
placeholder="Zadajte text na analýzu"
className="text-input" return (
/> <div className="input-container">
<button type="submit" className="submit-button"> <form onSubmit={handleSubmit} className="input-wrapper">
<Send size={24} /> <input
</button> type="text"
</form> value={input}
</div> onChange={(e) => setInput(e.target.value)}
); placeholder="Zadajte text na analýzu"
}; className="text-input"
/>
export default ChatInput; <button type="submit" className="submit-button" title="Spustiť analýzu">
<Send size={24} />
</button>
</form>
{error && (
<div className="mt-8 text-red-500 font-semibold text-center">
{error}
</div>
)}
</div>
);
};
export default ChatInput;