\n {/* Header */}\n

\n 🌿 Sage of the City\n

\n Your Urban Wellness Guide\n

\n\n {/* Quote of the moment */}\n {currentQuote && (\n

\"{currentQuote}\"

\n )}\n\n {/* Quick Actions */}\n

\n sendMessage(\"\", \"challenge\")}\n className=\"glass-effect rounded-xl p-4 text-white hover:bg-white/20 transition-all duration-300 transform hover:scale-105\"\n disabled={isLoading}\n >\n

🌱

Daily Challenge

Get a wellness challenge

\n \n \n sendMessage(\"\", \"nature\")}\n className=\"glass-effect rounded-xl p-4 text-white hover:bg-white/20 transition-all duration-300 transform hover:scale-105\"\n disabled={isLoading}\n >\n

🌳

Find Nature

Discover urban oases

\n \n \n setShowPreferences(!showPreferences)}\n className=\"glass-effect rounded-xl p-4 text-white hover:bg-white/20 transition-all duration-300 transform hover:scale-105\"\n >\n

⚙️

Preferences

Customize your experience

\n \n

\n\n {/* Preferences Panel */}\n {showPreferences && (\n

Your Wellness Preferences

\n Current Stress Level\n setPreferences(prev => ({ ...prev, stressLevel: e.target.value as any }))}\n className=\"w-full p-2 rounded-lg bg-white/20 text-white border border-white/30\"\n >\n \n \n \n \n

\n \n

\n Available Time\n setPreferences(prev => ({ ...prev, availableTime: e.target.value as any }))}\n className=\"w-full p-2 rounded-lg bg-white/20 text-white border border-white/30\"\n >\n \n \n \n \n \n

\n \n

\n Work Environment\n setPreferences(prev => ({ ...prev, workEnvironment: e.target.value as any }))}\n className=\"w-full p-2 rounded-lg bg-white/20 text-white border border-white/30\"\n >\n \n \n \n \n \n

\n \n

\n Location (optional)\n setPreferences(prev => ({ ...prev, location: e.target.value }))}\n placeholder=\"e.g., New York, Downtown\"\n className=\"w-full p-2 rounded-lg bg-white/20 text-white border border-white/30 placeholder-white/60\"\n />\n

\n )}\n\n {/* Chat Messages */}\n

\n {messages.map((message, index) => (\n \n \n

{message.content}

\n {message.timestamp.toLocaleTimeString()}\n

\n ))}\n {isLoading && (\n

🌿

\n The Sage is reflecting...\n

\n )}\n

\n\n {/* Message Input */}\n \n\n {/* Ambient Sounds Suggestion */}\n

\n 💫 For deeper relaxation, try playing some forest sounds, rain on leaves, or gentle wind chimes while you explore\n

\n \n \n );\n}",[],[181,188,195],{"_104":202,"_95":203,"_153":204,"_155":189,"_156":138,"_157":101,"_159":160,"_106":205,"_100":32,"_162":174,"_164":206,"_165":22,"_166":-5,"_167":207,"_98":208},"09f6c0d0-3fb0-11f0-8e38-76b3cceeab13","ChallengeCard.tsx","09f6c1ac-3fb0-11f0-8e38-76b3cceeab13",["D",1748868576239],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState } from \"https://esm.sh/react@18.2.0?deps=react@18.2.0\";\nimport type { WellnessChallenge } from \"../../shared/types.ts\";\n\ninterface ChallengeCardProps {\n challenge: WellnessChallenge;\n}\n\nexport default function ChallengeCard({ challenge }: ChallengeCardProps) {\n const [isCompleted, setIsCompleted] = useState(false);\n const [currentStep, setCurrentStep] = useState(0);\n\n const getCategoryIcon = (category: string) => {\n switch (category) {\n case 'movement': return '🏃';\n case 'breathing': return '🫁';\n case 'mindfulness': return '🧘';\n case 'nutrition': return '🥗';\n case 'nature': return '🌿';\n default: return '✨';\n }\n };\n\n const handleStepComplete = () => {\n if (currentStep < challenge.instructions.length - 1) {\n setCurrentStep(currentStep + 1);\n } else {\n setIsCompleted(true);\n }\n };\n\n const resetChallenge = () => {\n setCurrentStep(0);\n setIsCompleted(false);\n };\n\n return (\n

\n {getCategoryIcon(challenge.category)}\n

{challenge.title}

{challenge.duration}

\n {isCompleted && (\n ✅\n )}\n

\n \n

{challenge.description}

