function MainComponent() { const [error, setError] = useState(null); const [upload, { loading: uploading }] = useUpload(); const [file, setFile] = useState(null); const [image, setImage] = useState(null); const [response, setResponse] = useState(""); const [analyzing, setAnalyzing] = useState(false); const handleImageUpload = useCallback(async ()=>{ const { url, error, base64 } = await upload({ file }); if (error) { setError(error); return; } setImage(base64); analyzeImage(base64); }, [ file ]); const analyzeImage = useCallback(async (imageData)=>{ if (!imageData) return; setAnalyzing(true); try { const result = await fetch("/integrations/gpt-vision/", { method: "POST", body: JSON.stringify({ messages: [ { role: "user", content: [ { type: "text", text: "Bu görselde hangi metinleri görüyorsunuz?" }, { type: "image_url", image_url: { url: imageData } } ] } ] }) }); const data = await result.json(); setResponse(data.choices[0].message.content); } catch (err) { setError("Bir hata oluştu"); } setAnalyzing(false); }, []); return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-gray-50 p-8", __source: { fileName: "", lineNumber: 51, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-2xl mx-auto space-y-8", __source: { fileName: "", lineNumber: 52, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-xl shadow-sm p-6", __source: { fileName: "", lineNumber: 53, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 54, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "border-2 border-dashed border-gray-300 rounded-lg p-8 text-center", __source: { fileName: "", lineNumber: 55, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "file", accept: "image/*", onChange: (e)=>e.target.files && setFile(e.target.files[0]), className: "hidden", id: "fileInput", __source: { fileName: "", lineNumber: 56, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("label", { htmlFor: "fileInput", className: "cursor-pointer", __source: { fileName: "", lineNumber: 63, columnNumber: 15 }, __self: this }, image ? /*#__PURE__*/ React.createElement("img", { src: image, alt: "Yüklenen görsel", className: "max-h-[300px] mx-auto rounded-lg", __source: { fileName: "", lineNumber: 65, columnNumber: 19 }, __self: this }) : /*#__PURE__*/ React.createElement("div", { className: "space-y-2", __source: { fileName: "", lineNumber: 71, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-cloud-upload-alt text-3xl text-gray-400", __source: { fileName: "", lineNumber: 72, columnNumber: 21 }, __self: this }), /*#__PURE__*/ React.createElement("p", { className: "text-gray-500", __source: { fileName: "", lineNumber: 73, columnNumber: 21 }, __self: this }, "Görsel yüklemek için tıklayın"))), !image && file && /*#__PURE__*/ React.createElement("button", { onClick: handleImageUpload, disabled: uploading, className: "mt-4 bg-blue-500 text-white px-4 py-2 rounded-lg hover:bg-blue-600 transition-colors", __source: { fileName: "", lineNumber: 80, columnNumber: 17 }, __self: this }, uploading ? "Yükleniyor..." : "Yükle")), /*#__PURE__*/ React.createElement("button", { onClick: analyzeImage, disabled: !image || analyzing, className: "w-full bg-blue-500 text-white px-4 py-2 rounded-lg hover:bg-blue-600 transition-colors disabled:bg-gray-300", __source: { fileName: "", lineNumber: 90, columnNumber: 13 }, __self: this }, analyzing ? "Metin Çıkarılıyor..." : "Metni Çıkar"))), error && /*#__PURE__*/ React.createElement("div", { className: "bg-red-50 text-red-500 p-4 rounded-lg", __source: { fileName: "", lineNumber: 101, columnNumber: 11 }, __self: this }, error), response && /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-xl shadow-sm p-6", __source: { fileName: "", lineNumber: 105, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "font-medium mb-2", __source: { fileName: "", lineNumber: 106, columnNumber: 13 }, __self: this }, "AI'nin Yanıtı:"), /*#__PURE__*/ React.createElement("p", { className: "text-gray-700 whitespace-pre-wrap", __source: { fileName: "", lineNumber: 107, columnNumber: 13 }, __self: this }, response)))); }