function NotesInputField({ placeholder, value, onChange }) { return /*#__PURE__*/ React.createElement("input", { type: "text", name: "botQuestion", className: "w-full p-4 border border-[#4a5568] rounded-md mb-8 focus:outline-none focus:border-[#9f7aea]", placeholder: placeholder, value: value, onChange: onChange, __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }); } function NotesInputFieldStory() { const [botQuestion, setBotQuestion] = React.useState(""); const handleBotQuestionChange = (event)=>{ setBotQuestion(event.target.value); }; return /*#__PURE__*/ React.createElement("div", { className: "p-6", __source: { fileName: "", lineNumber: 22, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(NotesInputField, { placeholder: "Ask something about your notes...", value: botQuestion, onChange: handleBotQuestionChange, __source: { fileName: "", lineNumber: 23, columnNumber: 7 }, __self: this })); } function MainComponent() { const currentDate = new Date().toLocaleDateString(); const [entry, setEntry] = React.useState(""); const [savedEntries, setSavedEntries] = React.useState([]); const [chatBotResponse, setChatBotResponse] = React.useState(""); const [botQuestion, setBotQuestion] = React.useState(""); const analyzeEntryContent = async (entries)=>{ const messages = entries.map((entry)=>({ role: "user", content: entry.content })); const response = await fetch('/api/analyze', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ messages: messages }) }); const data = await response.json(); if (data && data.answer) { setChatBotResponse(data.answer); } else { setChatBotResponse("Sorry, I couldn't analyze the entries at the moment."); } }; const handleEntryChange = (event)=>{ setEntry(event.target.value); }; const handleSubmit = async (event)=>{ event.preventDefault(); if (entry.trim()) { const newEntries = [ ...savedEntries, { date: currentDate, content: entry } ]; setSavedEntries(newEntries); setEntry(""); await analyzeEntryContent(newEntries); } }; const handleBotQuestionChange = (event)=>{ setBotQuestion(event.target.value); }; const handleBotQuery = async (event)=>{ event.preventDefault(); const matchingEntries = savedEntries.filter((entry)=>entry.content.toLowerCase().includes(botQuestion.toLowerCase())); if (matchingEntries.length) { setChatBotResponse(`Based on your entry, ${matchingEntries.map((entry)=>entry.content).join(", ")}`); } else { setChatBotResponse("No matching entries found."); } setBotQuestion(""); }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-gradient-to-br from-[#134E5E] to-[#71B280] p-8 flex flex-wrap justify-center items-start", __source: { fileName: "", lineNumber: 57, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex-1 flex flex-col items-center overflow-auto", __source: { fileName: "", lineNumber: 58, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-6xl font-bold text-[#FFD700] mb-8", __source: { fileName: "", lineNumber: 59, columnNumber: 9 }, __self: this }, "✨ My Magical Diary ✨"), /*#__PURE__*/ React.createElement("div", { className: "w-full max-w-[600px] bg-[#fff7f3]/90 backdrop-blur-lg shadow-xl shadow-[#fde2e4] rounded-xl p-10 mb-10 flex flex-col items-center", __source: { fileName: "", lineNumber: 60, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: "diary_cover.png", alt: "Enchanted diary cover", className: "w-[300px] h-[200px] mb-8 rounded-lg", __source: { fileName: "", lineNumber: 61, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "mb-8 w-full", __source: { fileName: "", lineNumber: 62, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-2xl font-semibold text-[#7F00FF] text-center", __source: { fileName: "", lineNumber: 63, columnNumber: 13 }, __self: this }, "Today's Magical Moments"), /*#__PURE__*/ React.createElement("p", { className: "text-lg text-gray-900 text-center", __source: { fileName: "", lineNumber: 64, columnNumber: 13 }, __self: this }, currentDate)), /*#__PURE__*/ React.createElement("form", { onSubmit: handleSubmit, className: "w-full", __source: { fileName: "", lineNumber: 66, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("textarea", { name: "diaryEntry", className: "w-full p-5 h-[250px] border border-[#FFC0CB] rounded-lg resize-none focus:outline-none focus:border-[#FF69B4]", placeholder: "Your enchanted experiences...", value: entry, onChange: handleEntryChange, __source: { fileName: "", lineNumber: 67, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "mt-5 px-8 py-4 bg-[#BA55D3] text-white font-semibold rounded-lg w-full", __source: { fileName: "", lineNumber: 74, columnNumber: 13 }, __self: this }, "Log Today's Wonders"))), /*#__PURE__*/ React.createElement("div", { className: "w-full max-w-[600px]", __source: { fileName: "", lineNumber: 82, columnNumber: 9 }, __self: this }, savedEntries.map((savedEntry, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: "bg-[#CAF0F8]/90 backdrop-blur-lg shadow-lg shadow-[#adb5bd] rounded-xl p-8 mb-8 flex flex-col items-center", __source: { fileName: "", lineNumber: 84, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: `moment_${index % 5 + 1}.png`, alt: `Memory of moment ${index + 1}`, className: "w-[260px] mb-8 rounded-lg", __source: { fileName: "", lineNumber: 85, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("p", { className: "text-xl font-semibold text-[#0096C7] mb-4", __source: { fileName: "", lineNumber: 86, columnNumber: 15 }, __self: this }, "Memory ", index + 1, " - ", savedEntry.date), /*#__PURE__*/ React.createElement("p", { className: "text-gray-900", __source: { fileName: "", lineNumber: 87, columnNumber: 15 }, __self: this }, savedEntry.content))))), /*#__PURE__*/ React.createElement("div", { className: "w-[420px] bg-[#FFE5D9] backdrop-blur-lg shadow-xl shadow-[#f8edeb] rounded-xl p-10", __source: { fileName: "", lineNumber: 92, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-5xl font-bold text-[#FF007F] mb-10", __source: { fileName: "", lineNumber: 93, columnNumber: 9 }, __self: this }, "Diary Oracle 🌟"), /*#__PURE__*/ React.createElement("p", { className: "mb-6", __source: { fileName: "", lineNumber: 94, columnNumber: 9 }, __self: this }, chatBotResponse), /*#__PURE__*/ React.createElement("form", { onSubmit: handleBotQuery, className: "mt-8", __source: { fileName: "", lineNumber: 95, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement(NotesInputField, { placeholder: "Ask something about your notes...", value: botQuestion, onChange: handleBotQuestionChange, __source: { fileName: "", lineNumber: 96, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "px-6 py-4 bg-[#ffafcc] text-white font-bold rounded-lg w-full", __source: { fileName: "", lineNumber: 101, columnNumber: 11 }, __self: this }, "Seek Insights")))); }