\n {t('error', state.language)}\n

Failed to initialize the app

\n \n

\n );\n }\n\n return (\n

\n {/* Header */}\n

🍲

\n {t('appTitle', state.language)}\n

\n {t('appGreeting', state.language)}\n

\n \n

\n\n {/* Main Content */}\n

\n {state.currentView === 'mood' && (\n \n )}\n \n {state.currentView === 'food' && (\n \n )}\n \n {state.currentView === 'music' && (\n \n )}\n \n {state.currentView === 'favorites' && (\n \n )}\n \n {state.currentView === 'journal' && (\n \n )}\n

\n\n {/* Bottom Navigation */}\n

\n {[\n { id: 'mood', icon: '💭', label: t('moodCheckIn', state.language) },\n { id: 'food', icon: '🍲', label: t('foodRecommendations', state.language) },\n { id: 'music', icon: '🎵', label: t('musicSuggestions', state.language) },\n { id: 'favorites', icon: '❤️', label: t('favorites', state.language) },\n { id: 'journal', icon: '📖', label: t('journal', state.language) }\n ].map((item) => (\n handleViewChange(item.id as View)}\n className={`flex flex-col items-center py-2 px-3 rounded-lg transition-all ${\n state.currentView === item.id\n ? 'bg-amber-100 text-amber-800'\n : 'text-amber-600 hover:bg-amber-50'\n }`}\n >\n {item.icon}\n {item.label}\n \n ))}\n

\n\n {/* Welcome Message for New Users */}\n {!state.lastMoodEntry && state.currentView === 'mood' && (\n

🌟

\n {t('appGreeting', state.language)}\n

\n {state.language === 'en' \n ? \"Welcome to your healing journey. Let's start by checking in with how you're feeling today.\"\n : \"Bienvenue dans votre voyage de guérison. Commençons par vérifier comment vous vous sentez aujourd'hui.\"\n }\n

\n setState(prev => ({ ...prev, lastMoodEntry: {} as MoodEntry }))}\n className=\"btn-primary w-full\"\n >\n {state.language === 'en' ? \"Let's Begin\" : \"Commençons\"}\n \n

\n )}\n

\n );\n}","deleted","label",[167,168,149],"frontend","components","permalink","https://www.val.town/x/that_girl/soulandfood/code/frontend/components/App.tsx","extension","actionData","errors"]