function MainComponent() { const [transactions, setTransactions] = useState([]); const [loading, setLoading] = useState(false); const [uploadProgress, setUploadProgress] = useState(0); const [selectedCategory, setSelectedCategory] = useState(null); const [streamingMessage, setStreamingMessage] = useState(""); const [messages, setMessages] = useState([]); const [chatInput, setChatInput] = useState(""); const [error, setError] = useState(null); const [processingStatus, setProcessingStatus] = useState(""); const [upload, { loading: uploading }] = useUpload(); const validateTransactionData = (data)=>{ console.log("Validating transaction data:", data); if (!Array.isArray(data?.transactions)) { console.error("Invalid data structure: transactions is not an array"); return false; } const isValid = data.transactions.every((t)=>{ const valid = typeof t?.id === "number" && typeof t?.date === "string" && typeof t?.description === "string" && typeof t?.amount === "number" && typeof t?.category === "string" && typeof t?.type === "string"; if (!valid) { console.error("Invalid transaction:", t); } return valid; }); console.log("Transaction validation result:", isValid); return isValid; }; const handleStreamResponse = useHandleStreamResponse({ onChunk: (chunk)=>{ console.log("Received stream chunk"); setStreamingMessage(chunk); }, onFinish: (message)=>{ console.log("Stream completed"); setMessages((prev)=>[ ...prev, { role: "assistant", content: message } ]); setStreamingMessage(""); setChatInput(""); } }); const categories = useMemo(()=>{ console.log("Recalculating categories"); const grouped = transactions.reduce((acc, t)=>{ if (!acc[t.category]) acc[t.category] = { total: 0, transactions: [] }; acc[t.category].total += t.amount; acc[t.category].transactions.push(t); return acc; }, {}); return grouped; }, [ transactions ]); const totalIncome = useMemo(()=>{ const total = transactions.filter((t)=>t.amount > 0).reduce((sum, t)=>sum + t.amount, 0); console.log("Total income calculated:", total); return total; }, [ transactions ]); const totalExpenses = useMemo(()=>{ const total = transactions.filter((t)=>t.amount < 0).reduce((sum, t)=>sum + Math.abs(t.amount), 0); console.log("Total expenses calculated:", total); return total; }, [ transactions ]); const handleFileProcess = async (file)=>{ console.log("Starting file processing"); setLoading(true); setUploadProgress(0); setError(null); setProcessingStatus("Initializing..."); try { setProcessingStatus("Uploading file..."); setUploadProgress(25); const { url, error: uploadError } = await upload({ file }); if (uploadError) throw new Error(uploadError); setProcessingStatus("Processing statement..."); setUploadProgress(50); const response = await fetch("/api/process-statement", { method: "POST", body: JSON.stringify({ url }), headers: { "Content-Type": "application/json" } }); setUploadProgress(75); setProcessingStatus("Validating data..."); if (!response.ok) { throw new Error(`Failed to process statement: ${response.statusText}`); } const data = await response.json(); if (!validateTransactionData(data)) { throw new Error("Invalid transaction data received"); } setTransactions(data.transactions); setMessages([]); setUploadProgress(100); setProcessingStatus("Complete!"); } catch (error) { setError(error.message); setTransactions([]); setProcessingStatus("Failed!"); } finally{ setTimeout(()=>{ setLoading(false); setUploadProgress(0); setProcessingStatus(""); }, 1000); } }; const handleCategoryChange = (transactionId, newCategory)=>{ if (!newCategory?.trim()) return; setTransactions((prev)=>prev.map((t)=>t.id === transactionId ? { ...t, category: newCategory } : t)); }; const askAI = async ()=>{ if (!chatInput.trim()) return; try { const response = await fetch("/integrations/chat-gpt/conversationgpt4", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ messages: [ ...messages, { role: "user", content: chatInput } ], stream: true }) }); if (!response.ok) { throw new Error("Failed to get AI response"); } handleStreamResponse(response); } catch (error) { setError("Failed to get AI response. Please try again."); } }; if (!transactions.length) { return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-gradient-to-b from-[#1a1b1e] to-[#25262b] text-white", __source: { fileName: "", lineNumber: 160, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mx-auto max-w-7xl px-6 py-24", __source: { fileName: "", lineNumber: 161, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-center", __source: { fileName: "", lineNumber: 162, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "mb-6 font-roboto text-5xl font-bold", __source: { fileName: "", lineNumber: 163, columnNumber: 13 }, __self: this }, "Smart Financial Analysis"), /*#__PURE__*/ React.createElement("p", { className: "mx-auto mb-12 max-w-2xl font-roboto text-lg text-[#a1a1aa]", __source: { fileName: "", lineNumber: 166, columnNumber: 13 }, __self: this }, "Upload your bank statement and let AI analyze your spending patterns, categorize transactions, and provide personalized insights.")), /*#__PURE__*/ React.createElement("div", { className: "mx-auto mb-12 max-w-xl", __source: { fileName: "", lineNumber: 172, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "rounded-xl bg-gradient-to-r from-[#2563eb] to-[#3b82f6] p-[1px]", __source: { fileName: "", lineNumber: 173, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "rounded-xl bg-[#25262b]", __source: { fileName: "", lineNumber: 174, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement(React.Fragment, null))), error && /*#__PURE__*/ React.createElement("div", { className: "mt-4 rounded-lg bg-red-500 p-4 text-white", __source: { fileName: "", lineNumber: 179, columnNumber: 15 }, __self: this }, error), loading && /*#__PURE__*/ React.createElement("div", { className: "mt-4 text-center font-roboto text-[#a1a1aa]", __source: { fileName: "", lineNumber: 184, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-2", __source: { fileName: "", lineNumber: 185, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-spinner fa-spin mr-2", __source: { fileName: "", lineNumber: 186, columnNumber: 19 }, __self: this }), processingStatus), /*#__PURE__*/ React.createElement("div", { className: "h-2 w-full rounded-full bg-[#2c2e33]", __source: { fileName: "", lineNumber: 189, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "h-full rounded-full bg-[#3b82f6] transition-all duration-300", style: { width: `${uploadProgress}%` }, __source: { fileName: "", lineNumber: 190, columnNumber: 19 }, __self: this })))), /*#__PURE__*/ React.createElement("div", { className: "grid gap-8 md:grid-cols-3", __source: { fileName: "", lineNumber: 198, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "rounded-xl bg-[#25262b] p-8 text-center", __source: { fileName: "", lineNumber: 199, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-chart-pie mb-4 text-4xl text-[#3b82f6]", __source: { fileName: "", lineNumber: 200, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("h3", { className: "mb-3 font-roboto text-xl font-bold", __source: { fileName: "", lineNumber: 201, columnNumber: 15 }, __self: this }, "Expense Tracking"), /*#__PURE__*/ React.createElement("p", { className: "text-[#a1a1aa]", __source: { fileName: "", lineNumber: 204, columnNumber: 15 }, __self: this }, "Automatically categorize and track your spending patterns")), /*#__PURE__*/ React.createElement("div", { className: "rounded-xl bg-[#25262b] p-8 text-center", __source: { fileName: "", lineNumber: 208, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-robot mb-4 text-4xl text-[#3b82f6]", __source: { fileName: "", lineNumber: 209, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("h3", { className: "mb-3 font-roboto text-xl font-bold", __source: { fileName: "", lineNumber: 210, columnNumber: 15 }, __self: this }, "AI Analysis"), /*#__PURE__*/ React.createElement("p", { className: "text-[#a1a1aa]", __source: { fileName: "", lineNumber: 213, columnNumber: 15 }, __self: this }, "Get personalized insights and recommendations from AI")), /*#__PURE__*/ React.createElement("div", { className: "rounded-xl bg-[#25262b] p-8 text-center", __source: { fileName: "", lineNumber: 217, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-chart-line mb-4 text-4xl text-[#3b82f6]", __source: { fileName: "", lineNumber: 218, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("h3", { className: "mb-3 font-roboto text-xl font-bold", __source: { fileName: "", lineNumber: 219, columnNumber: 15 }, __self: this }, "Visual Reports"), /*#__PURE__*/ React.createElement("p", { className: "text-[#a1a1aa]", __source: { fileName: "", lineNumber: 222, columnNumber: 15 }, __self: this }, "View your finances through intuitive charts and graphs"))))); } return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-gradient-to-b from-[#1a1b1e] to-[#25262b] p-6 text-white", __source: { fileName: "", lineNumber: 233, columnNumber: 5 }, __self: this }, error && /*#__PURE__*/ React.createElement("div", { className: "mb-4 rounded-lg bg-red-500 p-4 text-white", __source: { fileName: "", lineNumber: 235, columnNumber: 9 }, __self: this }, error), /*#__PURE__*/ React.createElement("div", { className: "mx-auto max-w-7xl space-y-8", __source: { fileName: "", lineNumber: 237, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 gap-6 md:grid-cols-2", __source: { fileName: "", lineNumber: 238, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "rounded-xl bg-[#25262b] p-6 shadow-lg transition-all duration-300 hover:shadow-xl", __source: { fileName: "", lineNumber: 239, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "font-roboto text-xl text-[#a1a1aa]", __source: { fileName: "", lineNumber: 240, columnNumber: 13 }, __self: this }, "Total Income"), /*#__PURE__*/ React.createElement("p", { className: "font-roboto text-3xl font-bold text-[#4ade80]", __source: { fileName: "", lineNumber: 241, columnNumber: 13 }, __self: this }, "$", totalIncome.toFixed(2))), /*#__PURE__*/ React.createElement("div", { className: "rounded-xl bg-[#25262b] p-6 shadow-lg transition-all duration-300 hover:shadow-xl", __source: { fileName: "", lineNumber: 245, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "font-roboto text-xl text-[#a1a1aa]", __source: { fileName: "", lineNumber: 246, columnNumber: 13 }, __self: this }, "Total Expenses"), /*#__PURE__*/ React.createElement("p", { className: "font-roboto text-3xl font-bold text-[#ef4444]", __source: { fileName: "", lineNumber: 249, columnNumber: 13 }, __self: this }, "$", totalExpenses.toFixed(2)))), /*#__PURE__*/ React.createElement("div", { className: "rounded-xl bg-[#25262b] p-6", __source: { fileName: "", lineNumber: 254, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement(React.Fragment, null)), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 gap-4 md:grid-cols-3 lg:grid-cols-4", __source: { fileName: "", lineNumber: 257, columnNumber: 9 }, __self: this }, Object.entries(categories).map(([category, data])=>/*#__PURE__*/ React.createElement("div", { key: category, onClick: ()=>setSelectedCategory(category), __source: { fileName: "", lineNumber: 259, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement(React.Fragment, null)))), /*#__PURE__*/ React.createElement("div", { className: "rounded-xl bg-[#25262b] p-6 shadow-lg", __source: { fileName: "", lineNumber: 264, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 265, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center space-x-4", __source: { fileName: "", lineNumber: 266, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", value: chatInput, onChange: (e)=>setChatInput(e.target.value), onKeyPress: (e)=>e.key === "Enter" && askAI(), className: "w-full rounded-lg border border-[#2c2e33] bg-[#1a1b1e] p-3 text-white placeholder-[#71717a] focus:border-[#3b82f6] focus:outline-none", placeholder: "Ask about your spending patterns...", __source: { fileName: "", lineNumber: 267, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("button", { onClick: askAI, disabled: !chatInput.trim(), className: "rounded-lg bg-gradient-to-r from-[#2563eb] to-[#3b82f6] px-6 py-3 font-roboto text-white transition-all hover:opacity-90 disabled:opacity-50", __source: { fileName: "", lineNumber: 275, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-robot mr-2", __source: { fileName: "", lineNumber: 280, columnNumber: 17 }, __self: this }), "Ask AI"))), /*#__PURE__*/ React.createElement("div", { className: "max-h-[300px] space-y-3 overflow-y-auto rounded-lg bg-[#1a1b1e] p-4", __source: { fileName: "", lineNumber: 285, columnNumber: 11 }, __self: this }, streamingMessage && /*#__PURE__*/ React.createElement("div", { className: "rounded-lg bg-[#25262b] p-4 font-roboto text-[#a1a1aa]", __source: { fileName: "", lineNumber: 287, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-spinner fa-spin mr-2", __source: { fileName: "", lineNumber: 288, columnNumber: 17 }, __self: this }), streamingMessage), messages.map((msg, idx)=>/*#__PURE__*/ React.createElement("div", { key: idx, className: "rounded-lg bg-[#25262b] p-4 font-roboto text-[#a1a1aa]", __source: { fileName: "", lineNumber: 293, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-comment-dots mr-2", __source: { fileName: "", lineNumber: 297, columnNumber: 17 }, __self: this }), msg.content)))), /*#__PURE__*/ React.createElement("div", { className: "rounded-xl bg-[#25262b] p-6 shadow-lg", __source: { fileName: "", lineNumber: 303, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "mb-4 font-roboto text-2xl text-white", __source: { fileName: "", lineNumber: 304, columnNumber: 11 }, __self: this }, "All Transactions"), /*#__PURE__*/ React.createElement("div", { className: "space-y-2", __source: { fileName: "", lineNumber: 307, columnNumber: 11 }, __self: this }, transactions.map((transaction)=>/*#__PURE__*/ React.createElement(React.Fragment, null))))), selectedCategory && /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 z-50 flex items-center justify-center bg-black bg-opacity-50 backdrop-blur-sm", __source: { fileName: "", lineNumber: 316, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement(React.Fragment, null))); }