\n \n {!isCompleted ? (\n

\n \n Step {currentStep + 1} of {challenge.instructions.length}\n \n

\n {challenge.instructions[currentStep]}\n

\n \n

\n \n {currentStep < challenge.instructions.length - 1 ? 'Next Step' : 'Complete Challenge'}\n \n {currentStep > 0 && (\n setCurrentStep(currentStep - 1)}\n className=\"px-4 py-2 bg-gray-300 text-gray-700 rounded-lg hover:bg-gray-400 transition-colors\"\n >\n Back\n \n )}\n

\n ) : (\n

🎉

Challenge Complete!

\n Well done! You've taken a beautiful step toward wellness today.\n

\n \n Try Again\n \n

\n )}\n \n {challenge.benefits && challenge.benefits.length > 0 && (\n

Benefits:

\n {challenge.benefits.map((benefit, index) => (\n \n {benefit}\n \n ))}\n

\n )}\n

\n );\n}",[],[181,188,203],{"_104":210,"_95":211,"_153":212,"_155":189,"_156":138,"_157":213,"_159":160,"_106":214,"_100":32,"_162":174,"_164":215,"_165":22,"_166":-5,"_167":216,"_98":217},"fd26ec7c-3faf-11f0-9a3f-76b3cceeab13","WellnessCard.tsx","fd26ed9e-3faf-11f0-9a3f-76b3cceeab13",7,["D",1748868554743],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React from \"https://esm.sh/react@18.2.0?deps=react@18.2.0\";\nimport type { WellnessTip } from \"../../shared/types.ts\";\n\ninterface WellnessCardProps {\n tip: WellnessTip;\n}\n\nexport default function WellnessCard({ tip }: WellnessCardProps) {\n const getCategoryIcon = (category: string) => {\n switch (category) {\n case 'work-life-balance': return '⚖️';\n case 'nutrition': return '🥗';\n case 'mindfulness': return '🧘';\n case 'movement': return '🏃';\n case 'nature': return '🌿';\n default: return '✨';\n }\n };\n\n const getDifficultyColor = (difficulty: string) => {\n switch (difficulty) {\n case 'easy': return 'bg-green-100 text-green-800';\n case 'medium': return 'bg-yellow-100 text-yellow-800';\n case 'challenging': return 'bg-red-100 text-red-800';\n default: return 'bg-gray-100 text-gray-800';\n }\n };\n\n return (\n

\n {getCategoryIcon(tip.category)}\n

{tip.title}

\n {tip.duration && (\n

{tip.duration}

\n )}\n

\n \n {tip.difficulty}\n \n

\n \n

{tip.content}

\n \n {tip.tags && tip.tags.length > 0 && (\n

\n {tip.tags.map((tag, index) => (\n \n {tag}\n \n ))}\n

\n )}\n

\n );\n}",[],[181,188,211],[181,188],{"_104":220,"_95":221,"_153":222,"_155":182,"_156":138,"_157":183,"_159":160,"_106":223,"_100":32,"_162":224,"_164":225,"_165":22,"_166":-5,"_167":226,"_98":227},"d825bbc4-3faf-11f0-822e-76b3cceeab13","index.html","d825bcb4-3faf-11f0-822e-76b3cceeab13",["D",1748868492657],"file","\n\n\n \n \n 🌿 Sage of the City - Urban Wellness Guide\n \n \n \n \n \n \n\n\n

