function StressReliefChatbot({ onChatEnd }) { const [messages, setMessages] = React.useState([ { text: "Hey! How you doin' today?", sender: "bot" } ]); const [input, setInput] = React.useState(""); const [isStressed, setIsStressed] = React.useState(null); const [botStep, setBotStep] = React.useState(0); const handleSendMessage = ()=>{ if (input.trim()) { const newMessages = [ ...messages, { text: input, sender: "user" } ]; setMessages(newMessages); setInput(""); setTimeout(()=>{ const questions = [ "I'm really glad you're chatting with me. What's up?", "What exactly is on your mind right now that's buggin' you?", "How long has this been going on?", "Have you tried chillin' with some relaxation techniques?", "What usually cheers you up?", "Hope you feel awesome soon. Catch ya later!" ]; const botReply = { text: questions[botStep], sender: "bot" }; setMessages([ ...newMessages, botReply ]); if (botStep >= questions.length - 1) { setTimeout(onChatEnd, 1000); } else { setBotStep(botStep + 1); } }, 1000); } }; const handleStressResponse = (response)=>{ setIsStressed(response); }; if (isStressed === null) { return /*#__PURE__*/ React.createElement("div", { className: "w-full h-full flex flex-col items-center justify-center p-4 bg-gray-50", __source: { fileName: "", lineNumber: 41, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white shadow-lg rounded-lg p-4 w-[300px] text-center", __source: { fileName: "", lineNumber: 42, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-2xl font-roboto mb-4", __source: { fileName: "", lineNumber: 43, columnNumber: 11 }, __self: this }, "Feeling down lately?"), /*#__PURE__*/ React.createElement("div", { className: "text-lg font-roboto mb-4", __source: { fileName: "", lineNumber: 44, columnNumber: 11 }, __self: this }, "How about a little chat?"), /*#__PURE__*/ React.createElement("button", { className: "mb-2 w-full h-[40px] bg-blue-500 text-white font-roboto rounded-lg", onClick: ()=>handleStressResponse(true), __source: { fileName: "", lineNumber: 45, columnNumber: 11 }, __self: this }, "Sure"), /*#__PURE__*/ React.createElement("button", { className: "w-full h-[40px] bg-gray-300 text-black font-roboto rounded-lg", onClick: ()=>handleStressResponse(false), __source: { fileName: "", lineNumber: 51, columnNumber: 11 }, __self: this }, "Nah"))); } if (!isStressed) { return /*#__PURE__*/ React.createElement("div", { className: "w-full h-full flex items-center justify-center p-4 bg-gray-50", __source: { fileName: "", lineNumber: 64, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white shadow-lg rounded-lg p-4 w-[300px] text-center", __source: { fileName: "", lineNumber: 65, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-2xl font-roboto mb-4", __source: { fileName: "", lineNumber: 66, columnNumber: 11 }, __self: this }, "Okay, take care!"))); } return /*#__PURE__*/ React.createElement("div", { className: "w-full h-full flex flex-col items-center justify-center p-4 bg-gray-50", __source: { fileName: "", lineNumber: 73, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white shadow-lg rounded-lg p-4 w-[300px]", __source: { fileName: "", lineNumber: 74, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-2xl font-roboto text-center mb-4", __source: { fileName: "", lineNumber: 75, columnNumber: 9 }, __self: this }, "AI Chatbot"), /*#__PURE__*/ React.createElement("div", { className: "flex-1 h-[200px] overflow-y-auto p-2 border border-gray-200 rounded-lg", __source: { fileName: "", lineNumber: 76, columnNumber: 9 }, __self: this }, messages.map((message, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: `text-sm ${message.sender === "bot" ? "text-gray-700" : "text-blue-700"}`, __source: { fileName: "", lineNumber: 78, columnNumber: 13 }, __self: this }, message.text))), /*#__PURE__*/ React.createElement("input", { type: "text", name: "userMessage", value: input, onChange: (e)=>setInput(e.target.value), placeholder: "Type your message...", className: "mt-4 w-full h-[40px] p-2 border border-gray-200 rounded-lg", __source: { fileName: "", lineNumber: 86, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("button", { onClick: handleSendMessage, className: "mt-4 w-full h-[40px] bg-blue-500 text-white font-roboto rounded-lg", __source: { fileName: "", lineNumber: 94, columnNumber: 9 }, __self: this }, "Send"), /*#__PURE__*/ React.createElement("button", { onClick: onChatEnd, className: "mt-4 w-full h-[40px] bg-red-500 text-white font-roboto rounded-lg", __source: { fileName: "", lineNumber: 100, columnNumber: 9 }, __self: this }, "End Chat"))); } function StressReliefChatbotStory() { const handleChatEnd = ()=>{ alert('Chat ended. Hope you feel better!'); }; return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 117, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(StressReliefChatbot, { onChatEnd: handleChatEnd, __source: { fileName: "", lineNumber: 118, columnNumber: 7 }, __self: this })); } function MainComponent() { const [mood, setMood] = React.useState(""); const [moodHistory, setMoodHistory] = React.useState([]); const [exercise, setExercise] = React.useState(0); const [exerciseCompleted, setExerciseCompleted] = React.useState(false); const [waterIntake, setWaterIntake] = React.useState(0); const [waterCompleted, setWaterCompleted] = React.useState(false); const [streak, setStreak] = React.useState(0); const [dailyExerciseGoal, setDailyExerciseGoal] = React.useState(30); const [notifications, setNotifications] = React.useState({ exercise: "", water: "" }); const [monthStats, setMonthStats] = React.useState([]); const [isChatOpen, setIsChatOpen] = React.useState(false); const [isStressed, setIsStressed] = React.useState(null); const handleMoodSubmit = (event)=>{ event.preventDefault(); setMoodHistory([ ...moodHistory, mood ]); setMood(""); }; const handleExerciseSubmit = (event)=>{ event.preventDefault(); setExerciseCompleted(true); if (waterCompleted) setStreak(streak + 1); setNotifications({ ...notifications, exercise: "Time to exercise!" }); setMonthStats((prevStats)=>[ ...prevStats, { type: "exercise", date: new Date() } ]); }; const handleWaterSubmit = ()=>{ setWaterIntake(waterIntake + 1); if (waterIntake + 1 >= 8) { setWaterCompleted(true); if (exerciseCompleted) setStreak(streak + 1); } setMonthStats((prevStats)=>[ ...prevStats, { type: "water", date: new Date() } ]); }; const displayTips = moodHistory.slice(-7).every((m)=>m === "sad" || m === "stressed" || m === "anxious"); const handleStressResponse = (response)=>{ setIsStressed(response); if (response) setIsChatOpen(true); }; const handleChatEnd = ()=>{ setIsChatOpen(false); }; return /*#__PURE__*/ React.createElement("div", { className: "p-4 w-full max-w-[600px] mx-auto", __source: { fileName: "", lineNumber: 53, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-3xl font-bold mb-4 font-roboto", __source: { fileName: "", lineNumber: 54, columnNumber: 7 }, __self: this }, "High Schoolers' Health Tracker"), /*#__PURE__*/ React.createElement("div", { className: "mb-6", __source: { fileName: "", lineNumber: 55, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-semibold mb-2 font-roboto", __source: { fileName: "", lineNumber: 56, columnNumber: 9 }, __self: this }, "Daily Mood Tracker"), /*#__PURE__*/ React.createElement("form", { onSubmit: handleMoodSubmit, __source: { fileName: "", lineNumber: 57, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 58, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-lg font-medium mb-1 font-roboto", htmlFor: "mood", __source: { fileName: "", lineNumber: 59, columnNumber: 13 }, __self: this }, "How are you feeling today?"), /*#__PURE__*/ React.createElement("select", { name: "mood", id: "mood", value: mood, onChange: (e)=>setMood(e.target.value), className: "w-full p-2 border border-gray-300 rounded-md", __source: { fileName: "", lineNumber: 60, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "", disabled: true, __source: { fileName: "", lineNumber: 67, columnNumber: 15 }, __self: this }, "Select a mood"), /*#__PURE__*/ React.createElement("option", { value: "happy", __source: { fileName: "", lineNumber: 68, columnNumber: 15 }, __self: this }, "Happy"), /*#__PURE__*/ React.createElement("option", { value: "sad", __source: { fileName: "", lineNumber: 69, columnNumber: 15 }, __self: this }, "Sad"), /*#__PURE__*/ React.createElement("option", { value: "stressed", __source: { fileName: "", lineNumber: 70, columnNumber: 15 }, __self: this }, "Stressed"), /*#__PURE__*/ React.createElement("option", { value: "anxious", __source: { fileName: "", lineNumber: 71, columnNumber: 15 }, __self: this }, "Anxious"), /*#__PURE__*/ React.createElement("option", { value: "neutral", __source: { fileName: "", lineNumber: 72, columnNumber: 15 }, __self: this }, "Neutral"))), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "w-full py-2 px-4 bg-blue-500 text-white rounded-md font-roboto", __source: { fileName: "", lineNumber: 75, columnNumber: 11 }, __self: this }, "Submit")), displayTips && /*#__PURE__*/ React.createElement("div", { className: "mt-4 p-4 bg-yellow-200 rounded-md font-roboto", __source: { fileName: "", lineNumber: 78, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "font-semibold", __source: { fileName: "", lineNumber: 79, columnNumber: 13 }, __self: this }, "Mental Health Tips:"), /*#__PURE__*/ React.createElement("ul", { className: "list-disc list-inside", __source: { fileName: "", lineNumber: 80, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("li", { __source: { fileName: "", lineNumber: 81, columnNumber: 15 }, __self: this }, "Take deep breaths and practice mindfulness."), /*#__PURE__*/ React.createElement("li", { __source: { fileName: "", lineNumber: 82, columnNumber: 15 }, __self: this }, "Talk to a trusted friend or family member."), /*#__PURE__*/ React.createElement("li", { __source: { fileName: "", lineNumber: 83, columnNumber: 15 }, __self: this }, "Engage in physical activities or hobbies.")))), /*#__PURE__*/ React.createElement("div", { className: "mb-6", __source: { fileName: "", lineNumber: 88, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-semibold mb-2 font-roboto", __source: { fileName: "", lineNumber: 89, columnNumber: 9 }, __self: this }, "Exercise Reminders"), /*#__PURE__*/ React.createElement("form", { onSubmit: handleExerciseSubmit, __source: { fileName: "", lineNumber: 90, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 91, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-lg font-medium mb-1 font-roboto", htmlFor: "exercise", __source: { fileName: "", lineNumber: 92, columnNumber: 13 }, __self: this }, "How many minutes of exercise do you plan today?"), /*#__PURE__*/ React.createElement("input", { type: "number", name: "exercise", id: "exercise", value: dailyExerciseGoal, onChange: (e)=>setDailyExerciseGoal(e.target.value), className: "w-full p-2 border border-gray-300 rounded-md", __source: { fileName: "", lineNumber: 93, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "w-full py-2 px-4 bg-blue-500 text-white rounded-md font-roboto", __source: { fileName: "", lineNumber: 102, columnNumber: 11 }, __self: this }, "Submit")), /*#__PURE__*/ React.createElement("p", { className: "font-roboto mt-2", __source: { fileName: "", lineNumber: 104, columnNumber: 9 }, __self: this }, notifications.exercise), /*#__PURE__*/ React.createElement("p", { className: "font-roboto mt-2", __source: { fileName: "", lineNumber: 105, columnNumber: 9 }, __self: this }, exerciseCompleted ? "Exercise completed for today!" : "")), /*#__PURE__*/ React.createElement("div", { className: "mb-6", __source: { fileName: "", lineNumber: 107, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-semibold mb-2 font-roboto", __source: { fileName: "", lineNumber: 108, columnNumber: 9 }, __self: this }, "Water Intake Reminders"), /*#__PURE__*/ React.createElement("div", { className: "flex items-center", __source: { fileName: "", lineNumber: 109, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: handleWaterSubmit, className: "py-2 px-4 bg-blue-500 text-white rounded-md font-roboto", __source: { fileName: "", lineNumber: 110, columnNumber: 11 }, __self: this }, "Log Water Intake"), /*#__PURE__*/ React.createElement("p", { className: "font-roboto ml-4", __source: { fileName: "", lineNumber: 111, columnNumber: 11 }, __self: this }, `Water intake: ${waterIntake} / 8`)), /*#__PURE__*/ React.createElement("p", { className: "font-roboto mt-2", __source: { fileName: "", lineNumber: 113, columnNumber: 9 }, __self: this }, notifications.water), /*#__PURE__*/ React.createElement("p", { className: "font-roboto mt-2", __source: { fileName: "", lineNumber: 114, columnNumber: 9 }, __self: this }, waterCompleted ? "Water intake goal reached for today!" : "")), /*#__PURE__*/ React.createElement("div", { className: "mb-6", __source: { fileName: "", lineNumber: 116, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-semibold mb-2 font-roboto", __source: { fileName: "", lineNumber: 117, columnNumber: 9 }, __self: this }, "Streak"), /*#__PURE__*/ React.createElement("p", { className: "font-roboto", __source: { fileName: "", lineNumber: 118, columnNumber: 9 }, __self: this }, `Streak: ${streak} day(s)`)), /*#__PURE__*/ React.createElement("div", { className: "mb-6", __source: { fileName: "", lineNumber: 120, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-semibold mb-2 font-roboto", __source: { fileName: "", lineNumber: 121, columnNumber: 9 }, __self: this }, "Monthly Stats"), /*#__PURE__*/ React.createElement("div", { className: "font-roboto", __source: { fileName: "", lineNumber: 122, columnNumber: 9 }, __self: this }, monthStats.filter((stat)=>new Date() - new Date(stat.date) < 2592000000).map((stat, index)=>/*#__PURE__*/ React.createElement("div", { key: index, __source: { fileName: "", lineNumber: 124, columnNumber: 13 }, __self: this }, `${stat.type.charAt(0).toUpperCase() + stat.type.slice(1)} on ${new Date(stat.date).toLocaleDateString()}`)))), isStressed === null && /*#__PURE__*/ React.createElement("div", { className: "w-full h-full flex flex-col items-center justify-center p-4 bg-gray-50", __source: { fileName: "", lineNumber: 129, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white shadow-lg rounded-lg p-4 w-[300px] text-center", __source: { fileName: "", lineNumber: 130, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-2xl font-roboto mb-4", __source: { fileName: "", lineNumber: 131, columnNumber: 13 }, __self: this }, "Feeling stressed out?"), /*#__PURE__*/ React.createElement("div", { className: "text-lg font-roboto mb-4", __source: { fileName: "", lineNumber: 132, columnNumber: 13 }, __self: this }, "Wanna talk it out?"), /*#__PURE__*/ React.createElement("select", { className: "mb-2 w-full h-[40px] bg-blue-500 text-white font-roboto rounded-lg", onChange: (e)=>handleStressResponse(e.target.value === "yes"), __source: { fileName: "", lineNumber: 133, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "", disabled: true, __source: { fileName: "", lineNumber: 137, columnNumber: 15 }, __self: this }, "Select an option"), /*#__PURE__*/ React.createElement("option", { value: "yes", __source: { fileName: "", lineNumber: 138, columnNumber: 15 }, __self: this }, "Yes"), /*#__PURE__*/ React.createElement("option", { value: "no", __source: { fileName: "", lineNumber: 139, columnNumber: 15 }, __self: this }, "No")))), isChatOpen && /*#__PURE__*/ React.createElement(StressReliefChatbot, { onChatEnd: handleChatEnd, __source: { fileName: "", lineNumber: 144, columnNumber: 22 }, __self: this })); }