\n \n\n",[],[181,221],{"_104":229,"_95":230,"_153":231,"_155":182,"_156":138,"_157":232,"_159":160,"_106":233,"_100":32,"_162":174,"_164":234,"_165":22,"_166":-5,"_167":235,"_98":236},"db6d1a48-3faf-11f0-a663-76b3cceeab13","index.tsx","db6d1b10-3faf-11f0-a663-76b3cceeab13",5,["D",1748868498159],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React from \"https://esm.sh/react@18.2.0?deps=react@18.2.0\";\nimport { createRoot } from \"https://esm.sh/react-dom@18.2.0/client?deps=react@18.2.0,react-dom@18.2.0\";\nimport App from \"./components/App.tsx\";\n\nconst root = createRoot(document.getElementById(\"root\")!);\nroot.render();",[],[181,230],[181],{"_104":239,"_95":240,"_153":241,"_155":-5,"_156":138,"_157":242,"_159":160,"_106":243,"_100":32,"_162":163,"_164":-5,"_165":22,"_166":-5,"_167":244,"_98":253},"b51676b4-3faf-11f0-a493-76b3cceeab13","shared","6f478362-bbd6-4d93-9f5a-82d81ff8e8f8",2,["D",1748868433834],[245],{"_104":246,"_95":247,"_153":248,"_155":241,"_156":138,"_157":242,"_159":160,"_106":249,"_100":32,"_162":174,"_164":250,"_165":22,"_166":-5,"_167":251,"_98":252},"b5166c00-3faf-11f0-a493-76b3cceeab13","types.ts","b5166caa-3faf-11f0-a493-76b3cceeab13",["D",1748868433834],"// Shared types for Sage of the City\n\nexport interface WellnessTip {\n id: string;\n category: 'work-life-balance' | 'nutrition' | 'mindfulness' | 'movement' | 'nature';\n title: string;\n content: string;\n duration?: string; // e.g., \"2 minutes\", \"5 minutes\"\n difficulty: 'easy' | 'medium' | 'challenging';\n tags: string[];\n}\n\nexport interface WellnessChallenge {\n id: string;\n title: string;\n description: string;\n instructions: string[];\n duration: string;\n category: 'movement' | 'breathing' | 'mindfulness' | 'nutrition' | 'nature';\n benefits: string[];\n completed?: boolean;\n}\n\nexport interface UrbanLocation {\n name: string;\n type: 'park' | 'walking-route' | 'nature-spot' | 'quiet-space';\n description: string;\n benefits: string[];\n accessibility: 'easy' | 'moderate' | 'challenging';\n estimatedTime?: string;\n}\n\nexport interface UserPreferences {\n stressLevel: 'low' | 'medium' | 'high';\n availableTime: '1-2min' | '5-10min' | '15-30min' | '30min+';\n interests: string[];\n location?: string;\n workEnvironment: 'office' | 'remote' | 'hybrid' | 'outdoor';\n}\n\nexport interface SageResponse {\n message: string;\n tips?: WellnessTip[];\n challenges?: WellnessChallenge[];\n locations?: UrbanLocation[];\n quote?: string;\n ambientSounds?: string[];\n}\n\nexport interface ChatMessage {\n role: 'user' | 'sage';\n content: string;\n timestamp: Date;\n type?: 'tip' | 'challenge' | 'location' | 'general';\n}",[],[240,247],[240],{"_104":255,"_95":256,"_153":257,"_155":-5,"_156":138,"_157":258,"_159":22,"_106":259,"_100":32,"_162":224,"_164":260,"_165":22,"_166":-5,"_167":261,"_98":262},"af0409a8-3faf-11f0-898c-76b3cceeab13","README.md","af040a5c-3faf-11f0-898c-76b3cceeab13",1,["D",1748868423651],"# 🌿 Sage of the City - Urban Wellness Guide\n\nA friendly AI wellness guru designed to help busy urbanites find balance between productivity and personal well-being in the fast-paced city environment.\n\n## Features\n\n- **Personalized Wellness Tips**: Work-life balance, healthy eating, and mindfulness advice\n- **Urban Nature Discovery**: Recommendations for nearby parks, walking routes, and nature retreats\n- **Daily Wellness Challenges**: Quick 30-second to 2-minute wellness activities\n- **Motivational Content**: Inspiring quotes and calming ambient sound suggestions\n- **Soothing AI Personality**: Part life coach, part friend - always supportive and understanding\n\n## Project Structure\n\n```\n├── backend/\n│ ├── index.ts # Main Hono server\n│ └── routes/\n│ ├── wellness.ts # Wellness advice and tips\n│ └── challenges.ts # Daily wellness challenges\n├── frontend/\n│ ├── index.html # Main app interface\n│ ├── index.tsx # React frontend\n│ ├── components/\n│ │ ├── App.tsx # Main app component\n│ │ ├── WellnessCard.tsx\n│ │ └── ChallengeCard.tsx\n│ └── style.css # Custom styling\n└── shared/\n └── types.ts # Shared TypeScript types\n```\n\n## Usage\n\nThe Sage provides:\n- Contextual wellness advice based on your current situation\n- Quick wellness challenges you can do anywhere\n- Recommendations for finding nature and calm in urban environments\n- Motivational support with a warm, understanding personality\n\n## Tech Stack\n\n- **Backend**: Hono.js with TypeScript\n- **Frontend**: React with TypeScript\n- **Styling**: TailwindCSS\n- **AI**: OpenAI GPT for personalized wellness advice\n- **Storage**: Val Town Blob for user preferences and challenge history",[],[256],"files",[150,169,179,186,193,201,209,219,228,238,245,254],"counts",{"_267":32,"_268":242,"_269":32,"_270":32},"pulls","branches","forks","envVars","contents",[],{"_104":220,"_156":138,"_153":222,"_95":221,"_164":225,"_162":224,"_100":32,"_155":182,"_106":274,"_157":183,"_166":-5,"_98":275},["D",1748868492657],[181,221],"upstreamProject","upstreamBranch","emptyEnvVars","isNew","flags",[],"routes/_app.x.$handle.$name.branch.$branch.version.$version.code.$",{"_93":94,"_95":96,"_97":43,"_100":101,"_98":99,"_102":284,"_148":289,"_263":326,"_224":327,"_271":330,"_331":-5,"_332":22,"_333":-5,"_334":-5,"_335":-5,"_336":337},{"_104":105,"_95":96,"_106":285,"_108":-5,"_109":22,"_110":111,"_112":-5,"_113":-5,"_14":114,"_115":-5,"_116":22,"_117":-5,"_118":32,"_16":119,"_120":121,"_122":121,"_123":124,"_125":124,"_126":124,"_127":121,"_128":121,"_23":286,"_132":287,"_135":288,"_147":22},["D",1748868399126],{"_93":94,"_130":131},{"_93":94,"_134":131},{"_100":137,"_95":43,"_104":138,"_139":105,"_140":-5,"_141":-5,"_142":-5,"_143":-5,"_144":-5,"_145":96,"_146":94},[290,296,317,323],{"_104":151,"_95":152,"_153":154,"_155":-5,"_156":138,"_157":158,"_159":160,"_106":161,"_100":32,"_162":163,"_164":-5,"_165":22,"_166":-5,"_167":291,"_98":295},[292],{"_104":170,"_95":171,"_153":172,"_155":154,"_156":138,"_157":158,"_159":22,"_106":173,"_100":32,"_162":174,"_164":175,"_165":22,"_166":-5,"_167":293,"_98":294},[],[152,171],[152],{"_104":180,"_95":181,"_153":182,"_155":-5,"_156":138,"_157":183,"_159":160,"_106":184,"_100":32,"_162":163,"_164":-5,"_165":22,"_166":-5,"_167":297,"_98":316},[298,310,313],{"_104":187,"_95":188,"_153":189,"_155":182,"_156":138,"_157":190,"_159":160,"_106":191,"_100":32,"_162":163,"_164":-5,"_165":22,"_166":-5,"_167":299,"_98":309},[300,303,306],{"_104":194,"_95":195,"_153":196,"_155":189,"_156":138,"_157":190,"_159":160,"_106":197,"_100":32,"_162":174,"_164":198,"_165":22,"_166":-5,"_167":301,"_98":302},[],[181,188,195],{"_104":202,"_95":203,"_153":204,"_155":189,"_156":138,"_157":101,"_159":160,"_106":205,"_100":32,"_162":174,"_164":206,"_165":22,"_166":-5,"_167":304,"_98":305},[],[181,188,203],{"_104":210,"_95":211,"_153":212,"_155":189,"_156":138,"_157":213,"_159":160,"_106":214,"_100":32,"_162":174,"_164":215,"_165":22,"_166":-5,"_167":307,"_98":308},[],[181,188,211],[181,188],{"_104":220,"_95":221,"_153":222,"_155":182,"_156":138,"_157":183,"_159":160,"_106":223,"_100":32,"_162":224,"_164":225,"_165":22,"_166":-5,"_167":311,"_98":312},[],[181,221],{"_104":229,"_95":230,"_153":231,"_155":182,"_156":138,"_157":232,"_159":160,"_106":233,"_100":32,"_162":174,"_164":234,"_165":22,"_166":-5,"_167":314,"_98":315},[],[181,230],[181],{"_104":239,"_95":240,"_153":241,"_155":-5,"_156":138,"_157":242,"_159":160,"_106":243,"_100":32,"_162":163,"_164":-5,"_165":22,"_166":-5,"_167":318,"_98":322},[319],{"_104":246,"_95":247,"_153":248,"_155":241,"_156":138,"_157":242,"_159":160,"_106":249,"_100":32,"_162":174,"_164":250,"_165":22,"_166":-5,"_167":320,"_98":321},[],[240,247],[240],{"_104":255,"_95":256,"_153":257,"_155":-5,"_156":138,"_157":258,"_159":22,"_106":259,"_100":32,"_162":224,"_164":260,"_165":22,"_166":-5,"_167":324,"_98":325},[],[256],[290,292,296,298,300,303,306,310,313,317,319,323],{"_104":220,"_95":221,"_153":222,"_155":182,"_156":138,"_157":183,"_159":160,"_106":328,"_100":32,"_162":224,"_164":225,"_165":22,"_166":-5,"_98":329},["D",1748868492657],[181,221],[],"upstream","showCompareCallout","pull","ahead","behind","templates",[],"actionData","errors"]